欢送关注前端小讴的github，浏览更多原创技术文章

根本包装类型

相干代码 →

3 个非凡的援用类型 Boolean、Number、String
每读取一个根本类型值，后盾就创立一个对应的根本包装类型的对象

var s1 = 'some text'
var s2 = s1.substring(2) // 根本类型不是对象，本不应该有办法

// 因为后盾主动实现了下列解决：
var s1 = new String('some text') // 1.创立String类型的实例
var s2 = s1.substring(2) // 2.在实例上调用指定办法
s1 = null // 3.销毁该实例

上述步骤同样实用于 Boolean 和 Number类型
援用类型和根本包装类型的次要区别在于对象的生存期：
- 援用类型：来到作用域前，对象始终在内存中
- 根本包装类型：执行完，立刻被销毁

var s1 = 'some text'
s1.color = 'red' // 创立String对象
console.log(s1.color) // undefined，s1对象已被销毁，同时再次创立String对象，新对象没有color属性

对根本包装类型的实例调用 typeof 会返回”Object”，所有根本包装类型的对象都会被转换为布尔值 true
Object 构造函数，依据传入值的类型返回根本包装类型的实例

var objText = new Object('some text') // 创立String的实例
console.log(objText instanceof String) // true
var objBoolean = new Object(false) // 创立Boolean的实例
console.log(objBoolean instanceof Boolean) // true
var objNumber = new Object(123) // 创立Number的实例
console.log(objNumber instanceof Number) // true
console.log(objNumber instanceof Boolean) // false

应用 new 调用根本包装类型的构造函数 vs 间接调用同名的转型函数

var value = '25'
var number = Number(value) // 转型函数，转成Number类型
console.log(typeof number) // number
var obj = new Number(value) // 构造函数，结构Number对象实例
console.log(typeof obj) // object

Boolean 类型

var booleanObject = new Boolean(true) // 调用Boolean构造函数，并传入true/false

重写（继承）的办法	返回值
valueOf()	`Boolean` true / false
toString()	`String` “true” / “false”

根本类型布尔值 vs 援用类型布尔值：
- typeof 操作符对根本类型返回 boolean，对援用类型返回 object
- instance 操作符对根本类型返回 false，对援用类型返回 true

var falseObj = new Boolean(false) // falseObj是根本包装类型，被转换成true（所有根本包装类型对象都会被转换成true）
var falseValue = false // falseValue是根本类型，就是false

console.log(falseObj && true) // true
console.log(falseValue && true) // false
console.log(typeof falseObj) // object，根本包装类型
console.log(typeof falseValue) // boolean，根本类型
console.log(falseObj instanceof Boolean) // true，Boolean对象是Boolean类型的实例
console.log(falseValue instanceof Boolean) // false

Number 类型

var numberObject = new Number(10) // 调用Number构造函数，并传入数值

重写（继承）的办法	返回值
valueOf()	`Number` 数值
toLocaleString()	`String` 字符串模式的数值
toString()	`String` 字符串模式的数值

为 toString()办法传递示意基数的参数，通知返回几进制的字符串模式

var num1 = 10
console.log(num1.toString()) // 十进制，"10"
console.log(num1.toString(2)) // 二进制，"1010"
console.log(num1.toString(8)) // 八进制，"12"
console.log(num1.toString(10)) // 十进制，"10"
console.log(num1.toString(16)) // 十六进制，"a"

格式化字符串办法	返回值
toFixed(num)	`String` 指定小数位
toExponential(num)	`String` 指数表示法
toPrecision(num)	`String` 返回 fixed 或 exponential 格局

var num2 = 10000
console.log(num2.toFixed(2)) // 指定小数位，"10000.00"
console.log(num2.toExponential(2)) // 指数表示法，"1.00e+4"

var num3 = 99
console.log(num3.toPrecision(1)) // 用一位数示意，"1e+2"
console.log(num3.toPrecision(2)) // 用二位数示意，"99"
console.log(num3.toPrecision(3)) // 用三位数示意，"99.0"

根本类型数值 vs 援用类型数值：
- typeof 操作符对根本类型返回 number，对援用类型返回 object
- instance 操作符对根本类型返回 false，对援用类型返回 true

var numberObject = new Number(10)
var numberValue = 10
console.log(typeof numberObject) // object，根本包装类型
console.log(typeof numberValue) // value，根本类型
console.log(numberObject instanceof Number) // true，Number对象是Number类型的实例
console.log(numberValue instanceof Number) // false

String 类型

var StringObject = new String('hello world') // 调用String构造函数，并传入字符串

重写（继承）的办法	返回值
valueOf()	`String` 字符串值
toLocaleString()	`String` 字符串值
toString()	`String` 字符串值

