js學習筆記05-ES6內(nèi)置功能

Symbol（標識符）

Symbol 是一種獨特的且不可變的數(shù)據(jù)類型，用來標識對象屬性
要創(chuàng)建 Symbol，輸入 Symbol()，并添加一個可選的字符串作為其描述

const  obj = Symbol("obj1");

const bowl = {
  [Symbol('banana')]: { color: 'yellow', weight: 183.15 },
  [Symbol('orange')]: { color: 'orange', weight: 170.097 },
  [Symbol('banana')]: { color: 'yellow', weight: 176.845 }
};
console.log(bowl);

可迭代協(xié)議

可迭代協(xié)議用來定義和自定義對象的迭代行為,靈活地指定循環(huán)訪問對象中的值的方式.
字符串和數(shù)組就是內(nèi)置的可迭代類型
為了使對象可迭代，它必須實現(xiàn)可迭代接口,接口須包含默認的迭代器方法。該方法將定義對象如何被迭代
迭代器方法（可通過常量 [Symbol.iterator] 獲得）是一個無參數(shù)的函數(shù)，返回的是迭代器對象。迭代器對象是遵守迭代器協(xié)議的對象

迭代器協(xié)議

迭代器協(xié)議用來定義對象生成一系列值的標準方式。實際上就是現(xiàn)在有了定義對象如何迭代的流程。通過執(zhí)行 .next() 方法來完成這一流程。
當對象執(zhí)行 .next() 方法時，就變成了迭代器。.next() 方法是無參數(shù)函數(shù)，返回具有兩個屬性的對象：
1)value：表示對象內(nèi)值序列的下個值的數(shù)據(jù)
2)done：表示迭代器是否已循環(huán)訪問完值序列的布爾值
如果 done 為 true，則迭代器已到達值序列的末尾處。
如果 done 為 false，則迭代器能夠生成值序列中的另一個值。

const digits = [0, 1, 2, 3, 4];
for (const digit of digits) {
  console.log(digit);
}//for of 進行迭代

const digits = [0, 1, 2, 3, 4];  //[Symbol.iterator]() 迭代器方法,返回無參函數(shù)
const arrayIterator = digits[Symbol.iterator]();

console.log(arrayIterator.next()); //Object {value: 0, done: false}
console.log(arrayIterator.next()); //Object {value: 1, done: false}

下面是對象屬性迭代的例子

const james = {
    name: 'James',
    height: `5'10"`,
    weight: 185,
    [Symbol.iterator](){
        let keysArr = Object.keys(this);
        let index = 0;
        let obj = this;
        return {
            next(){
                return {"value": obj[keysArr[index]], 
                "key": keysArr[index], 
                "done": Boolean(index++ >= keysArr.length-1)} ;
            }
        }
    }
};
const iterator = james[Symbol.iterator]();
console.log(iterator.next().value); // 'James'

Set（集合）

數(shù)據(jù)不重復的數(shù)組,但是不能通過索引訪問

const games = new Set(['Super Mario Bros.', 'Banjo-Kazooie', 'Mario Kart', 'Super Mario Bros.']);
console.log(games); //Set {'Super Mario Bros.', 'Banjo-Kazooie', 'Mario Kart'} 

修改 Set

添加.add() 返回set ,如果添加重復項,不會報錯,也不會添加
刪除.delete() 返回boolean
刪除所有.clear() 沒有返回值

使用 Set

.size 屬性可以查看Set長度
.has() 方法可以檢查 Set 中是否存在某項(entry),返回boolean
.values() 方法可以返回 Set 中的值,返回值是 SetIterator 對象
使用for...of 循環(huán)遍歷Set.values();

const games = new Set(['Super Mario Bros.', 'Banjo-Kazooie', 'Mario Kart', 'Super Mario Bros.']);
for(let str of games.values()){    //for(let str of games) 效果一樣
console.log(str);
}

WeakSet（弱集合）

只能包含對象,不能迭代,沒有clean()
當集合中的對象為null時,自動回收.效率比set高

Map（映射）

如果說 Set 類似于數(shù)組，那么 Map 就類似于對象，因為 Map 存儲鍵值對，和對象包含命名屬性及值相類似

修改 Map

.set() 方法添加鍵值(兩個參數(shù))。第一個參數(shù)是鍵，用來引用第二個參數(shù)，即值
使用 .delete() 方法移除鍵值對
使用 .clear() 方法從 Map 中刪除所有鍵值對

處理 Map

使用 .has() 方法并向其傳入一個鍵來檢查 Map 中是否存在該鍵值對
通過向 .get() 方法傳入一個鍵，獲取 Map 中的值
使用 for...of 循環(huán)遍歷Map

WeakMap（弱映射）

WeakMap（弱映射）的行為和 WeakSet 的一樣，只是 WeakMap 處理的是鍵值對，而不是單個條目