图片授权基于 www.pixabay.com 相关协议
先回忆一下基础的知识点。
基本类型：字符串（String）、数字(Number)、布尔(Boolean)、空（Null）、未定义（Undefined）、Symbol
引用类型：对象(Object)、数组(Array)、函数(Function)
在 JavaScript 中，有四个基本的包装类型 String、Number、Boolean、Symbol。
基本类型转成引用类型就是装箱；装箱分隐式装箱和显示装箱两种装箱方式。
先说「隐式装箱」，隐式装箱是由「引擎自动执行」的。
let web = \\\'Javascript\\\';web.subText = \\\'JavaScriptSub\\\';web.subTextFn = function(){ console.log(\\\'JavascriptSubTextFn\\\');};console.log(web.subText);//undefinedconsole.log(web.subTextFn());//Uncaught TypeError: web.subTextFn is not a function
那装箱都做了什么？
在读取值的时候，引擎会创建一个基本类型所对应的「包装类型的对象」，见下图。
let web = 123;web.toString();//执行装箱，执行完后，会立即清除
基本类型的值，是没有方法的，但在 toString() 的时候，会执行装箱操作，以此来包装成一个对象，随后清除。
所以，我们在基本类型值上可以使用方法，是因为有「装箱」操作。let webStr = new String(\\\'Javascript\\\');webStr.addFunctionFn = function(){ console.log(\\\'输出 addFunctionFn\\\')}webStr.addFunctionFn();
显示装箱可以添加属性和方法的~ 隐式装箱是不能添加属性和方法的。必须要提两个方法 toString() 和 valueOf() ，toString() 返回字符串，valueOf() 返回对象本身。//更改对象的 toString() 和 valueOf() 两个方法：var web = { \\\'name\\\':\\\'html\\\', valueOf: () => { console.log(\\\"valueOf\\\"); }, toString: () => { console.log(\\\"toString\\\"); }}console.log(String(web))//toString undefinedconsole.log(Number(web))//valueOf NaN
执行的逻辑是什么？为什么有时候先走 valueOf() ？为什么有时候先执行 toString()？对象中有 toPrimitive 方法，此方法提供了用于将对象强制转换为基元并替换 toString() 和 valueOf() 方法的通用接口。运行方法时，判断 PreferredType 的值是哪种类型？2、否则，输入是一个对象，调用 obj.valueOf() 方法，如果结果是原始的，则将其返回。3、否则，调用 obj.toString() 方法，如果结果是原始数据，则将其返回。如果为 String ？那需要交换 2 和3 的执行顺序。如果没有 PreferredType ，对于 Date 的实例将其设置为 String。我自己对于拆箱还是有一些疑惑的，上面写的是我理解的表面逻辑，估计还有很多没有注意到的细节，后续有启发，会补发内容。
推荐阅读
为什么「局部变量」访问速度快
参考文档：
[1]http://www.ecma-international.org/ecma-262/#sec-toprimitive
[2]https://medium.com/intrinsic/javascript-object-type-coercion-b2ec176c02c4
[3]https://learnku.com/articles/7394/conversion-of-objects-to-basic-type-values-in-javascript
[4]https://blog.csdn.net/DLGDark/article/details/100836377
[5]https://time.geekbang.org/column/article/78884
原创文章，作者：小道研究，如若转载，请注明出处：https://www.sudun.com/ask/34624.html