String 类型每个实例都有 length 属性，示意字符串蕴含的字符数量，双节字符也算作 1 个字符

console.log(stringObject.length) // "11"

字符办法	返回值
charAt(num)	给定地位的字符
charCodeAt()	给定地位的字符编码

console.log(stringObject.charAt(1)) // "e"
console.log(stringObject.charCodeAt(1)) // "101"
console.log(stringObject[1]) // "e"

字符串操作方法	返回值
concat()	拼接失去的字符串
slice(num1,num2)	被操作字符串的子字符串
substring(num1,num2)	被操作字符串的子字符串
substr(num1,num2)	被操作字符串的子字符串

console.log(stringObject.concat(' wonderful')) // "hello world wonderful"
console.log(stringObject.slice(3)) // "lo world"
console.log(stringObject.substring(3)) // "lo world"
console.log(stringObject.substr(3)) // "lo world"
console.log(stringObject.slice(3, 7)) // "lo w"，第二个参数指定到哪里完结（不蕴含）
console.log(stringObject.substring(3, 7)) // "lo w"，第二个参数指定到哪里完结（不蕴含）
console.log(stringObject.substr(3, 7)) // "lo worl"，第二个参数指定要返回的字符个数

console.log(stringObject.slice(-3)) // "rld"，-3转换为11-3=8
console.log(stringObject.substring(-3)) // "hello world"，-3转换为0
console.log(stringObject.substr(-3)) // "rld"，-3转换为11-3=8
console.log(stringObject.slice(3, -4)) // "lo w"，-4转换为11-3=7
console.log(stringObject.substring(3, -4)) // "lo w"，-4转换为0，substring(3,0)再转换为substring(0,3)
console.log(stringObject.substr(3, -4)) // ""，-4转换为0，返回蕴含零个字符的字符串

字符串地位办法	返回值
indexOf()	子字符串的地位，前 → 后搜寻
lastIndexOf()	子字符串的地位，后 → 前搜寻

console.log(stringObject.indexOf('o')) // 4
console.log(stringObject.lastIndexOf('o')) // 7
console.log(stringObject.indexOf('o', 6)) // 7，第二个参数示意从哪个地位开始搜寻
console.log(stringObject.lastIndexOf('o', 6)) // 4，第二个参数示意从哪个地位开始搜寻

var loremString =
  'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.'
var position = new Array()
var pos = loremString.indexOf('o')
while (pos > -1) {
  position.push(pos)
  pos = loremString.indexOf('o', pos + 1)
}
console.log(position) // 所有蕴含o的字符地位汇合

trim()办法	返回值
trim()	创立正本，删除前置后缀空格，返回正本
trimLeft()	创立正本，删除前置空格，返回正本
trimRight()	创立正本，删除后缀空格，返回正本

var stringValue = '  hello world  '
var trimStringValue = stringValue.trim()
console.log(stringValue) // "  hello world  "
console.log(trimStringValue) // "hello world"

字符串大小写转换方法	返回值
toLowerCase()	转小写
toLocaleLowerCase()	依据地区转小写
toUpperCase()	转大写
toLocaleUpperCase()	依据地区转大写

console.log(stringObject.toUpperCase()) // "HELLO WORLD"
console.log(stringObject.toLocaleUpperCase()) // "HELLO WORLD"
console.log(stringObject.toLowerCase()) // "hello world"
console.log(stringObject.toLocaleLowerCase()) // "hello world"

字符串模式匹配办法	返回值
match()	数组
search()	首个匹配项索引，没有返回-1
replace()	替换后的字符串
split()	宰割成多个字符串，放在数组中

var text = 'cat, bat, sat, fat'
var pattern = /.at/

var matches = text.match(pattern)
console.log(matches) // [ 'cat',index: 0,input: 'cat, bat, sat, fat',groups: undefined ]
// match办法返回一个数组，第一项与整个模式匹配的字符串，前面的项保留着与正则表达式捕捉匹配的字符串
console.log(matches.index) // 0
console.log(matches[0]) // "cat"
console.log(pattern.lastIndex) // 0

var pos = text.search(/at/)
console.log(pos) // 1，记录"at"首次在字符串呈现的地位

var result = text.replace('at', 'ond')
console.log(result) // "cond, bat, sat, fat"，第一个参数是字符串所以只替换第一个匹配的
result = text.replace(/at/g, 'ond')
console.log(result) // "cond, bond, sond, fond"，第一个参数是全局正则所以替换全副的
result = text.replace(/(.at)/g, 'word($1)')
console.log(result) // "word(cat), word(bat), word(sat), word(fat)"，$1示意第一个匹配的参数

