在 ES6 中，Set 和 Map 是两个新的数据结构，它们非常实用，对于前端开发来说也非常有用。它们与传统的数组和对象有些不同，因此我们需要掌握它们特有的用法和操作方法，以充分利用 ES6 中的这两个数据结构。
Set 数据结构
Set 是一种集合结构，它能够存储各种类型的数据（包括基本类型和对象），并且不允许重复元素的存在。Set 对象中的元素是按照插入的顺序进行排序的，因此它是有序的。
创建一个 Set
创建一个 Set 对象很简单，只需要使用 new 关键字就行了：
let set = new Set();
我们还可以在创建的时候传入一个数组，这个数组中的元素会被自动添加到 Set 中：
let set = new Set([1, 2, 3]);
添加元素
添加元素的方式有两种。一种是使用 add() 方法：
set.add('hello');另一种方式是使用数组方式：
set['a'] = 'hello';
删除元素
使用 delete() 方法可以删除一个元素：
set.delete('hello');判断元素是否存在
使用 has() 方法可以判断一个元素是否存在：
set.has('hello');获取元素数量
使用 size 属性可以获取 Set 对象中的元素数量：
set.size;
清空 Set 对象
使用 clear() 方法可以清空 Set 对象中的所有元素：
set.clear();
遍历 Set 对象
可以使用 forEach() 方法遍历 Set 对象中的所有元素：
set.forEach(function (element) {
console.log(element);
});遍历时可以指定第二个参数，表示回调函数中 this 指向：
let obj = { name: 'jack' };
set.forEach(function (element) {
console.log(element, this.name);
}, obj);除了 forEach() 方法，还可以使用 for...of 循环遍历 Set 对象：
for (let element of set) {
console.log(element);
}示例代码
-- -------------------- ---- ------- --- --- - --- ------- -- -- -- -- -- -- ---- ------ ------------- -------- - ---- -------------------------- -------------------------- ---------------------- ---------------- ------------ -------------------- --------- - --------------------- --- --- ---- ------- -- ---- - --------------------- -
Map 数据结构
Map 数据结构是一种键值对的集合，它能够存储任何类型的值（包括基本类型和对象），并且以键值对的方式进行存储和访问。Map 中的键是唯一的，而值则可以重复。
创建一个 Map
创建一个空 Map 对象：
let map = new Map();
创建一个包含初始值的 Map 对象：
let map = new Map([ ['name', 'jack'], ['age', 18], ]);
添加元素
使用 set() 方法添加元素：
map.set('name', 'tom');获取元素
使用 get() 方法获取元素：
map.get('name');判断元素是否存在
使用 has() 方法可以判断一个键是否存在：
map.has('name');删除元素
使用 delete() 方法可以删除一个键值对：
map.delete('name');获取 Map 对象长度
使用 size 属性可以获取 Map 对象中键值对的数量：
map.size;
清空 Map 对象
使用 clear() 方法可以清空 Map 对象中的所有键值对：
map.clear();
遍历 Map 对象
使用 forEach() 方法遍历 Map 对象：
map.forEach(function (value, key) {
console.log(key, value);
});使用 for...of 循环遍历 Map 对象：
for (let [key, value] of map) {
console.log(key, value);
}示例代码
-- -------------------- ---- ------- --- --- - --- ----- -------- -------- ------- ---- --- ----------------- -------- ----------------------------- ---------------------------- --------------------- ---------------------- ------------ -------------------- ------- ---- - ---------------- ------- --- --- ---- ----- ------ -- ---- - ---------------- ------- -
总结
Set 和 Map 是 ES6 中新增的数据结构，它们具有不同于传统数组和对象的特性，可以很好地用来存储和操作数据。掌握它们的基本用法和操作方法可以让我们在开发中更加高效。这两个数据结构的使用方法虽然简单，但是应用广泛，能够帮助开发者更好地处理数据，提高应用程序的性能。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65b6c42badd4f0e0fff684b1