ES6 中的 Map 数据结构和 forEach 方法使用示例-JavaScript中文网-JavaScript教程资源分享门户

Map 数据结构简介

在 ES6 中，Map 是一种新的数据结构，它类似于对象，但是可以使用任意类型的值作为键。Map 的键值对可以是任意类型的值，而对象的键只能是字符串或符号。

Map 的常用方法包括：

set(key, value)：设置键值对，如果键已经存在，则更新值。
get(key)：获取键对应的值，如果键不存在，则返回 undefined。
has(key)：判断键是否存在，返回 true 或 false。
delete(key)：删除键值对，返回 true 或 false。
clear()：清空所有键值对。

Map 的使用示例

// javascriptcn.com 代码示例
// 创建一个空的 Map
const map = new Map();

// 设置键值对
map.set("name", "Tom");
map.set("age", 18);
map.set(true, "yes");

// 获取值
console.log(map.get("name")); // "Tom"
console.log(map.get(true)); // "yes"

// 判断键是否存在
console.log(map.has("name")); // true
console.log(map.has("gender")); // false

// 删除键值对
map.delete("name");
console.log(map.has("name")); // false

// 清空 Map
map.clear();
console.log(map.size); // 0

forEach 方法简介

在 ES6 中，Map 对象也提供了 forEach 方法，用于遍历键值对。forEach 方法接受一个回调函数作为参数，该回调函数接受三个参数：键值、键名和 Map 对象本身。

// javascriptcn.com 代码示例
// 创建一个 Map
const map = new Map();
map.set("name", "Tom");
map.set("age", 18);
map.set(true, "yes");

// 遍历 Map
map.forEach((value, key) => {
  console.log(key, value);
});

forEach 方法的使用示例

// javascriptcn.com 代码示例
// 创建一个 Map
const map = new Map();
map.set("name", "Tom");
map.set("age", 18);
map.set(true, "yes");

// 遍历 Map
map.forEach((value, key) => {
  console.log(key, value);
});

输出结果为：

name Tom
age 18
true yes

总结

ES6 中的 Map 数据结构和 forEach 方法是前端开发中常用的工具，它们可以帮助我们更方便地存储和遍历数据。在使用 Map 和 forEach 方法时，需要注意键值对的类型和回调函数的参数。同时，我们也可以结合其他 ES6 的新特性，如解构赋值和箭头函数，来更加优雅地编写代码。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/655d59dbd2f5e1655d79b0f5