App下載

JavaScript Map相關(guān)知識(shí)介紹

互聯(lián)網(wǎng)沖浪金牌選手 2023-06-18 13:20:50 瀏覽數(shù) (1467)
反饋

JavaScript Map是一種存儲(chǔ)鍵值對(duì)的數(shù)據(jù)結(jié)構(gòu),它可以使用任何類型的值作為鍵或值。Map對(duì)象可以記住鍵的插入順序,也可以通過(guò)迭代器來(lái)遍歷鍵值對(duì)。Map對(duì)象有一些重要的方法和屬性,下面介紹一些常用的。

創(chuàng)建Map對(duì)象

創(chuàng)建Map對(duì)象有兩種方式:

  • 通過(guò)傳遞一個(gè)數(shù)組給new Map()構(gòu)造函數(shù),數(shù)組的每個(gè)元素都是一個(gè)鍵值對(duì)的數(shù)組,例如:
    // 創(chuàng)建一個(gè)Map對(duì)象
    const fruits = new Map([
    ["apples", 500],
    ["bananas", 300],
    ["oranges", 200],
    ]);

  • 通過(guò)使用set()方法來(lái)添加鍵值對(duì),例如:

// 創(chuàng)建一個(gè)空的Map對(duì)象
const fruits = new Map();


// 使用set()方法添加鍵值對(duì)
fruits.set("apples", 500);
fruits.set("bananas", 300);
fruits.set("oranges", 200);

set()方法也可以用來(lái)修改已有的鍵值對(duì),只需傳入相同的鍵和新的值即可。

獲取Map對(duì)象的大小和值

Map對(duì)象有一個(gè)size屬性,可以返回Map對(duì)象中鍵值對(duì)的數(shù)量,例如:

// 獲取Map對(duì)象的大小
fruits.size; // 返回3

Map對(duì)象有一個(gè)get()方法,可以根據(jù)鍵來(lái)獲取對(duì)應(yīng)的值,例如:

// 獲取Map對(duì)象中某個(gè)鍵的值
fruits.get("apples"); // 返回500

刪除Map對(duì)象中的元素

Map對(duì)象有一個(gè)delete()方法,可以根據(jù)鍵來(lái)刪除對(duì)應(yīng)的鍵值對(duì),例如:

// 刪除Map對(duì)象中某個(gè)鍵值對(duì)
fruits.delete("apples"); // 返回true

delete()方法會(huì)返回一個(gè)布爾值,表示是否刪除成功。

Map對(duì)象也有一個(gè)clear()方法,可以清空整個(gè)Map對(duì)象,例如:

// 清空Map對(duì)象
fruits.clear(); // 返回undefined

判斷Map對(duì)象中是否存在某個(gè)鍵

Map對(duì)象有一個(gè)has()方法,可以根據(jù)鍵來(lái)判斷Map對(duì)象中是否存在該鍵,例如:

// 判斷Map對(duì)象中是否存在某個(gè)鍵
fruits.has("apples"); // 返回true

has()方法會(huì)返回一個(gè)布爾值,表示是否存在該鍵。

遍歷Map對(duì)象

Map對(duì)象可以通過(guò)forEach()方法來(lái)遍歷所有的鍵值對(duì),該方法接受一個(gè)回調(diào)函數(shù)作為參數(shù),回調(diào)函數(shù)會(huì)在每個(gè)鍵值對(duì)上執(zhí)行,并傳入當(dāng)前的值、鍵和整個(gè)Map對(duì)象作為參數(shù),例如:

// 遍歷Map對(duì)象
let text = "";
fruits.forEach(function (value, key) {
text += key + " = " + value;
});

Map對(duì)象也可以通過(guò)entries()方法來(lái)返回一個(gè)包含所有鍵值對(duì)的迭代器對(duì)象,該迭代器對(duì)象可以用for...of循環(huán)來(lái)遍歷,并得到每個(gè)鍵值對(duì)的數(shù)組,例如:

// 遍歷Map對(duì)象
let text = "";
for (const x of fruits.entries()) {
text += x;
}

除了entries()方法外,還有keys()方法和values()方法,分別返回一個(gè)包含所有鍵或所有值的迭代器對(duì)象。

總結(jié)

JavaScript Map是一種靈活而強(qiáng)大的數(shù)據(jù)結(jié)構(gòu),它可以使用任何類型的值作為鍵或值,并且保持了插入順序。Map對(duì)象提供了一些方便的方法和屬性來(lái)操作和遍歷鍵值對(duì)。如果你需要存儲(chǔ)一些相關(guān)聯(lián)的數(shù)據(jù),并且需要快速地訪問(wèn)和修改,那么Map對(duì)象是一個(gè)不錯(cuò)的選擇。

0 人點(diǎn)贊