ES6基礎特性快速掌握

這裏僅列出你們容易忽略的知識點，用於查缺補漏~

Symbol

原始數據類型，由Symbol函數生成。

//正確.返回具備惟一性的值
Symbol()
Symbol(label)

//錯誤
//由於返回的是原始類型;同undefined;null;Boolean;String;Number;
//對象（Object、Array、Function）是引用數據類型。
new Symbol()

不能作字符串拼接等運算操做，但能夠顯示轉換爲字符串：Symbol().toString() //"Symbol()".
應用：
1.做爲對象屬性

//獲取Symbol的方法：
Object.getOwnPropertySymbols(obj) //獲取對象的Symbol屬性名
Reflect.ownKeys(obj) //獲取對象自身全部屬性，包括不可枚舉以及Symbol

能夠在封裝對象時，將Symbol用做非私有，但只用於內部訪問的屬性。（掛在對象上，但外部拿不到Symbol值就沒法訪問其對應的值）。
2.做爲常量值
3.Symbol.for(label)
全局登記的方式，只有未找到的狀況下才會返回新的Symbol值；利用其全局環境搜索的這個特性，能夠跨iframe獲取值。
4.內置Symbol值
執行對象(Object或String等)原型上特定的內部方法時，會自動執行對象對應的Symbol對應的函數。
舉兩個典型的例子：

1. Symbol.iterator
- 其值爲對象的遍歷器對象生成器
- 當使用for...of()循環時，會自動調用對象的Symbol.iterator方法
//for...of ES6提供的統一的訪問數據結構的接口

2. Symbol.toStringTag   
//使用Object.prototype.toString方法，會先找對象的Symbol.toStringTag
({[Symbol.toStringTag]: 'M2'}).toString();  //"[object M2]"

Proxy | Reflect

ES6 爲操做【對象】而提供的新 API。
Reflect

• 內部方法：Proxy this問題 Reflect解決
• 對象操做，部分命令式操做變成函數行爲，如：delete obj.attr變爲Reflect.deleteProperty(obj, attr)
• 和Proxy方法一一對應

Set | Map

特性：
set：保證值的惟一性；去重。
map: 相對於對象，是一種更完善的hash結構實現。

適用使用for...of實現遍歷的各類場景，如擴展運算符等。
Map 結構的默認遍歷器接口（Symbol.iterator屬性），就是entries方法。

map[Symbol.iterator] === map.entries

Set 結構的實例默承認遍歷，它的默認遍歷器生成函數就是它的values方法。

Set.prototype[Symbol.iterator] === Set.prototype.values

WeakSet | WeakMap

• 只接受對象做爲鍵名；
• 弱引用，不計入垃圾回收；防止內存泄漏，但也致使不支持遍歷和size。

用途：1）dom元素的記錄or操做 2）私有方法 | 私有屬性

Object

1.比較兩個值是否徹底相同
//除了+0和-0不等；NaN等於自身。別的等同於===
Object.is(a,b) 

2.對象的合併；之拷貝對象自身可枚舉的屬性
//原始類型會被轉換成對象
Object.assign(2)  //Number{2}
//原始類型只有字符串能夠被拷貝到對象上，由於其可遍歷（結合iterator理解）
Object.assign({}, 2, '3');  //{0: "3"}
//數組的替換
Object.assign([1,2,3], [4,5]) //[4,5,3]

3.設置|獲取對象原型
Object.setPrototypeOf(target, prototype);
Object.getPrototypeOf(target);

4.遍歷
Object.keys()
Object.values()
Obeject.entries() //對象轉鍵值對數組

5.鍵值對數組轉對象
Object.fromEntries() //entries的逆操做;所以適合將Map結構轉爲Object

Object.getOwnPropertyDescriptors()

返回指定對象全部自身屬性（非繼承屬性）的描述對象。

主要是爲了解決Object.assign()沒法正確拷貝get屬性和set屬性的問題。getOwnPropertyDescriptors不只會返回對象屬性，並且包括其屬性描述器。

obj={a:'a',b:'b'}
Object.getOwnPropertyDescriptors(obj);
//output:
{
    a:{value:"a",writable:true,enumerable:true,configurable:true}
    b:{value:"b",writable:true,enumerable:true,configurable:true}
}

應用：能夠結合Object.assign、Object.create

Object.create(proto[, propertiesObject])

做用：建立一個新對象，使用已有對象做爲新建立對象的__proto__;
propertiesObject可選，默認爲建立對象的自有屬性；

o = Object.create({a:1}, {
    foo: { 
        value: "hello" 
  }
})
o.hasOwnProperty('foo') //true

省略了的屬性特性默認爲false，因此屬性foo是不可寫(writable)、不可枚舉(enumerable)、不可配置(configurable)。
常見示例：

• 建立空對象

1. obj = {};
  等價於
  obj = Object.create(Object.prototype);

2. obj = Object.create(null); //建立一個原型爲null的空對象

• 子類繼承父類時使用

// 子類續承父類
Rectangle.prototype = Object.create(Shape.prototype);
/*
* 等價於
* function prototypeCerate(o) {
*   function F() {}
*   F.prototype = o;
*   return new F();
* }
* Rectangle.prototype = prototypeCerate(Shape.prototype);

*/

Rectangle.prototype.constructor = Rectangle;

super

指向當前對象的原型對象;【做爲構造函數 | 原型對象】

//指向原型對象時，只能用在對象方法中,以下：
const obj = {
  getName() { super.getName(); }
}
//錯誤. super被用在普通函數裏面，該函數被賦值給getName。
const obj = {
  getName: () => super.getName()
}

內部原理：

super.foo
//1.做爲原型屬性：
Object.getPrototypeOf(this).foo
//2.做爲原型方法：
`bject.getPrototypeOf(this).foo.call(this)

擴展運算符

//數組轉對象。深入理解iterator遍歷
 let a = { ...['a', 'b', 'c'] }; // {0: "a", 1: "b", 2: "c"}

更多技術分享，歡迎【掃碼關注】~