Symbol (es6)

1.为什么要使用Symbol

// 1.ES6之前, 对象的属性名(key)
 var obj1 = {
   name: "why",
   friend: { name: "kobe" },
   'age': 18
 }
/* 
在底层，这里的key无论加不加双引号，在底层都是
字符串形式表示。
*/


console.log(obj1.age);//18
console.log(Object.keys(obj1));//(3) ['name', 'friend', 'age'] 是
//以字符串的形式表示的
console.log(obj1['age']);//18
//console.log(obj1[age]);//test.html:65 Uncaught 
//ReferenceError: age is not defined

// obj1['name'] = "james"
// console.log(obj1) 会覆盖掉原来对象中的name

// 在ES6之前，对象的属性名都是字符串形式，那么很容易造成属性名的冲突；

2.Symbol的基本使用

94.PNG

//ES6中Symbol的基本使用
const s1 = Symbol()
const s2 = Symbol()

console.log(s1 === s2) //false

// ES2019(ES10)中, Symbol还有一个描述(description)
const s3 = Symbol("aaa")
console.log(s3.description)//'aaa'

3.Symbol值作为key

95.PNG

// 3.Symbol值作为key
// 3.1.在定义对象字面量时使用
const s1 = Symbol()
const s2 = Symbol()
const s3 = Symbol()
const obj = {
  [s1]: "abc",
  [s2]: "cba"
}

// 3.2.新增属性
obj[s3] = "nba"

// 3.3.Object.defineProperty方式
const s4 = Symbol()
Object.defineProperty(obj, s4, {
  enumerable: true,
  configurable: true,
  writable: true,
  value: "mba"
})

console.log(obj[s1], obj[s2], obj[s3], obj[s4])
// 注意: 不能通过.语法获取
// console.log(obj.s1)

4.遍历对象中的Symbol

// 4.使用Symbol作为key的属性名,在遍历/Object.keys等中是获取不到这些Symbol值
// 需要Object.getOwnPropertySymbols来获取所有Symbol的key

console.log(Object.keys(obj))
//通过这个方法获取不到symbol类型，是空数组
console.log(Object.getOwnPropertyNames(obj))
//通过这个方法获取不到symbol类型，是空数组，如果有字符串为key的属性，
//那么会返回这个字符串的key组成的数组
console.log(Object.getOwnPropertySymbols(obj))
// [Symbol(), Symbol(), Symbol(), Symbol()] 
//这个方法只能获取symbol类型，就算对象里面有普通的属性，也不会输出

const sKeys = Object.getOwnPropertySymbols(obj)
for (const sKey of sKeys) {
  console.log(obj[sKey])
}
//通过这个方式进行遍历
//abc
//cba
//nba
//mba

4.值相同的Symbol

前面我们讲Symbol的目的是为了创建一个独一无二的值，那么如果我们现在就是想创建相同的Symbol应该怎么

来做呢？

1.我们可以使用Symbol.for方法来做到这一点；

2.并且我们可以通过Symbol.keyFor方法来获取对应的key；

// 5.Symbol.for(key)/Symbol.keyFor(symbol)
//希望某些条件下创建出来的symbol值是一样的

/* 
Symbol.for(key) 方法会根据给定的键 key，
来从运行时的 symbol 注册表中找到对应的 symbol，
如果找到了，则返回它，否则，
新建一个与该键关联的 symbol，
并放入全局 symbol 注册表中。
*/
const sa = Symbol.for("aaa")
const sb = Symbol.for("aaa")
console.log(sa === sb)//true

const key = Symbol.keyFor(sa)
console.log(key)//'aaa'
const sc = Symbol.for(key)
console.log(sa === sc)//true