js中的装箱和拆箱操作

装箱操作： 把基本数据类型转换为对应的引用类型的操作
拆箱操作： 把引用类型转换为基本数据类型的操作

上面两个概念只是简洁的实质总结，可能看完后大家心里会产生疑问，到底怎么样叫装箱操作和拆箱操作呢？下面我们一起带着这个疑问往下看~~

• 装箱操作：
  首先我们要知道在js中有三个基本包装类型：

  • Number

  • String

  • Boolean

    下面看一个例子：

      var str="hello world";
      var strRes=str.split(" ");
      console.log(strRes)		//["hello", "world"]
    

    如上面代码所示，变量str是一个基本类型值，不是一个对象，就不存在方法，但上面代码却显示可以正常调用方法。实际上这一切都是js内部做了以下处理：
    （1）创建String类型的一个实例；
    （2）在实例上调用指定的方法；
    （3）销毁这个实例；
    转换为对应代码就是：

    var str=new String("hello world");
    var strRes=str.split(" ");
    str=null;
    

    其实，说白了就是临时创建了一个对象，然后去调用方法。下面这句话引用自《javascript高级程序设计》一书中

    每当读取一个基本类型的时候，后台就会创建一个对应的基本包装类型对象，从而让我们能够调用一些方法来操作这些数据。

• 拆箱操作：

  拆箱操作中主要有两个方法，valueOf()方法和toString()方法。这两个方法主要用来检测你返回的是不是一个基本类型的值。一般是先用valueOf()来检测，如果返回的不是一个基本类型的值，是对象自身，则会继续用toString()来检测，如果检测结果不是一个基本类型的值，则会报错(Uncaught SyntaxError: Invalid or unexpected token)。以下是两个方法的具体描述，引用自MDN。

  • valueOf

    1.valueOf() 方法返回指定对象的原始值。
    2.JavaScript调用valueOf方法将对象转换为原始值。你很少需要自己调用valueOf方法；当遇到要预期的原始值的对象时，JavaScript会自动调用它。
    3.默认情况下，valueOf方法由Object后面的每个对象继承。 每个内置的核心对象都会覆盖此方法以返回适当的值。如果对象没有原始值，则valueOf将返回对象本身。
    4.JavaScript的许多内置对象都重写了该函数，以实现更适合自身的功能需要。因此，不同类型对象的valueOf()方法的返回值和返回值类型均可能不同

  • toString

    1.toString() 方法返回一个表示该对象的字符串。
    2.每个对象都有一个 toString() 方法，当该对象被表示为一个文本值时，或者一个对象以预期的字符串方式引用时自动调用。
    3.默认情况下，toString() 方法被每个 Object 对象继承。如果此方法在自定义对象中未被覆盖，toString() 返回 “[object type]”，其中 type 是对象的类型。

  下面通过代码来分析具体什么叫做拆箱操作：

  []+[]	//""
  {}+{}	//"[object Object][object Object]"
  []+{}	//"[object Object]"
  {}+[]	//0
  

  如上面代码所示，右边注释的是其对应的结果，下面逐个分析其中的原理：

  （1）[]+[],[]自身是一个空数组，即是一个对象，[]会先被valueOf()检测返回自身,还是[],然后使用toString()检测返回空字符""，实际最终是""+""，所以最终结果还是一个""。
  （2）{}+{}，在js中{}可以表示一个代码块，也可以表示一个对象。在此处作为一个对象来运算，({}).valueOf()检测结果为自身，继续检测，({}).toString()检测结果为"[object Object]"，所以{}+{}相当于"[object Object]"+"[object Object]"，故结果为"[object Object][object Object]"。
  （3）[]+{},从上面分析可以知道，这个相当于""+"[object Object]"，所以结果为"[object Object]"。
  （4）{}+[],上面三个或许大多数人都能明白，但这个估计就会有人有疑问了，为什么会是0呢？首先，这里的{}被当做了代码块，由于编译原理底层一些机制，会涉及到词法分析、语法分析、语义分析、代码生成这些知识，这里+[]相当于+""，因为运算符+的原因，会将+""隐式转换为+0，所以结果最终为0。

  相信大家到这里应该基本明白什么是装箱操作，什么是拆箱操作了吧！

拓展

通过上面的学习，基本原理大家应该都已经知道了，在这留一个例题，大家可以将自己的分析或想法写在评论区，看看是不是真正的理解了其中的知识，例题如下(结果直接告诉大家了，具体还是需要自己去一步一步分析，才能真正掌握理解，我相信大家都是很厉害的哦！！！)：

([][[]]+[])[+!![]]+([]+{})[!+[]+!![]]	//"nb"

!! 一般用来将后面的表达式强制转换为布尔类型的数据(boolean)，只能是true or false.
例：!![] //true,[]自身就是对象，会先转换成true，![]会将其转换为false，!![]再将其转换为true，实际上就是自身的布尔值.