ES6中Symbol的用法

简介

创建symbol变量最简单的方法是用Symbol()函数。sysmbol变量有三点比较特别：

1. 它可以作为对象属性名。只有 字符串 和 symbol 类型才能用作对象属性名。

2. 没有两个symbol 的值是相等的。

   const symbol1 = Symbol();
   const symbol2 = Symbol();`
   const obj = {};
   obj[symbol1] = 'Hello';
   obj[symbol2] = 'World';
   console.log(obj[symbol1]); // 'Hello'
   console.log(obj[symbol2]); // 'World'
   

3.symbol是 JavaScript 原始数据类型。把Symbol当作构造函数来用 new会报错。

    const symbol1 = Symbol(); 
    typeof symbol1; // 'symbol'
    'symbol' symbol1 instanceof Object; // false 
    // Throws "TypeError: Symbol is not a constructor" new Symbol();

用法

Symbol()函数只有一个参数，字符串description。这个字符串参数的唯一作用是辅助调试，也就是它的toString()值。但是请注意，两个具有相同description的symbol也是不相等的。

const symbol1 = Symbol('my symbol'); 
const symbol2 = Symbol('my symbol');
symbol1 === symbol2; // false 
console.log(symbol1); // 'Symbol(my symbol)'

用Symbol.for()创建的symbol会添加到全局的symbol注册中心，并用它的 description作为索引键。如果你用Symbol.for()创建带有相同 description的两个 symbol，那它们就是相等的。

const symbol1 = Symbol.for('hello');
const symbol2 = Symbol.for('hello'); 
symbol1 === symbol2; // true
console.log(symbol1); // 'Symbol(hello)'

冲突

JavaScript 内置了一个 symbol ，那就是 ES6 中的[Symbol.iterator ],拥有Symbol.iterator函数的对象被称为可迭代对象,就是说你可以在对象上使用for/of 循环.

const fibonacci = {
    [Symbol.iterator]: function*() {
      let i = 1;
      let j = 1;
      let temp;
  
      yield i; //返回b
  
      while (true) {
        temp = i;
        i = i + j;
        j = temp;
        yield i; //返回b
      }
    }
  };
  
  // Prints every Fibonacci number less than 100
  for (const x of fibonacci) {
    if (x >= 100) {
      break;
    }
    console.log(x);
  }

为什么这里要用Symbol.iterator 而不是字符串？假设不用Symbol.iterator ，可迭代对象需要有一个字符串属性名'iterator'，就像下面这个可迭代对象的类：

class MyClass {
  constructor(obj) {
    Object.assign(this, obj);
  }

  iterator() {
    const keys = Object.keys(this);
    let i = 0;
    return (function*() {
      if (i >= keys.length) {
        return;
      }
      yield keys[i++];
    })();
  }
}

MyClass 的实例是可迭代对象，可以遍历对象上面的属性。但是上面的类有个潜在的缺陷，假设有个恶意用户给 MyClass 构造函数传了一个带有iterator属性的对象：

const obj = new MyClass({ iterator: 'not a function' });

这样你在obj上使用for/of的话，JavaScript 会抛出TypeError: obj is not iterable异常。可以看出，传入对象的 iterator函数覆盖了类的 iterator属性。

这里的核心在于，symbol让对象的内部数据和用户数据井水不犯河水。由于sysmbol无法在 JSON 里表示，因此不用担心给用户数据传入带有不合适的Symbol.iterator属性的数据。另外，对于那种混合了内置函数和用户数据的对象，也可以用symbol来确保用户数据不会跟内置属性冲突。

私有属性

由于任何两个symbol都是不相等的，在 JavaScript 里可以很方便地用来模拟私有属性。symbol不会出现在 Object.keys()的结果中，因此除非你明确地export 一个symbol，或者用 Object.getOwnPropertySymbols() 函数获取，否则其他代码无法访问这个属性。

function getObj() {
  const symbol = Symbol('test');
  const obj = {};
  obj[symbol] = 'test';
  return obj;
}

const obj = getObj();

Object.keys(obj); // []

// 除非有这个 symbol 的引用，否则无法访问该属性
obj[Symbol('test')]; // undefined

// 用 getOwnPropertySymbols() 依然可以拿到 symbol 的引用
const [symbol] = Object.getOwnPropertySymbols(obj); //解构
obj[symbol]; // 'test'

还有一个原因是symbol不会出现在JSON.stringify()的结果里，确切地说是JSON.stringify()会忽略symbol属性名和属性值：

const symbol = Symbol('test');
const obj = { [symbol]: 'test', test: symbol };

JSON.stringify(obj); // "{}"