前端百题—— js中的包装对象

深藏阁楼爱情的钟 2022-10-09 02:48 16阅读 0赞

1 背景  
有一个奇怪的现象不知道大家注意过没有，字符串、数字、布尔值都能够调用属性和方法，例如：

const str = ‘123’;  
console.log(typeof(str)); // string  
console.log(str.toString()); // 123  
const num = 123;  
console.log(typeof(num)); // number  
console.log(num.toString()); // 123  
const bool = true;  
console.log(typeof(bool)); // boolean  
console.log(bool.toString()); // true  
复制代码  
看到这个现象，大家是不是感觉很奇怪，这与我们平时的想法是相悖的，毕竟我们认为基本类型上面是不存在属性和方法的，这个时候主角包装对象就出现了。

2 包装对象  
JS 的数值，布尔，字符串类型的变量，在一定条件下，也可以自动变成对象，这就是原始类型的包装对象。包装对象其实是一种特殊的引用类型，其与引用类型的主要区别在于生命周期。

一般的引用类型在使用new创建其实例时，在执行流离开当前作用域之前一直都保存在内存中；  
包装类型的对象只存在该行代码的执行瞬间，然后会立即被销毁。（也意味着在运行时不能为基本类型添加属性和方法）  
3 包装对象后台执行流程  
基本类型中的String、Number、Boolean在调用属性和方法的时候，后台是怎样执行的呢？其实整个过程可以简化为三步：

创建一个对象类型的实例，例如字符串则创建一个String类型的实例；  
调用该实例对象上的特定方法；  
销毁该实例。  
以字符串为例，来演示该流程：

const str = ‘abc’;  
const strNew = str.substring(0, 2);  
复制代码  
在运行到str.substring(0, 2)的时候其实偷偷执行了以下三步：

let strObj = new String(str);  
const strNew = strObj.substring(0, 2);  
strObj = null;  
复制代码  
4 扩展  
包装对象和同样的原始类型的值相等吗？  
不相等。因为包装对象是引用类型，原始类型是基本类型；包装对象的最大目的，首先是使得 JavaScript 的对象涵盖所有的值，其次使得原始类型的值可以方便地调用某些方法。

如何给基本类型添加属性和方法？  
在基本包装对象的原型下面添加，每个对象都有原型。

同一个字符串调用两次相同的方法其包装对象相等吗？  
不相等。调用结束后，包装对象实例会自动销毁。这意味着，下一次调用字符串的属性时，实际是调用一个新生成的对象，而不是上一次调用时生成的那个对象，这也说明了为什么不能直接给字符串、数字、布尔值添加属性和方法。

1.如果觉得这篇文章还不错，来个分享、点赞吧，让更多的人也看到

如果你觉得这篇文章对你有点用的话，麻烦请给我们的开源项目点点star： [http://github.crmeb.net/u/defu][http_github.crmeb.net_u_defu] 不胜感激 ！  
来自 “开源世界 ” ，链接： [https://ym.baisou.ltd/post/739.html][https_ym.baisou.ltd_post_739.html] ，如需转载，请注明出处，否则将追究法律责任。

[http_github.crmeb.net_u_defu]: http://github.crmeb.net/u/defu
[https_ym.baisou.ltd_post_739.html]: https://ym.baisou.ltd/post/739.html