装箱和拆箱(js的问题)

简介: 装箱和拆箱(js的问题)

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

var num = 123;
var numObj = new Number(123);
 
console.log(typeof num) // number
console.log(typeof numObj) // object

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

var numObj = new Number(123);
 
console.log(numObj.valueOf()) // 123
 
console.log(typeof numObj.valueOf()) // number

拆箱操作原理:

内部执行
 
toPrimitive(input, type)
input 传入的值
type 值类型
 
1. 如果是原始类型的值直接返回
2. 如果不是,调用 input.valueOf() 是原始类型就返回
3. 如果不是,继续调用  input.toString() 是原始类型就返回
4. 报错
valueOf()  有原始类型的值返回,没有返回对象本身
toString() 对象[object type] type:对象类型

例题1:

console.log([] + [])
<empty string>
 
// 分析:
console.log([])
Array []
 
console.log([].valueOf())
Array []
 
console.log([].toString())
<empty string>

例题2:

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
目录
打赏
0
0
0
0
31
分享
相关文章
JavaScript中的原型 保姆级文章一文搞懂
本文详细解析了JavaScript中的原型概念,从构造函数、原型对象、`__proto__`属性、`constructor`属性到原型链,层层递进地解释了JavaScript如何通过原型实现继承机制。适合初学者深入理解JS面向对象编程的核心原理。
60 1
JavaScript中的原型 保姆级文章一文搞懂
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
153 2
|
4月前
JS+CSS3文章内容背景黑白切换源码
JS+CSS3文章内容背景黑白切换源码是一款基于JS+CSS3制作的简单网页文章文字内容背景颜色黑白切换效果。
40 0
基于springboot+vue.js+uniapp的小区物流配送系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的小区物流配送系统附带文章源码部署视频讲解等
224 5
基于springboot+vue.js+uniapp的家政平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的家政平台附带文章源码部署视频讲解等
104 3
基于springboot+vue.js+uniapp的宠物援助平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的宠物援助平台附带文章源码部署视频讲解等
120 4
基于springboot+vue.js+uniapp的宠物交易平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的宠物交易平台附带文章源码部署视频讲解等
118 4

热门文章

最新文章

AI助理

你好,我是AI助理

可以解答问题、推荐解决方案等