es6新增基本数据类型Symbol

1.为什么用Symbol

ES5里面对象的属性名都是字符串,如果你需要使用一个别人提供的对象,你对这个对象有哪些属性也不是很清楚,但又想为这个对象新增一些属性,那么你新增的属性名就很可能和原来的属性名发送冲突,显然我们是不希望这种情况发生的。所以,我们需要确保每个属性名都是独一无二的,这样就可以防止属性名的冲突了。因此,ES6里就引入了Symbol,用它来产生一个独一无二的值。

作用: 生成一个独一无二的值

2. Symbol是什么

定义:Symbol实际上是ES6引入的一种原始数据类型

以前学过的数据类型

number string boolean undefined null…

3. Symbol的使用
let sym = Symbol('aa');
console.log(sym);   // Symbol(aa) 
typeof sym;        // "symbol"
3.1 Symbol函数前不能用new

Symbol函数不是一个构造函数,前面不能用new操作符。所以Symbol类型的值也不是一个对象,不能添加任何属性,它只是一个类似于字符型的数据类型。如果强行在Symbol函数前加上new操作符,会报错,如下:

let sym = new Symbol();
// Uncaught TypeError: Symbol is not a constructor(…)
3.2 Symbol使用注意事项

注意

  1. Symbol 前面不能加new,加new就报错
  2. Symbol() 返回的是一个唯一值,通常使用最为唯一的key使用
  3. symbol是一种单独的数据类型,就叫symbol,是基本数据类型
  4. 如果symbol作为了key,那么用for…in…循环,是循环不出来symbol的key的
3.3 Symbol的用处

用处一般

symbol作为josn的key使用

 let sym = Symbol('a');
 let obj = {
     name: 'dou',
     age: 18,
     [sym]: 'symbol'
 }

 console.log(obj);  // {name: "dou", age: 18, Symbol(a): "symbol"}
 
 console.log(obj[sym])  // symbol
4. Symbol函数的参数
4.1 字符串作为参数

用上面的方法生成的Symbol值不好进行区分,Symbol函数还可以接受一个字符串参数,来对产生的Symbol值进行描述,方便我们区分不同的Symbol值。

let s1 = Symbol('s1');
let s2 = Symbol('s2');
console.log(s1);  // Symbol(s1)
console.log(s2);  // Symbol(s2)
s1 === s2;  //  false
let s3 = Symbol('s2');
s2 === s3;  //  false
  1. 给Symbol函数加了参数之后,控制台输出的时候可以区分到底是哪一个值;
  2. Symbol函数的参数只是对当前Symbol值的描述,因此相同参数的Symbol函数返回值是不相等的;
4.2 对象作为参数

如果Symbol函数的参数是一个对象,就会调用该对象的toString方法,将其转化为一个字符串,然后才生成一个Symbol值。所以,说到底,Symbol函数的参数只能是字符串。

let sym = Symbol({});
console.log(sym);  // Symbol([object Object])
5 Symbol值不可以进行运算

既然Symbol是一种数据类型,那我们一定想知道Symbol值是否能进行运算。告诉你,Symbol值是不能进行运算的,不仅不能和Symbol值进行运算,也不能和其他类型的值进行运算,否则会报错。

Symbol值可以显式转化为字符串和布尔值,但是不能转为数值。

let sym1 = Symbol('symbol1')
let sym2 = Symbol('symbol2')
sym1 + sym2;   // TypeError: Cannot convert a Symbol value to a number

// 转字符串
String(sym1);   // "Symbol(symbol1)"

// 转布尔值
Boolean(sym1); // true

// 转数字
Number(sym1);  // TypeError: Cannot convert a Symbol value to a number
6. Symbol 作为属性

Symbol就是为对象的属性名而生,那么Symbol值怎么作为对象的属性名呢?有下面几种写法:

let obj = {};
let sym = Symbol();
// 第一种写法
obj[sym] = 'mySymbol';
// 第二种写法
obj = {
    [sym]: 'mySymbol'
}
// 第三种写法
Object.defineProperty(obj, sym, {value: 'mySymbol'});
obj.sym;  //  undefined
obj.sym = 'Symbol';
obj[sym]  //  mySymbol
obj['sym']  // 'Symbol'
  1. 使用对象的Symbol值作为属性名时,获取相应的属性值不能用点运算符;
  2. 如果用点运算符来给对象的属性赋Symbol类型的值,实际上属性名会变成一个字符串,而不是一个Symbol值;
  3. 在对象内部,使用Symbol值定义属性时,Symbol值必须放在方括号之中,否则只是一个字符串。
7. Symbol值作为属性名的遍历

使用for…in和for…of都无法遍历到Symbol值的属性,Symbol值作为对象的属性名,也无法通过Object.keys()、Object.values()来获取了。

但是,不同担心,我们可以使用Object.getOwnPropertySymbols()方法获取一个对象上的Symbol属性名。

let sym1 = Symbol('symbol1');
let sym2 = Symbol('symbol2');
let obj = {
    name:'wuwei',
    [sym1]: 'symbol1',
    [sym2]: 'symbol2'
}
Object.getOwnPropertySymbols(obj);   // [Symbol(symbol1), Symbol(symbol2)]

for… in…循环遍历不出symbol的key的

let symbol = Symbol('a');
let json = {
    a: 'aa',
    b: 'bb',
    [symbol] : '我是symbol'
}
for(let item in json){
	console.log(item);   // a b
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值