装箱和拆箱（js的问题）

泡芙·草莓2023-12-24 21:11

装箱：基本数据类型 -> 引用数据类型

html 复制代码

var num = 123;
var numObj = new Number(123);

console.log(typeof num) // number
console.log(typeof numObj) // object

拆箱：引用数据类型 -> 基本数据类型

html 复制代码

var numObj = new Number(123);

console.log(numObj.valueOf()) // 123

console.log(typeof numObj.valueOf()) // number

拆箱操作原理：

html 复制代码

内部执行

toPrimitive(input, type)
input 传入的值
type 值类型

1. 如果是原始类型的值直接返回
2. 如果不是，调用 input.valueOf() 是原始类型就返回
3. 如果不是，继续调用  input.toString() 是原始类型就返回
4. 报错

html 复制代码

valueOf()  有原始类型的值返回，没有返回对象本身
toString() 对象[object type] type：对象类型

例题1：

html 复制代码

console.log([] + [])
<empty string>

// 分析：
console.log([])
Array []

console.log([].valueOf())
Array []

console.log([].toString())
<empty string>

例题2：

html 复制代码

console.log([] + {})
[object Object]

// 分析：
console.log({}.valueOf())
{}

console.log({}.toString())
[object Object]

// 交换位置，{}可能被识别为代码块
console.log({} + [])
[object Object] 或 0

console.log(+ [])
0

console.log(+ '')
0

console.log(+ {})
NaN