概念: ES6 引入了一种新的原始数据类型Symbol
,表示独一无二的值。
1-使用Symbol作为对象属性名
let name = Symbol()
let age = Symbol()
var obj = {[name]:"kerwin",[age]:100
}
举例理解:
a.给对象添加独一无二的属性
let obj = {name: 'Jack'
}let name = Symbol()
obj[name] = "Mike"console.log(obj); // {name: 'Jack', Symbol(): 'Mike'}
console.log(obj[name]); // Mike
b. 便于定义公共库
这里封装属性和方法时, 全部采取Symbol类型, 这样别人就算往里面加name、age等同名的属性或方法, 也不会影响对象原本使用
let keys = {name: Symbol(),age: Symbol(),location: Symbol(),test: Symbol(),
}
let obj = {[keys.name]: "Mike",[keys.age]: 100,[keys.location]: "WUXI",[keys.test](){console.log("test");}
}
console.log(obj); // {Symbol(): 'Mike', Symbol(): 100, Symbol(): 'WUXI'}
obj[keys.test]() // test
注意:
let s1 = Symbol()//1. 不能进行运算
console.log(s1>2); // Uncaught TypeError: Cannot convert a Symbol value to a number//2. 显示调用toString()
console.log(s1.toString() + "aaa");//3. 隐式转换boolean
if(s1){console.log("执行");
}
2-Symbol()函数可以接受一个字符串作为参数,表示对 Symbol 实例的描述。这主要是为了在控制台显示,比较容易区分。
let keys = {name: Symbol("name"),age: Symbol("age"),location: Symbol("localtion"),test: Symbol("test"),
}
let obj = {[keys.name]: "Mike",[keys.age]: 100,[keys.location]: "WUXI",[keys.test](){console.log("test");}
}
console.log(obj);
// {Symbol(name): 'Mike', Symbol(age): 100, Symbol(localtion): 'WUXI', Symbol(test): ƒ}
3-遍历问题
Symbol的值无法被for in进行遍历
let keys = {name:Symbol("name"),age:Symbol("age")
}
var obj = {[keys.name]:"kerwin",[keys.age]:100,a:1,b:2,c:3
}// 输出对象中的普通属性
for(let i in obj) {console.log(i); // a b c
}// 输出对象中的Symbol属性
console.log(Object.getOwnPropertySymbols(obj)); // [Symbol(name), Symbol(age)]// 遍历输出 Reflect.ownKeys(obj) 可以找到对象中所有的属性,并返回一个数组
Reflect.ownKeys(obj).forEach(item=>{console.log(item,obj[item])
})
/*** Symbol(name) 'kerwin'* test.html:32 Symbol(age) 100
*/
补充: 拿到Symbol的属性Object.getOwnPropertySymbols(obj)
4-Symbol.for()可以重新使用同一个 Symbol 值
var obj ={[Symbol.for("name")]:"kerwin",[Symbol.for("age")]:100
}console.log(obj[Symbol.for("name")]) // kerwin
5-Symbol表示独一无二的常量
case只能使用规定常量
const VIDEO = Symbol();
const AUDIO = Symbol();
const IMAGE = Symbol();function play(type) {switch(type) {case VIDEO:console.log("VIDEO");break;case AUDIO:console.log("AUDIO");break;case IMAGE:console.log("IMAGE");break;}
}play(VIDEO) // VIDEO
参考: 千锋 011-ES6-Symbol_哔哩哔哩_bilibili