JavaScript Symbol的用法

女爷i 2023-10-02 09:17 9阅读 0赞

# 1. Symbol是什么 #

Symbol是ES6 引入了一种新的基本类型，表示独一无二的值。它是 JavaScript 语言的第七种数据类型，前六种是：undefined、null、boolean、string、number、object。

# 2. Symbol 语法 #

Symbol([description])   // description为Symbol的描述，不影响Symbol的唯一

# 3. Symbol的特点 #

*  独一无二，`Symbol('a')`和`Symbol('a')`是不相等的
 *  不能使用`new`关键字创建对象，`new Symbol()`是不合法的
 *  Symbol值无法参与运算，无法隐式转成字符串，会报`TypeError`
 *  作为对象属性无法用`.`运算符，但是可以使用方括号`[]`
 *  作为对象属性，无法被循环遍历，如`for...in`、`for...of`，也不会被`Object.keys`、`Object.getOwnPropertyNames`、`JSON.stringify`返回
 *  `Object.getOwnPropertySymbols`方法，可以获取对象的所有 Symbol 属性名
 *  `Reflect.ownKeys`可以返回所有类型的键名，包括常规键名和 Symbol 键名

看下面的例子，加深印象：

# 4. Symbol的使用场景 #

## 模拟私有属性 ##

由于Symbol作为对象属性时不参与遍历，而且无法使用字符串key值访问，所以可以模拟私有属性。

js内置对象中也大量使用Symbol，比如`Symbol.iterator`，访问对象的迭代器。或者`Symbol.toPrimitive`，将对象转成原始值。

在Symbol出现之前，人们经常使用`__`前缀来表示私有属性。

## 消除魔法字符串 ##

假如我们有一个枚举：

const colors = {
        
    	RED: 'red',
    	GREEN: 'green',
    	BLUE: 'blue'
    };

我们用`colors.RED`表示红色，只要保证它的值和其他颜色的值不同即可，值是什么不重要，这时就可以用Symbol代替

const colors = {
        
    	RED: Symbol(),
    	GREEN: Symbol(),
    	BLUE: Symbol()
    };

## 防止属性名冲突 ##