ES7 中的 Map 与 Set 数据结构-JavaScript中文网-JavaScript教程资源分享门户

在现代前端开发中，数据结构是非常重要的一部分。ES7 中引入了两种常见的数据结构：Map 和 Set。Map 是一种以键值对的形式存储数据的有序列表，而 Set 是一种不允许重复元素的集合。这两种数据结构的引入极大地扩展了我们前端程序的能力。

Map 数据结构

Map 是一种键值对存储的有序列表，它的主要特点是可以使用不同的数据类型作为键，并且自动去重。这使得开发者能够更加灵活地存储和操作数据。

我们可以使用 new Map() 来创建一个空的 Map 对象，也可以使用 Array.from() 方法将数组转化为 Map 对象：

let map1 = new Map();

let array1 = [['key1', 'value1'], ['key2', 'value2']];
let map2 = new Map(array1);

向 Map 中添加元素可以使用 set() 方法：

map1.set('key1', 'value1');
map1.set('key2', 'value2');

从 Map 中获取元素可以使用 get() 方法：

map1.get('key1'); // 'value1'

从 Map 中删除元素可以使用 delete() 方法：

map1.delete('key1');

Map 使用 for...of 循环遍历时，会以键值对的形式输出：

for(let [key, value] of map1) {
  console.log(key, value);
}

Map 的 size 属性可以获取 Map 中元素的数量：

map1.size; // 1

Map 的 clear() 方法可以清空 Map：

map1.clear();

Set 是一种集合，它的主要特点是不允许重复元素。Set 的引入使得开发者能够更加方便地去重。

我们可以使用 new Set() 来创建一个空的 Set 对象，也可以使用 Array.from() 方法将数组转化为 Set 对象：

let set1 = new Set();

let array1 = [1, 2, 3, 4, 5, 6, 5, 4, 3, 2, 1];
let set2 = new Set(array1);

向 Set 中添加元素可以使用 add() 方法：

set1.add(1);
set1.add(2);

从 Set 中获取元素可以使用 values() 或者 keys() 方法：

set1.values(); // [1, 2]
set1.keys(); // [1, 2]

从 Set 中删除元素可以使用 delete() 方法：

set1.delete(1);

Set 使用 for...of 循环遍历时，会以元素的形式输出：

for(let value of set1) {
  console.log(value);
}

Set 的 size 属性可以获取 Set 中元素的数量：

set1.size; // 1

Set 的 clear() 方法可以清空 Set：

set1.clear();

在 ES7 中，引入了 Map 和 Set 两种数据结构，它们都有着各自的优点和适用场景。我们可以使用 Map 存储键值对，使用 Set 保存不重复的元素。这种数据结构的引入极大地扩展了我们前端程序的能力，使得我们能够更加便捷地操作和管理数据。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/64cfab3cb5eee0b5256db80d