1. 概述

• ES6 引入了一種新的原始數(shù)據(jù)類(lèi)型 Symbol ，表示獨(dú)一無(wú)二的值，最大的用法是用來(lái)定義對(duì)象的唯一屬性名。
• ES6 數(shù)據(jù)類(lèi)型除了 Number 、 String 、 Boolean 、 Objec t、 null 和 undefined ，還新增了 Symbol 。
• ES5 的對(duì)象屬性名都是字符串，這容易造成屬性名的沖突。比如，你使用了一個(gè)他人提供的對(duì)象，但又想為這個(gè)對(duì)象添加新的方法（mixin 模式），新方法的名字就有可能與現(xiàn)有方法產(chǎn)生沖突。如果有一種機(jī)制，保證每個(gè)屬性的名字都是獨(dú)一無(wú)二的就好了，這樣就從根本上防止屬性名的沖突。這就是 ES6 引入Symbol的原因
• Symbol 值通過(guò)Symbol函數(shù)生成。這就是說(shuō)，對(duì)象的屬性名現(xiàn)在可以有兩種類(lèi)型，一種是原來(lái)就有的字符串，另一種就是新增的 Symbol 類(lèi)型。凡是屬性名屬于 Symbol 類(lèi)型，就都是獨(dú)一無(wú)二的，可以保證不會(huì)與其他屬性名產(chǎn)生沖突。

1.1 基本用法

let s =Symbol();
console.log(typeof s);

let s1 =Symbol();
let s2 =Symbol();
console.log(s1===s2); //false

1.2 接受一個(gè)字符串作為參數(shù)

表示對(duì) Symbol 實(shí)例的描述，主要是為了在控制臺(tái)顯示，或者轉(zhuǎn)為字符串時(shí)，比較容易區(qū)分

let s1=Symbol("s1");
let s2=Symbol();
let s3=Symbol();
console.log(s1.toString()); //Symbol(s1)
console.log(s2); //Symbol()
console.log(s3); //Symbol()

2. 使用場(chǎng)景

2.1 作為屬性名

• 由于每一個(gè) Symbol 的值都是不相等的，所以 Symbol 作為對(duì)象的屬性名，可以保證屬性不重名。
• Symbol 作為對(duì)象屬性名時(shí)不能用.運(yùn)算符，要用方括號(hào)。因?yàn)?運(yùn)算符后面是字符串，所以取到的是字符串 sy 屬性，而不是 Symbol 值 sy 屬性。

//1
let sy=Symbol("key1");
let obj={
    [sy]:"kk"
}
console.log(obj[sy]); //kk
console.log(obj);  //{ [Symbol(key1)]: 'kk' }
//2
let sy=Symbol("key1");
let obj={};
obj[sy]="kk";
console.log(obj[sy]); //kk
console.log(obj);  //{ [Symbol(key1)]: 'kk' }

//不能使用.符號(hào)
let sy=Symbol("key1");
let obj={};
obj[sy]="kk";
console.log(obj.sy);  //undefined

2.2 定義常量

const COLOR_RED = Symbol();
const COLOR_YELLOW = Symbol();
const COLOR_BLUE = Symbol();
 
function getConstantName(color) {
    switch (color) {
        case COLOR_RED :
            return "red";
        case COLOR_YELLOW :
            return "YELLOW ";
        case COLOR_BLUE:
            return "BLUE";
        default:
            throw new Exception("Can't find this color");
    }
}
console.log(getConstantName(COLOR_RED));

2.3 消除魔術(shù)字符串

魔術(shù)字符串指的是，在代碼之中多次出現(xiàn)、與代碼形成強(qiáng)耦合的某一個(gè)具體的字符串或者數(shù)值。風(fēng)格良好的代碼，應(yīng)該盡量消除魔術(shù)字符串，改由含義清晰的變量代替。

function getArea(shape, options) {
  let area = 0;

  switch (shape) {
    case 'Triangle': // 魔術(shù)字符串
      area = .5 * options.width * options.height;
      break;
    /* ... more code ... */
  }

  return area;
}

getArea('Triangle', { width: 100, height: 100 }); // 魔術(shù)字符串

改進(jìn)后

const shapeType = {
triangle: Symbol()
};

function getArea(shape, options) {
  let area = 0;
  switch (shape) {
    case shapeType.triangle:
      area = .5 * options.width * options.height;
      break;
  }
  return area;
}
getArea(shapeType.triangle, { width: 100, height: 100 });