如何遍歷 Typescript 中的 map：for...in？ 為了……的？ 為每個？

Question

我試圖了解在 Typescript 中迭代 map 的語法。 我的 map 中的鍵是字符串。 這些值為字符串的 arrays。

這是一些示例代碼：

let attributeMap: Map<string, string[]> = new Map<string, string[]>();

// sample data
let sampleKey1 = "bob";

// populate map
let value: string[] = attributeMap.get(sampleKey1) || [];
value.push("clever");
attributeMap.set(sampleKey1, value);

value = attributeMap.get(sampleKey1) || [];
value.push("funny");
attributeMap.set(sampleKey1, value);


// try looping through the map
for (let key in attributeMap) {
    console.log(attributeMap.get(key));
    console.log("WE'RE IN THE MAP!");
}

console.log("done");

當我運行這段代碼時，唯一打印的是“完成”。

為什么 map 中沒有任何內容被打印，也沒有“我們在地圖中”的消息？ 就好像永遠不會進入 for 循環一樣。 為什么會這樣，我將如何解決這個問題？

Answer 1

當您將密鑰設置為 Maps 時，密鑰不會被放入 Map 實例 - 它們內部存儲在 Map 中，並且只能通過使用各種 Z46F3EA056CAA3126B91F3F70BEEA068C 迭代方法之一訪問。 for..in僅直接在object 或其原型上迭代屬性。

要遍歷 Map，請嘗試以下操作：

for (const [key, value] of attributeMap.entries()) {
  console.log(key, value);
}

當您的集合是一個普通的 object 本身具有鍵值對的 object 時， for..in是有意義的，但不適用於以不同方式存儲數據的 Maps。

當屬性直接位於 object 上時，語法通常如下所示：

someObj.someProp = 'someVal';

這會將someProp屬性放到someObj object 上。

但是地圖將其數據存儲在 Map 的 [[MapData]]內部插槽中，而不是直接存儲在 Map 的不同屬性上。

就像理論練習一樣，在 JS 中，您可以將屬性直接放在 Map 實例上，然后用for..in對其進行迭代（基本上，將 map 濫用為 ZA8CFDE6331BD59EB2666F8911CB 擁有：

const map = new Map();
map.foo = 'bar';
for (const prop in map) {
  // ...
}

但這是一種反模式，永遠不應該這樣做。 Either use an object and set/retrieve properties with dot and bracket notation (and other object methods like Object.entries ), or use a Map and set/retrieve properties with Map.get and Map.set and the other Map methods.