function htmlEscape(text) {
  return text.replace(/[<>"&]/g, function (match, pos, originalText) {
    switch (match) {
      case '<':
        return '&lt;'
        break
      case '>':
        return '&gt;'
        break
      case '&':
        return '&amp;'
        break
      case '"':
        return '&quot;'
        break
    }
  })
}
console.log(htmlEscape('<p class="greeting">Hello world!</p>')) // "&lt;p class=&quot;greeting&quot;&gt;Hello world!&lt;/p&gt;"

console.log(text.split(',')) // [ 'cat', ' bat', ' sat', ' fat' ]
console.log(text.split(',', 2)) // [ 'cat', ' bat' ]，第二个参数指定数组大小
console.log(text.split(/[^\,]+/)) // [ '', ',', ',', ',', '' ]，通过正则获取蕴含都好字符的数组，正则指定分隔符呈现在了字符串结尾和开端，因而首位是空字符串

localeCompare()办法	返回值
localeCompare()	字符串参数在字母表中的前后关系

var stringCompare = 'yellow'
console.log(stringCompare.localeCompare('brick')) // 1，brick字母表在yellow之前
console.log(stringCompare.localeCompare('yellow')) // 0，yellow字母表与yellow雷同
console.log(stringCompare.localeCompare('zoo')) // -1，zoo字母表在yellow之后

function determineOrder(value) {
  var result = stringCompare.localeCompare(value)
  result < 0 &&
    console.log(`The string 'yellow' comes before the string ${value}.`)
  result > 0 &&
    console.log(`The string 'yellow' comes after the string ${value}.`)
  result === 0 &&
    console.log(`The string 'yellow' is equal to the string ${value}.`)
}
determineOrder('brick') // "The string 'yellow' comes after the string brick."
determineOrder('yellow') // "The string 'yellow' is equal to the string zoo."
determineOrder('zoo') // "The string 'yellow' comes before the string zoo."

fromCharCode()办法	返回值
fromCharCode()	转换后的字符串

// 将若干字符编码转换成字符串，与charCodeAt()相同
console.log(String.fromCharCode(104, 101, 108, 108, 111)) // "hello"

html 办法	返回值
anchor(name)	`<a name="name">string</a>`
big()	`<big>string</big>`
bold()	`<b>string</b>`
fixed()	`<tt>string</tt>`
fontcolor(color)	`<font color="color">string</font>`
fontsize(size)	`<font size="size">string</font>`
italics()	`<i>string</i>`
link(url)	`<a herf="url">string</a>`
small()	`<small>string</small>`
strike()	`<strike>string</strike>`
sub()	`<sub>string</sub>`
sup()	`<sup>string</sup>`

总结 & 问点

根本包装类型蕴含哪些非凡的援用类型？读取时后盾经验了什么步骤？
援用类型和根本包装类型的次要区别是什么？
对根本包装类型的实例调用 typeof 会返回什么？根本包装类型的对象都会被转换为什么？
请应用 Object 构造函数判断根本包装类型的实例
应用 new 调用根本包装类型的构造函数与间接调用同名转型函数的区别是什么？
Boolean 的援用类型重写了哪些办法？其根本类型和援用类型的区别是什么？
Number 的援用类型重写了哪些办法？提供了哪些格式化字符串办法？其根本类型和援用类型的区别是什么？
String 的援用类型重写了哪些办法？提供了哪些字符串操作或解析办法？其根本类型和援用类型的区别是什么？
请阐明 charAt()、charCodeAt()、concat()、slice()、substr()、substring()、indexOf()、lastIndexOf()、trim()、toLowerCase()、toUpperCase()、match()、search()、replace()、split()、localeCompare()、fromCharCode()等办法的含意，并举出相干例子

关于javascript:javascript高级程序设计学习笔记-56基本包装类型

根本包装类型

Boolean 类型

Number 类型

String 类型

总结 & 问点

评论

发表回复取消回复

更多文章

DDN HPC 存储硬件架构设计深度分析

探秘IO500：从Lustre并行文件系统出发，开启HPC存储性能新征程

苹果iOS打包的ipa应用无法安装？一篇文章带你了解可能的原因及排查方法

图解Golang：从零开始实现简易版过期LRU缓存

关于javascript:javascript高级程序设计学习笔记-56基本包装类型

根本包装类型

Boolean 类型

Number 类型

String 类型

总结 & 问点

评论

发表回复 取消回复

更多文章

DDN HPC 存储硬件架构设计深度分析

探秘IO500：从Lustre并行文件系统出发，开启HPC存储性能新征程

苹果iOS打包的ipa应用无法安装？一篇文章带你了解可能的原因及排查方法

图解Golang：从零开始实现简易版过期LRU缓存

发表回复取消回复