了解下ES6的新基本数据类型Symbol

每次一说起js的数据类型，都知道有number,string,null,undefined,boolean和object,然而es6新加了一个基本数据类型Symbol，之前没使过，有点好奇，就去了解了一下

为什么新增Symbol？

看文档说是因为之前对象的属性名称只能用string，有可能会重复，为了保证属性名称的唯一，所以新增了Symbol

咋使？

由Symbol()函数直接返回该类型的值，不需要new实例，如下图所示：

该类型的值都是唯一的，比如同样新建两个值，它们是不相等的

还可以加一个字符串来充当描述，例如Symbol('test')，我理解使用描述是为了区别及获取不同的Symbol，读取的时候可以转化为字符串：

ES2019提供了一个新的实例属性description，可以更直观的返回描述字符串

怎么做属性名呢？和我们平时用一个动态的对象做属性是一样的，可以将它看做是一个对象名就可以了：

const testSymbol = Symbol('test');
let obj = {};
obj[testSymbol] = '1'; // 赋值
console.log(obj[testSymbol])  // 输出1

既然做了属性名，那就需要遍历获取，但是该属性不会在for...in、for...of、Object.keys()、Object.getOwnPropertyNames()、JSON.stringify()中出现及返回，只能用Object.getOwnPropertySymbols()获取到

使用场景

基于Symbol的特性，有很多人说可以用作常量啊，还有其他一些场景，但是我只用到了以下这个场景

• 非私有内部使用属性
  意思是内部使用的属性，并且不是私有的，如果你想取也可以取到，但是用正常遍历Object的方法取不到
  最近业务上有一些场景，我是用react写业务的，一个组件可能有多个子组件，但是子组件共用props数据，正常子组件自己的一些页面状态数据是存在自己的 state里的，但是有的时候默认状态需要从props的异步请求获取到，一般这种数据就只能存在props里面了，但是就怕和其他的属性冲突，比如一个table里面其中有多个数据块需要展开收起，那么这个状态就需要存起来，之前存的时候怕冲突，通过修改命名格式去解决，比如明明用的是驼峰式命名，存这些状态就用下划线加id的方式，但是在其他子组件遍历props的时候也可以获取到这些值，并且如果以后别人来迭代更新的时候，命名也不是没可能冲突，所以使用了Symbol去当属性，其他子组件中正常获取props就不会获取到，并且属性完全不会冲突
• 注册和获取全局Symbol
  可以使用Symbol.for()和Symbol.keyFor()注册和获取全局Symbol，使用Symbol.for()会被注册到全局，但是会先去全局找给定的key是否存在，如果不存在才新建，然后用Symbol.keyFor()去获取，一般会在页面中存在多个iframe嵌套中使用，比如在主页面注册一个通用值，然后所有子iframe都可以获取，之前这种场景直接挂载到了window上，属性容易冲突

还有一些内置的Symbol值，暂时我还没用到，可以去 MDN 了解下，我这里就不多说啦~