javascript 的 Map 與 Set

Map 和 Set 是 ES6 新加入的資料結構，Map 很像物件，因為它們可以將一個鍵對應到一個值，Set 很像陣列，但它無法被複製。

Map

在 ES6 之前，當你需要將鍵對應到值的時候，會使用物件，因為物件可以讓鍵對應到各種型態的物件值，可是這樣使用物件會有許多缺點：

• 因為物件的原型特性，代表你有可能會對應到意外的東西。
• 你不容易知道一個物件裡面有多少對應
• 鍵必須是字串或符號，讓你無法將物件對應到值
• 物件不保證特性的順序

Map 物件可以解決這些缺點，而且很適合將鍵對應到值，比如說想要將使用者物件對應到角色：

const u1={name: 'John'}
const u2={name: 'Tom'}
const u3={name: 'Mary'}

建立 map

const userRoles= new Map();

使用 map 的 set() 來指派角色給使用者。

userRoles.set(u1, 'User')
userRoles.set(u2, 'User')
userRoles.set(u3, 'Admin')

也可以鏈結

userRoles.set(u1, 'User')
.set(u2, 'User')
.set(u3, 'Admin')

也可以傳遞陣列的陣列給建構式

const userRoles= new Map([
  [u1, 'User'],
  [u2, 'User'],
  [u3, 'Admin']
]);

如果想要知道 u2 角色是什麼，可以使用 get() 方法

userRoles.get(u2); //User

也可以透過 has() 方法來判斷是否有某個鍵

userRoles.has(u2) //true

要修改某個鍵的值則是用以下寫法：

userRoles.get(u1); //User
userRoles.set(u1, "Admin");  
userRoles.get(u1); //Admin

size 特性可以回傳 map 內的項目數量

userRoles.size; //3

使用 keys() 方法來取得 map 內的鍵，values() 回傳值，entries() 取得項目陣列。

for(let u of userRoles.keys()){
  console.log(u.name)
}

for(let r of userRoles.values()){
  console.log(r)
}

for(let ur of userRoles.entries()){
  console.log(`${ur[0].name}: ${ur[1]}`)
}

使用解構

for(let [u, r] of userRoles.entries()){
  console.log(`${u.name}: ${r}`)
}

要刪除 map 的一個項目，可以使用 detele() 方法

userRoles.delete(u2)

要刪除 map 的所有項目，可以使用 clear() 方法

userRoles.clear()

Set

set 是一組不重複的資料，在之前的範例中，我們可能想要賦與一個使用者多個角色，比如所有使用者都有 User 角色，但如果有 Admin 角色的同時也會有 User 角色，這時候就可使用 set。

首先建立一個 Set 實例：

const roles=new Set();

如果想要替一個使用者增加角色，可以使用 add() 方法：

roles.add("User")

再增加管理員的角色

roles.add("Admin")
roles.size; //2

要刪除角色的話使用 delete() 方法

roles.delete("Admin")