使用 JavaScript 遍历 Map
How to iterate a Map using JavaScript
使用该forEach()方法迭代Map对象。该方法采用一个函数，该函数按插入顺序为 , 中forEach
的每个键/值对调用。该函数在每次迭代Map时都会传递值、键和对象。Map
索引.js
const map1 = new Map([ ['country', 'Chile'], ['age', 30], ]); // 👇️ Using forEach map1.forEach((value, key) => { console.log(value, key); // 👉️ Chile country, 30 age }); // 👇️ Using for...of for (const [key, value] of map1) { console.log(key, value); // 👉️ country Chile, age 30 } // ✅ Iterate over a Map's keys for (const key of map1.keys()) { console.log(key); // 👉️ country, age } // ✅ Iterate over a Map's values for (const value of map1.values()) { console.log(value); // 👉️ Chile, 30 }
在第一个示例中，我们使用
Map.forEach
方法迭代 a 中的键/值对Map。
我们传递给forEach()方法的函数使用以下 3 个参数调用：
- 当前
value迭代的 - 当前
key迭代的 - 被迭代的
Map对象
该forEach方法返回undefined。
在我们的其他示例中，我们使用了
for…of
循环。
索引.js
const map1 = new Map([ ['country', 'Chile'], ['age', 30], ]); for (const [key, value] of map1) { console.log(key, value); // 👉️ country Chile, age 30 }
for...of循环允许我们迭代可迭代对象，如映射、集合和数组。
我们使用
解构赋值
来分配key和value变量。
索引.js
const [key, value] = ['country', 'Chile']; console.log(key); // 👉️ country console.log(value); // 👉️ Chile
for...of如果您必须使用
break关键字过早地退出循环，循环可能是您的首选方法。break该方法不支持使用关键字forEach()。
for...of循环仅遍历对象自身的属性，而循环for...in也遍历继承的属性。在我们的第三个和第四个示例中，我们使用了
Map.keys()
和
Map.values()
方法来获取包含Map.
请注意，Map.keys()和Map.values()方法的返回值不是数组，它们是迭代器对象。
如果您想将 Map 的值转换为数组，例如为了能够使用该方法，您可以使用
Array.fromforEach方法。
索引.js
const map1 = new Map([ ['country', 'Chile'], ['age', 30], ]); // 👇️️ ['country, 'age'] const keys = Array.from(map1.keys()); // 👇️️ ['Chile', 30] const values = Array.from(map1.values());
另一种方法是使用
扩展运算符 (…)
将迭代器对象中的值解包到数组中。
索引.js
const map1 = new Map([ ['country', 'Chile'], ['age', 30], ]); const keys = [...map1.keys()]; // 👉️ ['country, 'age'] const values = [...map1.values()]; // 👉️ ['Chile', 30]
最后 2 个示例实现了相同的结果。它们都将迭代器对象转换为数组。
您现在可以使用该forEach方法遍历数组，以及任何其他数组方法。