一、概述
ES5
的对象属性名都是字符串,这容易造成属性名的冲突。比如,你使用了一个他人提供的对象,但又想为这个对象添加新的方法(mixin
模式),新方法的名字就有可能与现有方法产生冲突。如果有一种机制,保证每个属性的名字都是独一无二的就好了,这样就 从根本上防止属性名的冲突。这就是 ES6
引入 Symbol
的原因。
ES6
引入了一种新的原始数据类型 Symbol
,表示独一无二的值。它是 JavaScript
语言的第七种数据类型,前六种是:
-
undefined
-
null
-
布尔值(
Boolean
) -
字符串(
String
) -
数值(
Number
) -
对象(
Object
)。
1. 定义
Symbol
值通过 Symbol
函数生成。这就是说,对象的属性名现在可以有两种类型:
-
一种是原来就有的字符串,
-
另一种就是新增的
Symbol
类型。
凡是属性名属于 Symbol
类型,就都是独一无二的,可以保证不会与其他属性名产生冲突。
let s = Symbol(); typeof s // "symbol"
上面代码中,变量 s
就是一个独一无二的值。typeof
运算符的结果,表明变量 s
是 Symbol
数据类型,而不是字符串之类的其他类型。
注意,Symbol
函数前不能使用 new
命令,否则会报错。这是因为生成的 Symbol
是一个原始类型的值,不是对象。也就是说,由于 Symbol
值不是对象,所以不能添加属性。基本上,它是一种类似于字符串的数据类型。
Symbol
函数可以接受一个字符串作为参数,表示对 Symbol
实例的描述,主要是为了在控制台显示,或者转为字符串时,比较容易区分。
let s1 = Symbol('foo'); let s2 = Symbol('bar'); s1 // Symbol(foo) s2 // Symbol(bar) s1.toString() // "Symbol(foo)" s2.toString() // "Symbol(bar)"
上面代码中,s1
和 s2
是两个 Symbol
值。如果不加参数,它们在控制台的输出都是 Symbol()
,不利于区分。有了参数以后,就等于为它们加上了描述,输出的时候就能够分清,到底是哪一个值。
如果 Symbol
的参数是一个对象,就会调用该对象的 toString
方法,将其转为字符串,然后才生成一个 Symbol
值。
const obj = { toString() { return 'abc'; } }; const sym = Symbol(obj); sym // Symbol(abc)
2. 所有的 Symbol 值都不相等
注意,Symbol
函数的参数只是表示对当前 Symbol
值的描述,因此相同参数的 Symbol
函数的返回值是不相等的。
// 没有参数的情况 let s1 = Symbol(); let s2 = Symbol(); s1 === s2 // false // 有参数的情况 let s1 = Symbol('foo'); let s2 = Symbol('foo'); s1 === s2 // false
上面代码中,s1
和 s2
都是 Symbol
函数的返回值,而且参数相同,但是它们是不相等的。
3. Symbol 值不能与其他类型进行运算
Symbol
值不能与其他类型的值进行运算,会报错。
let sym = Symbol('My symbol'); "your symbol is " + sym // TypeError: can't convert symbol to string `your symbol is ${sym}` // TypeError: can't convert symbol to string
4. Symbol 可转换为其他值
1> Symbol
值可以显式转为字符串。
let sym = Symbol('My symbol'); String(sym) // 'Symbol(My symbol)' sym.toString() // 'Symbol(My symbol)'
2> Symbol
值也可以转为布尔值,但是不能转为数值
let sym = Symbol(); Boolean(sym) // true !sym // false if (sym) { // ... } Number(sym) // TypeError sym + 2 // TypeError
二、Symbol.prototype.description
创建 Symbol
的时候,可以添加一个描述。
const sym = Symbol('foo');
上面代码中,sym
的描述就是字符串 foo
。
但是,读取这个描述需要将 Symbol
显式转为字符串,即下面的写法。
const sym = Symbol('foo'); String(sym) // "Symbol(foo)" sym.toString() // "Symbol(foo)"
上面的用法不是很方便。ES2019
提供了一个实例属性 description
,直接返回 Symbol
的描述。
const sym = Symbol('foo'); sym.description // "foo"
三、作为属性名的 Symbol
由于每一个 Symbol
值都是不相等的,这意味着 Symbol
值可以作为标识符,用于对象的属性名,就能保证不会出现同名的属性。这对于一个对象由多个模块构成的情况非常有用,能防止某一个键被不小心改写或覆盖。
let mySymbol = Symbol(); // 第一种写法 let a = {}; a[mySymbol] = 'Hello!'; // 第二种写法 let a = { [mySymbol]: 'Hello!' }; // 第三种写法 let a = {}; Object.defineProperty(a, mySymbol, { value: 'Hello!' }); // 以上写法都得到同样结果 a[mySymbol] // "Hello!"
上面代码通过方括号结构和 Object.defineProperty
,将对象的属性名指定为一个 Symbol
值。
注意,Symbol
值作为对象属性名时,不能用点运算符。
const mySymbol = Symbol(); const a = {}; a.mySymbol = 'Hello!'; a[mySymbol] // undefined a['mySymbol'] // "Hello!"
上面代码中,因为点运算符后面总是字符串,所以不会读取 mySymbol
作为标识名所指代的那个值,导致 a
的属性名实际上是一个字符串,而不是一个 Symbol
值。
2. 在对象内部使用
在对象的内部,使用 Symbol
值定义属性时,Symbol
值必须放在方括号之中。
let s = Symbol(); let obj = { [s]: function (arg) { ... } }; obj[s](123);
上面代码中,如果 s
不放在方括号中,该属性的键名就是字符串 s
,而不是 s
所代表的那个 Symbol
值。
采用增强的对象写法,上面代码的 obj
对象可以写得更简洁一些。
let obj = { [s](arg) { ... } };
3. Symbol 用作常量
Symbol
类型还可以用于定义一组常量,保证这组常量的值都是不相等的。
const log = {}; log.levels = { DEBUG: Symbol('debug'), INFO: Symbol('info'), WARN: Symbol('warn') }; console.log(log.levels.DEBUG, 'debug message'); console.log(log.levels.INFO, 'info message');
下面是另外一个例子。
const COLOR_RED = Symbol(); const COLOR_GREEN = Symbol(); function getComplement(color) { switch (color) { case COLOR_RED: return COLOR_GREEN; case COLOR_GREEN: return COLOR_RED; default: throw new Error('Undefined color'); } }
常量使用 Symbol
值最大的好处,就是其他任何值都不可能有相同的值了,因此可以保证上面的 switch
语句会按设计的方式工作。
还有一点需要注意,Symbol
值作为属性名时,该属性还是公开属性,不是私有属性。
四、实例:消除魔术字符串
魔术字符串指的是,在代码之中多次出现、与代码形成强耦合的某一个具体的字符串或者数值。风格良好的代码,应该尽量消除魔术字符串,改由含义清晰的变量代替。
一句话,魔术字符串就是程序中反复使用的有语义的字符串,可使用字符串常量或枚举类型来替换。
function getArea(shape, options) { let area = 0; switch (shape) { case 'Triangle': // 魔术字符串 area = .5 * options.width * options.height; break; /* ... more code ... */ } return area; } getArea('Triangle', { width: 100, height: 100 }); // 魔术字符串
上面代码中,字符串 Triangle
就是一个魔术字符串。它多次出现,与代码形成“强耦合”,不利于将来的修改和维护。
常用的消除魔术字符串的方法,就是把它写成一个变量。
const shapeType = { triangle: 'Triangle' }; function getArea(shape, options) { let area = 0; switch (shape) { case shapeType.triangle: area = .5 * options.width * options.height; break; } return area; } getArea(shapeType.triangle, { width: 100, height: 100 });
上面代码中,我们把 Triangle
写成 shapeType
对象的 triangle
属性,这样就消除了强耦合。
如果仔细分析,可以发现 shapeType.triangle
等于哪个值并不重要,只要确保不会跟其他 shapeType
属性的值冲突即可。因此,这里就很适合改用 Symbol 值。
const shapeType = { triangle: Symbol() };
上面代码中,除了将 shapeType.triangle
的值设为一个 Symbol
,其他地方都不用修改。
五、属性名的遍历
Symbol
作为属性名,遍历对象的时候,该属性不会出现在 for...in
、for...of
循环中,也不会被 Object.keys()
、Object.getOwnPropertyNames()
、JSON.stringify()
返回。
但是,它也不是私有属性,有一个 Object.getOwnPropertySymbols()
方法,可以获取指定对象的所有 Symbol
属性名。该方法返回一个数组,成员是当前对象的所有用作属性名的 Symbol
值。
const obj = {}; let a = Symbol('a'); let b = Symbol('b'); obj[a] = 'Hello'; obj[b] = 'World'; const objectSymbols = Object.getOwnPropertySymbols(obj); objectSymbols // [Symbol(a), Symbol(b)]
上面代码是 Object.getOwnPropertySymbols()
方法的示例,可以获取所有 Symbol
属性名。
下面是另一个例子,Object.getOwnPropertySymbols()
方法与 for...in
循环、Object.getOwnPropertyNames
方法进行对比的例子。
const obj = {}; const foo = Symbol('foo'); obj[foo] = 'bar'; for (let i in obj) { console.log(i); // 无输出 } Object.getOwnPropertyNames(obj) // [] Object.getOwnPropertySymbols(obj) // [Symbol(foo)]
上面代码中,使用 for...in
循环和 Object.getOwnPropertyNames()
方法都得不到 Symbol
键名,需要使用 Object.getOwnPropertySymbols()
方法。
六、Symbol.for(),Symbol.keyFor()
有时,我们希望重新使用同一个 Symbol
值,Symbol.for()
方法可以做到这一点。它接受一个字符串作为参数,然后搜索有没有以该参数作为名称的 Symbol
值。如果有,就返回这个 Symbol
值,否则就 新建一个以该字符串为名称的 Symbol
值,并将其注册到全局。
let s1 = Symbol.for('foo'); let s2 = Symbol.for('foo'); s1 === s2 // true
上面代码中,s1
和 s2
都是 Symbol
值,但是它们都是由同样参数的 Symbol.for
方法生成的,所以实际上是同一个值。
1. Symbol.for()
Symbol.for()
与 Symbol()
这两种写法,都会生成新的 Symbol
。它们的区别是,前者会被登记在全局环境中供搜索,后者不会。Symbol.for()
不会每次调用就返回一个新的 Symbol
类型的值,而是会先检查给定的 key
是否已经存在,如果不存在才会新建一个值。比如,如果你调用 Symbol.for("cat")
30
次,每次都会返回同一个 Symbol
值,但是调用 Symbol("cat")
30
次,会返回 30
个不同的 Symbol
值。
Symbol.for("bar") === Symbol.for("bar") // true Symbol("bar") === Symbol("bar") // false
上面代码中,由于 Symbol()
写法没有登记机制,所以每次调用都会返回一个不同的值。
2. Symbol.keyFor()
Symbol.keyFor()
方法返回一个已登记的 Symbol
类型值的 key
。
let s1 = Symbol.for("foo"); Symbol.keyFor(s1) // "foo" let s2 = Symbol("foo"); Symbol.keyFor(s2) // undefined
上面代码中,变量 s2
属于未登记的 Symbol
值,所以返回 undefined
。
注意,Symbol.for()
为 Symbol
值登记的名字,是全局环境的,不管有没有在全局环境运行。
function foo() { return Symbol.for('bar'); } const x = foo(); const y = Symbol.for('bar'); console.log(x === y); // true
上面代码中,Symbol.for('bar')
是函数内部运行的,但是生成的 Symbol
值是登记在全局环境的。所以,第二次运行Symbol.for('bar')
可以取到这个 Symbol
值。
七、实例:模块的 Singleton 模式
Singleton
模式指的是调用一个类,任何时候返回的都是同一个实例。
对于 Node
来说,模块文件可以看成是一个类。怎么保证每次执行这个模块文件,返回的都是同一个实例呢?
很容易想到,可以把实例放到顶层对象 global
。
// mod.js function A() { this.foo = 'hello'; } if (!global._foo) { global._foo = new A(); } module.exports = global._foo;
然后,加载上面的 mod.js
。
const a = require('./mod.js'); console.log(a.foo);
上面代码中,变量 a
任何时候加载的都是 A
的同一个实例。
但是,这里有一个问题,全局变量 global._foo
是可写的,任何文件都可以修改。
global._foo = { foo: 'world' }; const a = require('./mod.js'); console.log(a.foo);
上面的代码,会使得加载 mod.js
的脚本都失真。
为了防止这种情况出现,我们就可以使用 Symbol
。
// mod.js const FOO_KEY = Symbol.for('foo'); function A() { this.foo = 'hello'; } if (!global[FOO_KEY]) { global[FOO_KEY] = new A(); } module.exports = global[FOO_KEY];
上面代码中,可以保证 global[FOO_KEY]
不会被无意间覆盖,但还是可以被改写。
global[Symbol.for('foo')] = { foo: 'world' }; const a = require('./mod.js');
如果键名使用 Symbol
方法生成,那么外部将无法引用这个值,当然也就无法改写。
// mod.js const FOO_KEY = Symbol('foo'); // 后面代码相同 ……
上面代码将导致其他脚本都无法引用 FOO_KEY
。但这样也有一个问题,就是如果多次执行这个脚本,每次得到的 FOO_KEY
都是不一样的。虽然 Node
会将脚本的执行结果缓存,一般情况下,不会多次执行同一个脚本,但是用户可以手动清除缓存,所以也不是绝对可靠。
八、内置的 Symbol 值
除了定义自己使用的 Symbol
值以外,ES6
还提供了 11
个内置的 Symbol
值,指向语言内部使用的方法。
1. Symbol.hasInstance
对象的 Symbol.hasInstance
属性,指向一个内部方法。当其他对象使用 instanceof
运算符,判断是否为该对象的实例时,会调用这个方法。比如,foo instanceof Foo
在语言内部,实际调用的是 Foo[Symbol.hasInstance](foo)
。
class MyClass { [Symbol.hasInstance](foo) { return foo instanceof Array; } } [1, 2, 3] instanceof new MyClass() // true
上面代码中,MyClass是一个类,new MyClass()会返回一个实例。该实例的Symbol.hasInstance方法,会在进行instanceof运算时自动调用,判断左侧的运算子是否为Array的实例。
下面是另一个例子。
class Even { static [Symbol.hasInstance](obj) { return Number(obj) % 2 === 0; } } // 等同于 const Even = { [Symbol.hasInstance](obj) { return Number(obj) % 2 === 0; } }; 1 instanceof Even // false 2 instanceof Even // true 12345 instanceof Even // false
2. Symbol.match
对象的Symbol.match属性,指向一个函数。当执行str.match(myObject)时,如果该属性存在,会调用它,返回该方法的返回值。
String.prototype.match(regexp) // 等同于 regexp[Symbol.match](this) class MyMatcher { [Symbol.match](string) { return 'hello world'.indexOf(string); } } 'e'.match(new MyMatcher()) // 1
3. Symbol.search
对象的Symbol.search属性,指向一个方法,当该对象被String.prototype.search方法调用时,会返回该方法的返回值。
String.prototype.search(regexp) // 等同于 regexp[Symbol.search](this) class MySearch { constructor(value) { this.value = value; } [Symbol.search](string) { return string.indexOf(this.value); } } 'foobar'.search(new MySearch('foo')) // 0
4. Symbol.iterator
对象的 Symbol.iterator
属性,指向该对象的默认遍历器方法。
const myIterable = {}; myIterable[Symbol.iterator] = function* () { yield 1; yield 2; yield 3; }; [...myIterable] // [1, 2, 3]
对象进行 for...of
循环时,会调用 Symbol.iterator
方法,返回该对象的默认遍历器,详细介绍参见《Iterator
和 for...of
循环》一章。
class Collection { *[Symbol.iterator]() { let i = 0; while(this[i] !== undefined) { yield this[i]; ++i; } } } let myCollection = new Collection(); myCollection[0] = 1; myCollection[1] = 2; for(let value of myCollection) { console.log(value); } // 1 // 2
九、总结
1. 什么是 Symbol?
Symbol 是 ES6 中的一个新的基本数据类型,其值是唯一的。
-
定义时,可指定一个描述字符串,用于区分:
Symbol.protype.description
-
const s = Symbol('xxx')
:每次创建新的 -
const s = Symbol.for('key')
:全局唯一-
const key = Symbol.keyFor(s)
:查找键
-
-
-
不能和其他任何类型一起运算
-
可转换为
String
和Boolean
-
和对象使用时,只能使用
[]
语法 -
用途:
-
可用做属性名,确保属性名的唯一性
-
可用做常量或枚举类型,可以在
switch
中使用 -
消除魔术字符串(类似枚举值)
-
-
遍历
Symbol
类型-
Object.getOwnPropertySymbols(o)
-
-
内置
Symbol