其他分享
首页 > 其他分享> > Symbol类型的学习小结

Symbol类型的学习小结

作者:互联网

symbol

ES6新增的一种原始类型,类似于字符串,表示独一无二的值(永不重复) 因为是基本类型所以不能用new关键字来调用,当然也不能添加属性

最佳实践:为了保证对象的属性名保持唯一, 也就是说对象的属性名有两种形式:String、Symbol

symbol初识

 

 let sym = Symbol()
 ​
 console.log(sym) // Symbol()
 typeof sym // 'symbol'

 

 let s1 = Symbol("name1")
 let s2 = Symbol("name1")
 ​
 console.log(s1,s2)
 // Symbol(name1) Symbol(name1)
 ​
 // 描述相同的情况
 console.log(Symbol('s1') === Symbol('s1')); // false

也可以传入一个Object作为参数,生成symbol值的时候 会默认调用对象的toString()方法

 let obj = {}
 obj.toString = function(){ return "abc"} // 重写了obj本身的toString()
 ​
 const sym = Symbol(obj)
 console.log(sym) // Symbol(abc)

 

symbol的最佳实践

因为symbol的值永远不会重复,可以利用这一特性

将symbol作为对象的属性名,避免命名冲突

 const a = {};
 a[Symbol('symA')] = 'hello a';
 console.log(a); // {Symbol(): 'hello a'}
 ​
 // -----------------------------------------------
 const sym = Symbol('symB');
 const b = {
   [sym]: 'hello b',
 };
 console.log(b[sym]); // hello b
 ​
 // -----------------------------------------------
 const c = {};
 const symC = Symbol();
 Object.defineProperty(c, symC, { value: 'hello c' });
 console.log(c[symC]); // hello c
 ​
 // 也可以作为函数名

 

注意:作为属性名的时候不能使用“.”点运算符,否则会被认为读取的是字符串

symbol特性不可遍历

定义了symbol作为属性名,可以直接访问到

但是对于 forin、forof、Object.keys()、Object.getOwnPropertyNames()、JSON.stringify()都无法直接直接获取到symbol的值

 let person = {
   name: 'zz',
   age: 12,
   [Symbol('rank')]: '优秀',
   [Symbol('rank')]: '有钱',
 };
 ​
 // 遍历属性名(获取不到 )
 for (const key in person) {
   console.log(key);
 }
 ​
 // 遍历属性值(报错)
 // Uncaught TypeError: person is not iterable
 // for (const iterator of person) {
 //  console.log(iterator);
 // }
 ​
 console.log(Object.keys(person));
 // ['name', 'age'] 获取不到
 ​
 console.log(JSON.stringify(person));
 // {"name":"zz","age":12}
 ​
 console.log(Object.getOwnPropertyNames(person));
 // ['name', 'age'] 获取不到
 ​

 

访问的方法:Object.getOwnPropertySymbols()返回一个symbol数组

 const arrSym = Object.getOwnPropertySymbols(person);
 // [Symbol(rank), Symbol(rank)]
 ​
 // 遍历数组的值
 for (let item of arrSym) {
   console.log(item); // 获取到了symbol的key
   console.log(person[item]); // 读symbol的value
 }

 

Reflect.ownKeys()返回所有类型的键名

 console.log(Reflect.ownKeys(person));
 // ['name', 'age', Symbol(rank), Symbol(rank)]

 

 

 

symbol的方法

symbol.prototype.description

方便的获取到symbol的描述参数

 sym.description // 'abc'
 ​
 // 在没有description()的时候,只能显式转换为字符串

 

symbol值的转换

一句换总结:不能转换为Number(不能参与运算),可以转换为 String、Boolean

 const sym = Symbol('symName');
 // 1. Number
 let n = Number(sym);
 // Uncaught TypeError: Cannot convert a Symbol value to a number
 console.log('this is hhh' + sym); // 模板字符串也打咩
 // Uncaught TypeError: Cannot convert a Symbol value to a string
 ​
 // 2. String
 let s = String(sym);
 console.log(s.toString());
 console.log(s);
 // Symbol(symName)
 ​
 // 3. Boolean
 console.log(Boolean(sym)); // true
 console.log(!sym); // false
 

 

 

 

 

标签:console,log,Symbol,sym,学习,const,小结,symbol
来源: https://www.cnblogs.com/ecat-octopus/p/16585920.html