es6+最佳入門實踐(7)

7.set和map數據結構

7.1.什麼是set?

Set就是集合，集合是由一組無序且唯一的項組成，在es6中新增了set這種數據結構，有點類似於數組，但是它的元素是唯一的，沒有重複

 let st = new Set([1,2,2,3,3,4])
console.log(st)  // [1,2,3,4]

Set的size屬性可以知道set中有多少元素，類似於數組的length屬性

let st = new Set([1,2,2,3,3,4])
console.log(st.size); //4

7.2.Set的相關方法

1.add 添加一個數據

let st = new Set([1, 2, 3])
st.add(4)
console.log(st)

2.delete 刪除一個數據

let st = new Set([1, 2, 3]);
st.delete(3);
console.log(st);

3.has 判斷是否存在某個元素

let st = new Set([1, 2, 3]);
console.log(st.has(1)) //true
console.log(st.has(10)) //false

4.clear 清除所有數據

let st = new Set([1, 2, 3])
st.clear()
console.log(st)

5.keys 返回鍵名的遍歷器

let st = new Set([1, 2, 3])
console.log(st.keys())

6.values 返回值的遍歷器

let st = new Set([1, 2, 3])
console.log(st.values())

7.entries 返回鍵/值對的遍歷器

let st = new Set([1, 2, 3])
console.log(st.entries().next())

8.foreach 使用回調函數遍歷元素

let st = new Set([0, 12, 3])
st.forEach((v,k,s)=>{
    console.log(v, k, s)
})

7.3.什麼是Map？

ES6 提供了 Map 數據結構。它類似於對象，也是鍵值對的集合，但是“鍵”的範圍不限於字符串，各種類型的值（包括對象）都可以當作鍵。也就是說，Object 結構提供了“字符串—值”的對應，Map 結構提供了“值—值”的對應，是一種更完善的 Hash 結構實現。如果你需要“鍵值對”的數據結構，Map 比 Object 更合適。

let k1 = {a:1};
let k2 = {b:1};

let obj = {
    [k1]: 1,
    [k2]: 2
};
console.log(obj)  //{[object Object]: 2}

上面代碼中k1和k2都被轉換成了[object Object],因此，k2 把 k1覆蓋了，之所以要把k1和k2轉換成字符串的原因就是js中的對象屬性只能是字符串類型，爲了解決這個問題，ES6提供了Map數據結構

1.如何創建一個Map？

let mp = new Map([
    ['a', 1],
    ['b', 2]
])
console.log(mp)

let mp2 = new Map([
        [k1,1],
        [k2,2]
    ])
console.log(mp2)

2.Map的屬性size

let mp2 = new Map([
        [k1,1],
        [k2,2]
    ])
console.log(mp2.size)

7.4.Map的相關方法

1.set(key, value) 添加新的鍵值對

let m = new Map()
m.set('a', 1)
console.log(m)

2.get(key) 獲取key對應的值

let m = new Map()
m.set('a', 1)
console.log(m.get('a'))

3.delete(key) 刪除key

let m = new Map([
    ['a', 1],
    ['b', 2]
]);
m.delete('a')
console.log(m)

4.has(key) 查看是否存在某個key

let m = new Map([
    ['a', 1],
    ['b', 2]
]);
console.log(m.has('a')) //true
console.log(m.has('c')) //false

5.clear()

let m = new Map([
    ['a', 1],
    ['b', 2]
]);
m.clear()
console.log(m)

6.keys()返回鍵名的遍歷器

let m = new Map([
    ['a', 'hello'],
    ['b', 'nodeing']
]);
for(let k of m.keys()){
    console.log(k)
}

7.values()返回值的遍歷器

let m = new Map([
    ['a', 'hello'],
    ['b', 'nodeing']
]);
for(let k of m.values()){
    console.log(k)
}

8.entries() 返回鍵/值對的遍歷器

let m = new Map([
    ['a', 'hello'],
    ['b', 'nodeing']
]);
for(let k of m.entries()){
    console.log(k)
}

9.foreach 遍歷Map

let m = new Map([
    ['a', 'hello'],
    ['b', 'nodeing']
]);

m.forEach((v,k,m) => {
    console.log(v, k, m)
})

視頻教程地址：http://edu.nodeing.com/course/50