JavaScript中的神秘角色:包装对象

251 阅读3分钟

当我们在 JavaScript 中调用字符串的 toUpperCase() 方法时,有没有好奇过这基础数据类型也没有原型链,它哪里来的replace、split,、toFixed等这些方法呢?

这正是因为 JavaScript 中的一个神秘角色:包装对象

那什么是包装对象呢?

概念

在我们深入了解包装对象之前,先让我们从一个简单的例子开始:

let str = "Hello, world!";
console.log(str.length);

等一下,这不是一个字符串字面量吗?怎么能获取它的 length 属性呢?这就是包装对象的魔法开始发挥作用的地方。当我们操作一个基础数据类型数据(比如字符串、数字或布尔值)的属性时,JavaScript 引擎会暂时将其包装成对应的包装对象(这里是一个 String 对象)。一旦操作完毕,这个包装对象就会自动销毁

那什么是包装对象呢

JavaScript 中,除了基本数据类型之外,其他所有的值都是对象。这些对象都是通过构造函数创建的,包括数组、函数、日期、正则表达式等等。但是,对于基本数据类型,由于它们不是对象,因此不能直接调用方法或者访问属性

为了让基本数据类型也能像对象一样具有方法和属性,JavaScript 在必要时会自动将基本数据类型转换为对应的包装对象,然后在包装对象上调用方法或访问属性。这些包装对象是临时创建的,使用完毕后会自动销毁

具体来说,JavaScript 为每个基本数据类型都提供了一个对应的包装对象,包装对象与基本数据类型的关系如下:

  • Boolean 对应的包装对象是 Boolean
  • Number 对应的包装对象是 Number
  • String 对应的包装对象是 String
  • Symbol 对应的包装对象是 Object

例如,当我们调用字符串的 toUpperCase() 方法时,JavaScript 会将字符串转换为一个临时创建的 String 包装对象,然后在包装对象上调用 toUpperCase() 方法:

let str = "hello";
let result = str.toUpperCase();
console.log(result); // "HELLO"

上面的代码中,我们调用了字符串的 toUpperCase() 方法,这实际上是将字符串转换为临时创建的 String 包装对象,然后在包装对象上调用 toUpperCase() 方法,最终返回大写的字符串

使用场景

  1. 类型转换:包装对象可以将基本数据类型转换为对象类型,从而使其具有对象的特性和行为。例如,可以使用Number() 函数将数字转换为 Number 对象
  2. 调用操作方法,例如上面例子的中的 let result = str.toUpperCase()

注意

需要注意的是,由于包装对象是临时创建的,因此我们不能在包装对象上添加属性或方法,也不能修改包装对象的值。

例如,下面的代码尝试在字符串的包装对象上添加一个属性,但是该属性并没有被添加到原始的字符串上:

let str = "hello";
str.name = "world"; // 尝试给字符串添加名为 "name" 的属性
console.log(str.name); // undefined,因为该属性被添加到了临时创建的包装对象上,而不是原始的字符串上

在上面的代码中,尽管我们给字符串添加了一个名为 name 的属性,但是当我们尝试访问该属性时,它返回了 undefined,因为该属性被添加到了临时创建的包装对象上,而不是原始的字符串上。这是因为字符串是基本数据类型,不是对象,它们没有原型链,也没有方法和属性。

结尾

通过这篇文章,我们知道了包装对象的概念、使用场景,以及它稍纵即逝的存在过程等,希望大家通过本文的介绍,能够更好地理解和应用 JavaScript 中的包装对象

最后祝大家变得更强!