普通符号
ES6 引入了一种新的原始数据类型 Symbol ，表示独一无二的值，最大的用法是用来定义对象的唯一属性名。
ES6 数据类型除了 Number 、 String 、 Boolean 、 Object、 null 和 undefined ，还新增了 Symbol 。
符号是ES6新增的一个数据类型，它通过使用函数symbol(符号名)来创建。符号设计的初衷，是为了给对象设置私有属性。
私有成员：只能在对象内部使用，外部无法使用。
符号具有以下特点：
1. 没有字面量。
2. 使用 typeof 得到的类型是 symbol。
const a = Symbol("abc");
const b = Symbol("abc");
console.log(typeof a, typeof b); // Symbol Symbol
- 每次调用 symbol 函数得到的符号永远不相等，无论符号名是否相同。
const a = Symbol("abc");
const b = Symbol("abc");
console.log(a === b); // false
4. 符号可以作为对象的属性名存在，这种属性称之为符号属性。
const a = Symbol("abc");
const b = Symbol("abc");
const obj = {
a: 0,
b: 1,
[a]: 3,
[b]: 4
}
console.log(obj); // {a: 0, b: 1, Symbol(abc): 3, Symbol(abc): 4}
console.log(obj[a], obj[b]); // 3 4
- 开发者可以通过精心的设计，让这些属性无法通过常规方式被外界访问；
const obj = {
a: 0,
b: 1,
[Symbol("abc")]: 3,
[Symbol("d")]: 4
}
console.log(obj); // {a: 0, b: 1, Symbol(abc): 3, Symbol(d): 4}
console.log(obj[Symbol("abc")]); // undefined
- 符号属性是不能枚举的，因此在 for-in 循环中无法读取到符号属性，Object.keys 方法也无法读取到符号属性；
const obj = {
a: 0,
b: 1,
[Symbol("abc")]: 3,
[Symbol("d")]: 4
}
console.log(obj); // {a: 0, b: 1, Symbol(abc): 3, Symbol(d): 4}
for(var prop in obj) {
console.log(prop); // a b
}
console.log(Object.keys(obj)); // ["a", "b"]
- Object.getOwnPropertyNames 尽管可以得到所有无法枚举的属性，但是仍然无法读取到符号属性；
const obj = {
a: 0,
b: 1,
[Symbol("abc")]: 3,
[Symbol("d")]: 4
}
console.log(obj); // {a: 0, b: 1, Symbol(abc): 3, Symbol(d): 4}
console.log(Object.getOwnPropertyNames(obj)); // ["a", "b"]
- ES6新增 Object.getOwnPropertySymbols 方法，可以读取符号；
const obj = {
a: 0,
b: 1,
[Symbol("abc")]: 3,
[Symbol("d")]: 4
}
console.log(obj); // {a: 0, b: 1, Symbol(abc): 3, Symbol(d): 4}
console.log(Object.getOwnPropertySymbols(obj)); // [Symbol(abc), Symbol(d)]
5. 符号无法被隐式转换，因此不能被用于数学运算、字符串拼接或其他隐式转换的场景，但符号可以显示的转换为字符串，通过 String 构造函数进行转换即可，console.log 之所以可以输出符号，是它在内部进行了显示转换。
const a = Symbol("abc");
console.log(String(a) + 1); // Symbol(abc)1
共享符号
根据某个符号名称（符号描述）能够得到同一个符号。
Symbol.for("符号名/符号描述"); // 获取共享符号
const a = Symbol.for("abc");
const b = Symbol.for("abc");
const obj = {
[a]: 1,
[Symbol.for("123")]: 2
}
console.log(a === b); // true
console.log(obj[Symbol.for("123")]); // 2
模拟Symbol.for();的实现
const SymbolFor = (() => {
const global = {}; // 用于记录有哪些共享符号
return function(name) {
// console.log(global);
if(!global[name]) {
global[name] = Symbol(name);
}
// console.log(global);
return global[name];
}
})()
const a = SymbolFor("123");
const b = SymbolFor("123");
console.log(a === b); // true
知名（公共、具名）符号
知名符号是一些具有特殊含义的共享符号，通过 Symbol 的静态属性得到。ES6延续了ES5的思想：减少魔法，暴露内部实现！因此，ES6用知名符号暴露了某些场景的内部实现。
1. Symbol.hasInstance
该符号用于定义构造函数的静态成员，它将影响 instanceof 的判定。
obj instanceof A
// 等效于
A[Symbol.hasInstance](obj) // Function.prototype[Symbol.hasInstance]
function A() {
console.log("A");
}
Object.defineProperty(A, Symbol.hasInstance, {
value: function(obj) {
return false;
}
})
const a = new A();
console.log(a instanceof A); // false
2. Symbol.isConcatSpreadable
该知名符号会影响数组的 concat 方法。
const arr1 = [1];
const arr = [2, 3];
const obj = {
a: 4,
b: 5,
length: 2,
}
const arr2 = arr1.concat(10, arr, obj);
console.log(arr2); // [1, 10, 2, 3, {…}]
arr[Symbol.isConcatSpreadable] = false;
const obj1 = {
a: 4,
b: 5,
length: 2,
[Symbol.isConcatSpreadable]: false
}
const arr3 = arr1.concat(10, arr, obj1);
console.log(arr3); // [1, 10, Array(2), {…}]
3. Symbol.toPrimitive
该知名符号会影响类型转换的结果。
const obj = {
a: 1,
b: 2
}
console.log(obj * 2); // NaN
obj[Symbol.toPrimitive] = function() {
return 2;
}
console.log(obj * 2); // 4
class Temperature {
constructor(degree) {
this.degree = degree;
}
[Symbol.toPrimitive](type) {
// console.log(type);
if(type === "default") {
return this.degree + "摄氏度";
}else if(type === "number") {
return this.degree;
}else if(type === "string") {
return this.degree + "°C"
}
}
}
const t = new Temperature(30);
console.log(t + "1"); // 30摄氏度1
console.log(t / 2); // 15
console.log(String(t)); // 30°C
4. Symbol.toStringTag
该知名符号会影响 Object.prototype.toString 的返回值。
class Person{
}
const p = new Person();
const arr = [1, 2, 3];
console.log(Object.prototype.toString.apply(p)); // [object Object]
console.log(Object.prototype.toString.apply(arr)); // [object Array]
class Person1{
[Symbol.toStringTag] = "Person";
}
const p1 = new Person1();
console.log(Object.prototype.toString.apply(p1)); // [object Person]
- 其他知名符号