Javascript 简明教程

JavaScript - The Symbol Object

JavaScript Symbol

在 JavaScript 中, Symbol 是原始数据类型,它在 ECMAScript 6 (ES6) 中引入。可以使用“Symbol”构造函数创建它。

与字符串或数字等其他原始数据类型不同,符号是不可变且唯一的。它们在需要唯一标识符的情况下特别有用,因为它们提供了一种创建私有对象属性并避免命名冲突的方法。在这里,我们列出了与符号相关的属性和方法。

在使用符号时,应记住以下几点。

  1. 每个符号都包含唯一的值。

  2. 符号是不可变的。这意味着你不能更新符号的值。

  3. 符号用于定义唯一对象属性。

  4. 符号的类型不能更改。

Syntax

你可以按照以下语法使用 Symbol() 函数创建新符号。−

const sym = Symbol([description]);

这里 description 是可选参数。它指定符号描述,你可以使用 'description' 属性访问该描述。

Symbol Properties

在以下表格中,我们列出了 Symbol 的所有属性−

Sr.No.

Name & Description

1

description 获取符号对象的可选描述。

2

asyncIterator 它将对象更改为异步可迭代对象。

3

hasInstance 检查构造函数对象是否将其包含的对象计算为其实例。

4

isConcatSpreadable 它确定在使用 array.concat() 方法时,是否应将数组连接为对象或扁平数组。

5

iterator 返回符号的迭代器。

6

match 使用字符串匹配正则表达式。

7

matchAll 返回正则表达式与字符串的所有匹配内容。

8

replaceTo replace a substring.

9

search 获取匹配值的索引。

10

species 创建派生对象。

11

split 指定使用正则表达式匹配时,从匹配索引处分割字符串的方法。

12

toStringTag 为对象创建默认字符串描述。

Symbol Methods

在以下表格中,我们列出了 Symbol 的所有方法:

Sr.No.

Name & Description

1

for() 搜索给定的符号。

2

keyFor() 从全局符号注册中检索键。

3

toString() 将符号转换为字符串。

4

valueOf() 获取符号对象的原始值。

Examples

Example: Creating a Symbol

在下面的示例中,我们使用 Symbol() 函数创建一个新符号。此外,在定义 sym2 符号时,我们传递了字符串参数。

你可以观察到 'sym1' 的类型是 'symbol',它是一个原始值。

<html>
   <body>
      <p id="output"></p>
      <script>
         const sym1 = Symbol();
         document.getElementById("output").innerHTML =
			"The sym1 is: " + sym1.toString() + "<br>" +
         "The type of sym1 is: " + typeof sym1 + "<br>";
         const sym2 = Symbol("description");
         document.getElementById("output").innerHTML += "The sym2 is: " + sym2.toString();
      </script>
   </body>
</html>

当我们执行上面的脚本时,它将生成一个由网页上显示的文本组成的输出。

The sym1 is: Symbol()
The type of sym1 is: symbol
The sym2 is: Symbol(description)

Example: Accessing Symbol Description

让我们看一个例子,在例子中,我们使用 .description 获得符号的描述。

<html>
   <body>
      <p id="output"></p>
      <script>
         const sym = Symbol("Welcome to Tutorials Point...");
         document.getElementById("output").innerHTML =
			"The sym description of the symbol is : " + sym.description;
      </script>
   </body>
</html>

在执行上面脚本后,输出窗口将弹出,显示网页上的文本。

The sym description of the symbol is : Welcome to Tutorials Point...

Example: Each Symbol is Unique

在下面的代码中,我们定义了 sym1 和 sym2 符号。然后,我们比较这两个变量,然后根据需要打印消息。

这两个符号看起来很相似,但是是不同的,你可以从输出中看到。

<html>
   <body>
      <p id="output"></p>
      <script>
         const sym1 = Symbol();
         const sym2 = Symbol();

         if (sym1 == sym2) {
            document.getElementById("output").innerHTML += "Sym1 and Sym2 are equal.";
         } else {
            document.getElementById("output").innerHTML += "Sym1 and Sym2 are not equal.";
         }
      </script>
   </body>
</html>

执行之后,它返回一段文本,表示两个符号不相等。

Sym1 and Sym2 are not equal.

Example: Using Symbol as an Object Key

符号的主要目的是用作对象键。此处,我们使用了 'objId' 符号作为键。

当我们将对象转换为字符串或者遍历对象属性时,它不会打印符号。因此,符号可以帮助开发人员将对象属性设为私有。

<html>
   <body>
      <p id="output">The object is: </p>
      <script>
         const objId = Symbol();
         const person = {
            name: "John Doe",
            age: 30,
            [objId]: "abcd123",
         }
         document.getElementById("output").innerHTML += JSON.stringify(person);
      </script>
   </body>
</html>

如果我们执行上述程序,它会生成由网页上显示的文本组成的输出。

The object is: {"name":"John Doe","age":30}

Benefits of using Symbols

此处,我们解释了在实时开发中使用符号的好处。

  1. Unique property keys − 即使它的描述不同,每个符号都是唯一的。因此,你可以将符号用作键,避免同名键之间发生意外冲突。主要是在你需要在两个不同的代码段中使用对象的同一实例并且需要插入相同属性时它很有用。

  2. Non-iterable properties − 当你在 JavaScript 中添加符号作为键并且使用 for…​in 循环遍历对象属性时,循环不会遍历符号键。

  3. Private Members − 你可以在 JavaScript 类中使用符号来定义私有属性。

  4. Avoid overWriting − 符号是唯一的,因此它避免了覆盖类似的属性。