小编

在JavaScript中,获取 Map 工具中的数据可以通过几种不同的办法来实现:

利用 Map 的 .keys(), .values(), 和 .entries() 方法:.keys() 返回一个迭代器,包含 Map 中的所有键。
.values() 返回一个迭代器,包含 Map 中的所有值。
.entries() 返回一个迭代器,包含 Map 中的键值对数组。

const map = new Map([ ['key1', 'value1'], ['key2', 'value2'] ]); // 获取所有键 const keys = Array.from(map.keys()); console.log(keys); // ['key1', 'key2'] // 获取所有值 const values = Array.from(map.values()); console.log(values); // ['value1', 'value2'] // 获取所有键值对 const entries = Array.from(map.entries()); console.log(entries); // [['key1', 'value1'], ['key2', 'value2']] 利用 for...of 循环遍历 Map:for...of 可以直接遍历 Map 工具,每次迭代返回一个 [key, value] 形式的数组。

for (const [key, value] of map) { console.log(`Key: ${key}, Value: ${value}`); }利用 Map.prototype.forEach 方法:forEach 方法对 Map 工具中的每个键值对实行一次供应的函数。

map.forEach((value, key) => { console.log(`Key: ${key}, Value: ${value}`); });利用 Map.prototype.size 获取 Map 的大小:size 属性返回 Map 工具中的元素数量。

const size = map.size; console.log(`Map has ${size} entries.`);直接通过索引访问 Map 元素(不推举,由于 Map 是非索引凑集):只管 Map 工具不是通过索引访问的,但如果你将 Map 转换为数组,可以通过索引访问数组元素。

const arrayFromMap = Array.from(map); console.log(arrayFromMap[0]); // ['key1', 'value1']

Map 工具保持键值对的插入顺序,以是遍历 Map 时,元素的顺序是按照它们被添加到 Map 中的顺序。

maphtmlJavaScript 灵巧地玩转 Map React