前言
在 ECMAScript 2015 规范中引入了 Symbol 类型，它可以作为属性名，但是不会与其他属性名冲突。在 ECMAScript 2016 中，Symbol 类型得到了进一步的完善和增加了一些操作符。本文将深入剖析 Symbol 类型及其操作符的基本概念、用法、实现原理和注意事项。
Symbol 类型
基本概念
Symbol 是一种原始数据类型，表示独一无二的值。Symbol 值通过 Symbol 函数生成，Symbol 函数可以接受一个可选的字符串参数，用于标识生成的 Symbol 值。这个字符串参数只是用于调试和说明用途，不会影响到 Symbol 值的唯一性。
-- -------------------- ---- ------- ----- ---- - --------- ----- ---- - -------------- ------------------ ------ -- -------- ------------------ ------ -- -------- ---------------- --- ------ -- ---- ---------------- --- ------ -- ----- ----------------------------- -- -------------
用法
- 作为属性名
Symbol 值可以作为对象属性名，这个属性名不会与其他属性名冲突。使用 Object.getOwnPropertySymbols 方法可以获取对象上所有 Symbol 类型的属性名。
-- -------------------- ---- ------- ----- -------- - ------------------- ----- --- - --- ------------- - ------ ------- --------------------------- -- ------ ------ ----- ------- - ---------------------------------- --------------------- -- ------------------
- 枚举 Symbol 属性名
使用 Object.getOwnPropertySymbols 和 Reflect.ownKeys 方法可以枚举对象上所有 Symbol 类型的属性名。
-- -------------------- ---- ------- ----- --------- - -------------------- ----- --------- - -------------------- ----- --- - - ------------ -------- ------------ -------- -- ---------------------------------- -- - ------------------ ----------------- -
- Symbol.iterator
Symbol.iterator 属性指向一个返回迭代器对象的函数，用于在对象上定义一个默认的迭代器。只有实现了这个函数的对象才能使用 for...of 循环。
-- -------------------- ---- -------
----- ---------- - -
------------------ --------- -- -
----- --
----- --
----- --
-
--
--- ---- - -- ----------- -
---------------
-
-- -
-- -
-- -- Symbol.toPrimitive
Symbol.toPrimitive 属性指向一个方法，用于指定对象被转换为原始值时的行为。详见 MDN Web Docs。
- 其他 Symbol 属性
Symbol 类型还有一些其他的属性，比如 Symbol.hasInstance、Symbol.isConcatSpreadable、Symbol.match 等，它们都是用来定义对象或函数的行为的。具体用法和实现原理可以参考 MDN Web Docs。
Symbol 操作符
基本概念
Symbol 操作符是一些专门针对 Symbol 值的运算符。在 ECMAScript 2016 中，加入了 4 个新的 Symbol 操作符：Symbol.asyncIterator、Symbol.isRegExp、Symbol.matchAll 和 Symbol.replace。除此之外，还有一些常见的 Symbol 操作符，如 Symbol.iterator、Symbol.hasInstance、Symbol.toPrimitive 等。
Symbol 操作符定义了一些接口，方便开发者进行自定义行为的实现。这些接口是以 Symbol 值为键的属性，只要在对象上定义了这些属性，就可以自定义这些操作符的行为。
用法
- Symbol.iterator
Symbol.iterator 用于定义对象的默认迭代器。一个对象如果有 Symbol.iterator 属性，就被认为是可迭代的。
-- -------------------- ---- -------
----- ------ -
------------- -
---------- - ---
-
------------------- -
--- ----- - --
----- ----- - -----------
------ -
----- ---------- -
-- ------ - ------------- -
------ - ------ --------------- ----- ----- --
- ---- -
------ - ------ ---------- ----- ---- --
-
-
--
-
-
----- ---- - --- ---------
-----------------------
-----------------------
-----------------------
--- ---- ---- -- ----- -
------------------
-
-- -----
-- -----
-- ------ Symbol.toPrimitive
Symbol.toPrimitive 用于控制对象被转换为原始值时的行为。
-- -------------------- ---- -------
----- --- - -
-------------------------- -
------ ------ -
---- ---------
------ ----
---- ---------
------ ------
---- ----------
------ ----------
--------
----- --- --------
-
-
--
--------------- - --- -- ---
---------------------------- -- -----
------------------------- -- -----
------------------------- -- ---
--------------------------- -- ---------- Symbol.hasInstance
Symbol.hasInstance 用于确定一个值是否为某个构造函数的实例。
class MyClass {}
const obj = new MyClass();
console.log(MyClass[Symbol.hasInstance](obj)); // true
console.log(Array[Symbol.hasInstance](obj)); // false- Symbol.match
Symbol.match 用于控制字符串的 match 方法。
class MyRegExp {
static [Symbol.match](str) {
const match = /The answer is (\d+)/.exec(str);
return match ? match[1] : null;
}
}
console.log('The answer is 42'.match(MyRegExp)); // "42"- Symbol.replace
Symbol.replace 用于控制字符串的 replace 方法。
class MyReplace {
static [Symbol.replace](str, replacement) {
return str.replace('foo', replacement.toUpperCase());
}
}
console.log('hello foo world'.replace(MyReplace, 'bar')); // "hello BAR world"- 常用的 Symbol 操作符
除了上面介绍的 4 个 Symbol 操作符之外，还有一些常用的 Symbol 操作符，比如 Symbol.for、Symbol.keyFor、Symbol.isConcatSpreadable、Symbol.species 等，可以参考 MDN Web Docs。
总结
Symbol 类型和操作符是 ECMAScript 规范中的重要功能，可以方便开发者进行自定义行为的实现。本文分别介绍了 Symbol 类型和操作符的基本概念、用法、实现原理和注意事项，并给出了详细的示例代码。希望本文对您了解 Symbol 类型和操作符有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65a4e656add4f0e0ffd410bf