JavaScript中map屬性示例詳解

更新時間：2024年08月01日 11:49:21 作者：劉志輝

Map對象在JavaScript中提供了一種靈活且高效的鍵值對存儲方式,它具有許多實用的方法,如set()、get()、has()和delete()等,使得操作和管理鍵值對變得更加簡單,這篇文章主要介紹了JS中map屬性,需要的朋友可以參考下

一、創(chuàng)建和初始化Map對象

使用new Map()構造函數(shù)可以創(chuàng)建一個新的Map對象。你還可以在構造函數(shù)中傳入一個可迭代對象（如鍵值對數(shù)組）來初始化Map對象。

const map1 = new Map(); // 創(chuàng)建一個空的Map對象
const map2 = new Map([
  ['key1', 'value1'],
  ['key2', 'value2'],
  ['key3', 'value3']
]); // 使用鍵值對數(shù)組初始化Map對象

二、添加和獲取鍵值對

使用set()方法向Map對象中添加鍵值對，使用get()方法根據(jù)鍵獲取對應的值。

map1.set('key1', 'value1');
map1.set('key2', 'value2');
console.log(map1.get('key1')); // 輸出：'value1'
console.log(map1.get('key2')); // 輸出：'value2'

三、檢查鍵是否存在

使用has()方法檢查Map對象中是否存在指定的鍵。

console.log(map1.has('key1')); // 輸出：true
console.log(map1.has('key3')); // 輸出：false

四、刪除鍵值對

使用delete()方法從Map對象中刪除指定的鍵及其對應的值。

map1.delete('key1');
console.log(map1.has('key1')); // 輸出：false

五、遍歷Map對象

Map對象支持使用forEach()方法或for...of循環(huán)進行遍歷。

// 使用forEach()方法遍歷
map1.forEach((value, key) => {
  console.log(`${key}: ${value}`);
});
// 使用for...of循環(huán)遍歷
for (const [key, value] of map1) {
  console.log(`${key}: ${value}`);
}

六、Map對象與其他數(shù)據(jù)結構的比較

Map對象與Object和WeakMap等其他數(shù)據(jù)結構在存儲鍵值對時有一些不同之處。例如，Map對象能夠記住鍵的插入順序，而Object的屬性順序在不同的JavaScript引擎中可能會有差異。另外，WeakMap只接受對象作為鍵，這使得它在某些特定場景下比Map對象更加適用。