ES6 - Map 和 Set

---

---

ES6 引入了兩種新的資料結構——Map 和 Set。讓我們詳細瞭解一下它們。

Map

Map 是一個有序的鍵值對集合。Map 類似於物件。但是，Map 和物件之間存在一些區別。這些列在下面：

語法

Map 的語法如下：

let map = new Map([iterable])
let map = new Map()

示例

以下示例使用可迭代建構函式建立一個 Map：

<script>
   let andy = {ename:"Andrel"},
      varun = {ename:"Varun"},
      prijin = {ename:"Prijin"}
   let empJobs = new Map([
   [andy,'Software Architect'],
   [varun,'Developer']]
   );
   console.log(empJobs)
</script>

以上程式碼的輸出如下：

{{…} => "Software Architect", {…} => "Developer"}

檢查 Map 的大小

size 屬性可用於確定 Map 中儲存的值的數量。

語法

檢查 Map 大小的語法如下：

map_name.size

示例

<script>
   let daysMap = new Map();
   daysMap.set('1', 'Monday');
   daysMap.set('2', 'Tuesday');
   daysMap.set('3', 'Wednesday');
   console.log(daysMap.size);
</script>

以上程式碼的輸出如下：

3

以下是一些可用於操作 Map 的常用方法：

WeakMap

WeakMap 是 Map 的一個小的子集。鍵是弱引用的，因此它只能是非原始的。如果對物件鍵沒有引用，則它將被垃圾回收。

• 不可迭代
• 每個鍵都是物件型別

如果鍵沒有引用，WeakMap 將允許垃圾回收。

語法

WeakMap 的語法如下：

new WeakMap([iterable])

示例 1

<script>
   let emp = new WeakMap();
   emp.set(10,'Sachin');// TypeError as keys should be object
</script>

示例 2

<script>
   let empMap = new WeakMap();
   // emp.set(10,'Sachin');// Error as keys should be object
   let e1= {ename:'Kiran'},
      e2 = {ename:'Kannan'},
      e3 = {ename:'Mohtashim'}

   empMap.set(e1,1001);
   empMap.set(e2,1002);
   empMap.set(e3,1003);

   console.log(empMap)
   console.log(empMap.get(e2))
   console.log(empMap.has(e2))
   empMap.delete(e1)
   console.log(empMap)
</script>

以上程式碼的輸出如下：

{{…} => 1002, {…} => 1003, {…} => 1001}
1002
true
{{…} => 1002, {…} => 1003}

Set

Set 是一個無序的唯一值集合。此資料結構可以包含原始型別和物件型別的值。

語法

Set 的語法如下：

new Set([iterable])
new Set()

示例

<script>
   let names = new Set(['A','B','C','D']);
   console.log(names)
</script>

以上程式碼的輸出如下：

{"A", "B", "C", "D"}

檢查 Set 的大小

Set 物件的 size 屬性可用於查詢 Set 中的元素數量。

語法

檢查 Set 大小的語法如下：

set.size

示例

<script>
   let names = new Set(['A','B','C','D']);
   console.log(names.size)
</script>

以上程式碼的輸出如下：

4

迭代 Set

我們可以使用forEach 和for...of 迴圈來迭代 Set。這在下面的示例中顯示：

示例

<script>
   let names= new Set(['A','B','C','D']);
   //iterate using forEach
   console.log('forEach')
   names.forEach(n=>console.log(n))
   
   console.log('for of..')
   
   //iterate using for..of
   for(let n of names){
      console.log(n)
   }
</script>  

以上程式碼的輸出如下：

forEach
A
B
C
D
for of..
A
B
C
D

以下方法可用於操作 Set：

WeakSet

WeakSet 弱持有物件，這意味著如果儲存在 WeakSet 中的物件沒有被引用，則它們將被垃圾回收。WeakSet 不可迭代，並且沒有get 方法。

<script>

   let e1 = {ename:'A'}
   let e2 ={ename:'B'}
   let e3 ={ename:'C'}

   let emps = new WeakSet();
   emps.add(e1);
   emps.add(e2)
   .add(e3);

   console.log(emps)
   console.log(emps.has(e1))
   emps.delete(e1);
   console.log(emps)
</script>

以上程式碼的輸出如下：

WeakSet {{…}, {…}, {…}}
true
WeakSet {{…}, {…}}