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

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 不胜感激 !
来自 “开源世界 ” ,链接: https://ym.baisou.ltd/post/739.html ,如需转载,请注明出处,否则将追究法律责任。 ​​​​​​

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

CRMEB定制开发

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值