ES6 Symbol

ES6 Symbol

之前，本人记忆中关于js原始数据类型有五种，分别是：undefined、Boolean、null、Number、String，但是偶然间看见发现，现在又多增加了一种Symbol，那就先简单了解一下吧~

一、Symbol是什么

Symbol是es6引入得一种新的原始数据类型，表示独一无二的值

二、Symbol的声明方法

let s = Symbol();
typeof s  // “symbol”，变量s是Symbol数据类型，而不是字符串之类的其他类型。

注：Symbol不能使用new命令，否则会报错，因为它是一个原始数据类型，不是对象，因此，它也不可以添加属性

如下图所示：

三、Symbol的使用

• Symbol函数可以接受一个字符串作为参数，表示对Symbol实例的描述，主要是为了在控制台显示，或者转为字符串时，比较容易区分；
• 如果 Symbol 的参数是一个对象，就会调用该对象的toString方法，将其转为字符串，然后才生成一个 Symbol 值；
• Symbol值不能与其他类型的值进行运算，会报错；
• Symbol值可以显式转为字符串；
• Symbol值也可以转为布尔值，但是不能转为数值。

小案例：
1-

var s1 = Symbol('foo');
console.log(s1);
console.log(s1.toString());

2-

const objSy = {
    toString() {
        return 'abc';
    }
};
const sym = Symbol(objSy);
console.log(sym) 

3- Symbol函数的参数只是表示对当前 Symbol 值的描述，因此相同参数的Symbol函数的返回值是不相等的。

// 没有参数的情况
var s1 = Symbol();
var s2 = Symbol();

s1 === s2 // false

// 有参数的情况
var s1 = Symbol('foo');
var s2 = Symbol('foo');

s1 === s2 // false

四、作为属性名的Symbol

由于每一个Symbol值都是不相等的，这意味着Symbol值可以作为标识符，用于对象的属性名，就能保证不会出现同名的属性。这对于一个对象由多个模块构成的情况非常有用，能防止某一个键被不小心改写或覆盖。但是，它也不是私有属性，有一个Object.getOwnPropertySymbols方法，可以获取指定对象的所有 Symbol 属性名。

var mySymbol = Symbol();

// 第一种写法
var a1 = {};
a1[mySymbol] = 'Hello!';

// 第二种写法
var a2 = {
  [mySymbol]: 'Hello!'
};

// 第三种写法
var a3 = {};
Object.defineProperty(a3, mySymbol, { value: 'Hello!' });

// 以上写法都得到同样结果
console.log(a1[mySymbol]) // "Hello!"
console.log(a2[mySymbol]) // "Hello!"
console.log(a3[mySymbol]) // "Hello!"

五、属性名的遍历

Symbol 作为属性名，该属性不会出现在for…in、for…of循环中，也不会被Object.keys()、Object.getOwnPropertyNames()、JSON.stringify()返回。这样的话，如果循环输出时不希望所有值全部输出，那我们就可以使用Symbol进行保护。

// 正常状况下
var objFor={name:'xiaoming',sex:'男',age:18};
for (let item in objFor){
    console.log(objFor[item]); // xiaoming 男 18
} 

// 使用Symbol时
let objForM={name:'小明',sex:'男'};
let age=Symbol();
objForM[age]=18;
for (let item in objForM){
    console.log(objForM[item]);  // xiaoming 男
} 
console.log(objForM); //{name: "小明", sex: "男", Symbol(): 18}

以上是Symbol的一些简单使用方法，更多内容可参考文档http://caibaojian.com/es6/symbol.html