JavaScript中的自动装箱与拆箱

朴灿烈づ我的快乐病毒、 2022-12-23 00:36 35阅读 0赞

记得以前学习Java的时候有自动装箱与拆箱的概念。比如：

// 自动装箱
    Integer num = 100;
    // 自动拆箱
    int primitiveNum = num;

所谓装箱拆箱就是指基本数据类型与包装类型的自动相互转换。他的目的就是可以简化代码，提升编程体验。

在JavaScript语言中，也是有这样的概念的。

我们知道，JS中有基本数据类型与object类型之分，比如

// 基本数据类型
    console.log(typeof 'hello'); // string
    console.log(typeof 100) // number
    console.log(typeof true) // boolean
    
    // object
    console.log(typeof { }) // object
    console.log(typeof []) // object
    
    // 包装了基本数据乐行的对象类型
    console.log(typeof new String('hello')) // object
    console.log(typeof new Number(100)) // object

以上的代码还是很好理解的。但请看以下的代码：

console.log('hello' == new String('hello')) // ???

各位猜一猜是`true`还是`false`?

哈哈答案是`true`。我们知道，双等于操作符`==`会自动发生类型转换。那么请继续猜一下，是’hello’变成了String Object，还是反过来String Object转换成了基本数据类型string?

其实是`String对象`转换为了基本数据类型`string`。其实这就是一个`拆箱`的过程。这一点详细解释可以参考我之前写的[一篇文章][Link 1]。

事实上，我们经常会使用自动装箱或拆箱，可能只是没有注意到而已。

'hello'.split(''); // ["h", "e", "l", "l", "o"]

可以看到上边`hello`字符串是基本数据类型，哪来的`split`方法？其实这不就是一个自动装箱的过程。

其实这里还有一个疑问，那就是为什么number类型是不会自动装箱的。究其原因，我个人认为因为是JS是动态类型的语言，即声明的时候你不知道他是一个整型还是浮点型。所以：

666.toString(); // Uncaught SyntaxError: Invalid or unexpected token
    
    var confirmedTypeNumber = 666;
    confirmedTypeNumber.toString(); // "666"

此外还有一些自动装箱或拆箱场景，比如：

// 66.66是自动装箱了，所以才可以解构出toFixed方法
    const { toFixed} = 66.66; 
    toFixed.call(Math.PI, 2); // "3.14"

有人说，JS的类型转换太奇葩。其实我看来这只是JS作为一门动态类型语言的自身特性而已。况且作为静态类型的JAVA，同样有自动类型转换。

[Link 1]: https://blog.csdn.net/weixin_43459866/article/details/109804220