Symbol
为啥需要Symbol
ES5
里面对象的属性名都是字符串,如果你需要使用一个别人提供的对象,你对这个对象有哪些属性也不是很清楚,但又想为这个对象新增一些属性,那么你新增的属性名就很可能和原来的属性名发送冲突,显然我们是不希望这种情况发生的。所以,我们需要确保每个属性名都是独一无二的,这样就可以防止属性名的冲突了。因此,ES6
里就引入了Symbol
,用它来产生一个独一无二的值。
Symbol
是什么
Symbol
实际上是ES6
引入的一种原始数据类型,除了Symbol
,JavaScript还有其他5种数据类型,分别是Undefined
、Null
、Boolean
、String
、Number
、对象
,这6种数据类型都是ES5中就有的。
前言
为什么在es5
中对象的属性名不能被重复
let obj = {
name:'huasheng',
name:'花生'
}//我们都知道对象有一个特点
// 那就是如果一个对象他的属性名是重复的话那么就会被覆盖掉(同名的属性名会被覆盖)后面的覆盖前面的
//那么如果写了成千上百行的代码属性重复了就被覆盖掉这样就会影响程序的一些功能的
// 那么为什么属性名一样能被覆盖掉
let obj = {
'name' : 'huasheng',
'name' : '花生',
//其实上面的是对象的完整写法,之所以对象的属性名能被覆盖掉那是因为在全等判断的时候是true说明了
//这两个对象是一个东西所以被覆盖掉('name'==='name')
}
console.log('name'==='name');//对象的完整写法
console.log(name===name);//对象的正常写法
那该怎么让这个name
属性是个独一无二的属性,不能被覆盖掉呢??
es6
新增数据类型 symbol
(生成独一无二的数据的)
用Symbol
函数生成的原始数据类型不存在引用值地址的说法的也是在内存占据空间的
怎么生成一个Symbol
类型的值
既然我们已经知道了Symbol
是一种原始的数据类型,那么怎么生成这种数据类型的值呢?Symbol
值是通过Symbol
函数生成的,如下:
let s1 = Symbol();//生成Symbol数据类型,结果是symbol()
console.log(s1);
console.log(typeof s1);//检测Symbol数据类型,结果是symbol
被Symbol
生成的数据是独一无二(如下)
let s1 = Symbol();
let s2 = Symbol();
console.log(s1===s2);//false
console.log(Object.is(s1,s2));//false
//即使用Symbol生成的数据完全一样,那么也不是一个东西
//(只要是通过Symbol这个函数生成的Symbol数据本质上就是独一无二的,即使你长的一样但是本质也
//是不一样的)
Symbol
函数前不能用new
Symbol
函数不是一个构造函数,前面不能用new
操作符。所以Symbol
类型的值也不是一个对象,不能添加任何属性,它只是一个类似于字符型的数据类型。如果强行在Symbol
函数前加上new
操作符,会报错,如下:
let s = new Symbol();
// Uncaught TypeError: Symbol is not a constructor(…)
Symbol
函数的参数
字符串作为参数
用上面的方法生成的Symbol
值不好进行区分,Symbol
函数还可以接受一个字符串参数,来对产生的Symbol
值进行描述,方便我们区分不同的Symbol
值。
let s1 = Symbol('s1');//Symbol里面的's1'是标识符
console.log(s1)//Symbol(s1)
let s2 = Symbol('s2');
console.log(s2)//Symbol(s2)
console.log(s1===s2);//false是不一样的
//s1和s2这两个Symbol数据不一样是在本身作为Symbol数据才会不一样(Symbol特征)
//不是因为打上了标识符才会不一样
- 给
Symbol
函数加了参数之后,控制台输出的时候可以区分到底是哪一个值; Symbol
函数的参数只是对当前Symbol
值的描述,因此相同参数的Symbol
函数返回值是不相等的
不是以字符串作为参数
如果Symbol
函数的参数是一个对象,就会调用该对象的toString
方法,将其转化为一个字符串,然后才生成一个Symbol
值。所以,说到底,Symbol
函数的参数只能是字符串。
let s3 = Symbol({});
console.log(s3);//Symbol([object Object])
//如果不是字符串形式的数据类型作为Symbol的标识符那么就会转换为字符串形式
//(隐式类型转换默认调用toString函数)Symbol数据的标识符可以被隐式类型转换
Symbol
值不可以进行运算
既然Symbol
是一种数据类型,那我们一定想知道Symbol
值是否能进行运算。告诉你,Symbol
值是不能进行运算的,不仅不能和Symbol
值进行运算,也不能和其他类型的值进行运算,否则会报错。
Symbol
值可以显式转化为字符串和布尔值,但是不能转为数值。
let s1 = Symbol('name');
let s2 = Symbol('age');
// console.log(s1+s2);//报错(不能进行运算)
// Symbol数据是能变成字符串的
console.log(typeof s1.toString(),s1.toString())// "string" Symbol(name)"
console.log(Number(s1))//不能转换成数字(报错)
console.log(Boolean(s1))//可以转换成布尔值 true
Symbol
作属性名
Symbol
就是为对象的属性名而生,那么Symbol
值怎么作为对象的属性名呢?有下面几种写法:
let a = {};
let s4 = Symbol();
// 第一种写法
a[s4] = 'mySymbol';
// 第二种写法
a = {
[s4]: 'mySymbol'
}
// 第三种写法
Object.defineProperty(a, s4, {value: 'mySymbol'});
a.s4; // undefined
a.s4 = 'mySymbol';
a[s4] // undefined
a['s4'] // 'mySymbol'
let s1 = Symbol('name');//先生存独一无二的Symbol属性
let s2 = Symbol('name')
let obj = {
[s1]:'huasheng',
//把s1作为对象的属性名字,[s1]是里面填变量的写法 s1是变量属性
name:'花生',//不会覆盖前面的name属性
[s2]:'花生',//不会覆盖前面的name属性
// 即使打上相同的Symbol标识符也不会被修改,把Symbol属性作为对象的属性名的时候是
//告诉别人这个不能被更改的数据了
}
console.log(obj,obj.name,obj[s1])
// obj[s1]这是变量操作对象里面的数据
// obj.name和obj["s1"]这是字符串操作对象里面的数据
- 使用对象的
Symbol
值作为属性名时,获取相应的属性值不能用点运算符; - 如果用点运算符来给对象的属性赋
Symbol
类型的值,实际上属性名会变成一个字符串,而不是一个Symbol
值; - 在对象内部,使用
Symbol
值定义属性时,Symbol
值必须放在方括号之中,否则只是一个字符串。 - 本质上只要是不同
symbol
数据,===
比较时就是false
,为了认为区分长的一样的symbol
数据 所以可以人为给symbol
设置标识
Symbol
值作为属性名的遍历
使用for...in
和for...of
都无法遍历到Symbol
值的属性,Symbol
值作为对象的属性名,也无法通过Object.keys()
、Object.getOwnPropertyNames()
来获取了。但是,不同担心,这种平常的需求肯定是会有解决办法的。我们可以使用Object.getOwnPropertySymbols()
方法获取一个对象上的Symbol
属性名。也可以使用Reflect.ownKeys()
返回所有类型的属性名,包括常规属性名和 Symbol
属性名。
那么如何遍历被Symbol
生成的数据呢??
for in
循环
let s1 = Symbol('huasheng');
let obj = {
[s1]:'huasheng',
age:20,
sex:'male',
}
for(let key in obj){
console.log(key,typeof key)
//for in 循环只能遍历出来是属性名是字符串形式的这些属性名的
}
当一个对象的属性名是Symbol
数据的我for in
循环遍历不出来这样的数据(for in
循环是不能遍历对象是Symbol
这样的属性名的因为他不是一个字符串形式的)
那如果遍历属性名是Symbol
数据的呢??
let s1 = Symbol('name');
let s2 = Symbol('age');
let obj = {
[s1]:'huasheng',
[s2]:20,
sex:'male',
};
// 那么如何拿到对应Symbol数据的值呢??
let arr = Object.getOwnPropertySymbols(obj);//返回结果是一个对象(获取的是对象的属性名)
//遍历obj获取Symbol数据的属性值
for(let key of arr){
console.log(key,typeof key)
console.log(obj[key]);//Symbol数据的获取属性值
}
let s5 = Symbol('s5');
let s6 = Symbol('s6');
let a = {
[s5]: 's5',
[s6]: 's6'
}
Object.getOwnPropertySymbols(a); // [Symbol(s5), Symbol(s6)]
a.hello = 'hello';
Reflect.ownKeys(a); // ["hello", Symbol(s5), Symbol(s6)]
Symbol.for()
和Symbol.keyFor()
Symbol.for()
函数也可以用来生成Symbol
值,但该函数有一个特殊的用处,就是可以重复使用一个Symbol
值(标识符)。
let s1 = Symbol.for("s11");
let s2 = Symbol.for("s22");
console.log(s1===s2)//false
let s3 = Symbol("s33");
let s4 = Symbol("s33");
console.log(s3===s4)//false
console.log(Symbol.keyFor(s3))//undefined
console.log(Symbol.keyFor(s2))//"s22"
console.log(Symbol.keyFor(s1))//"s11"
Symbol.for()
函数要接受一个字符串作为参数,先搜索有没有以该参数作为名称的Symbol
值,如果有,就直接返回这个Symbol
值(赋值),否则就新建并返回一个以该字符串为名称的Symbol
值。
Symbol.keyFor()
函数是用来查找一个Symbol
值的登记信息的,Symbol()
写法没有登记机制,所以返回undefined
;而Symbol.for()
函数会将生成的Symbol
值登记在全局环境中,所以Symbol.keyFor()
函数可以查找到用Symbol.for()
函数生成的Symbol
值。
内置Symbol
值
有兴趣的可以自行了解:地址