JavaScript中的装箱与拆箱

JS中数据类型可以分为两大类：基本类型与引用类型
其中基本类型包括：字符串（String）、数字(Number)、布尔(Boolean)、空（Null）、未定义（Undefined）、Symbol。
引用类型包括：数组（Array）、对象（Object）、函数（Function）。
在JS中，有四个基本的包装类型String、Number、Boolean、Symbol。

一、装箱操作

概念：将基本数据类型转换成相应的引用类型的操作。装箱操作分为隐式装箱与显式装箱两种类型。
1、隐式装箱：如下例

  var str1="hello world"  //隐式装箱
  var str2=str1.substring(2)；

上面的代码执行步骤是这样的：

  <1> 创建String类型的一个实例；
  <2> 在实例中调用制定的方法
  <3> 销毁这个实例。

用代码实现是这样的：

 var str1 = new String('person');
 var str2=str1.substring(2)；
 str1 = null;

所以，我们在基本类型值上可以使用方法（比如string的substring等），是因为有「隐式装箱」操作。

隐式装箱当读取一个基本类型值时，后台会创建一个该基本类型所对应的基本包装类型对象。在这个基本类型的对象上调用方法，其实就是在这个基本类型对象上调用方法。这个基本包装类型的对象是临时的，它只存在于方法调用那一行代码执行的瞬间，执行方法后立即被销毁。这也是在基本类型上添加属性和方法会不识别或报错的原因了。

2、显式装箱：通过基本包装类型对象对基本类型进行显式装箱，如下例：

  var str = new String('person');

显式装箱的操纵可以对new出来的对象进行属性和方法的添加啦，因为通过new操作符创建的引用类型的实例，在执行流离开当前作用域之前一直保留在内存中。

var objStr = new String('person');
    objStr.name = 'Lily';
    objStr.action = function(){
         console.log('how are you');
 }
console.log(objStr.name); // Lily
objStr.action(); // how are you

注意：显式装箱可以添加属性和方法的，隐式装箱是不能添加属性和方法的。

二、拆箱操作

概念：把引用类型转换成基本的数据类型。通常通过引用类型的valueOf()和toString()方法来实现。toString() 返回字符串，valueOf() 返回对象本身。

在下面的代码中，留意下valueOf()和toString()返回值的区别：

var objNum = new Number(64);
var objStr = new String('64');
console.log(typeof objNum); // object
console.log(typeof objStr); // object
拆箱：
console.log(typeof objNum.valueOf()); // number 基本的数字类型，想要的
console.log(typeof objNum.toString()); // string 基本的字符类型，不想要的
console.log(typeof objStr.valueOf()); // string 基本的数据类型，不想要的
console.log(typeof objStr.toString()); // string 基本的数据类型，想要的

参考资料：
https://juejin.cn/post/6844903859765133320
https://mp.weixin.qq.com/s/QDHJBCP9E8GyKPlMOExwAA