ES6新特性（四）: Set 和 Map

ES6指的是ECMAScript 6，也被称为ES2015。它是JavaScript的一种版本，是ECMAScript标准的第六个版本，于2015年发布。ECMAScript是JavaScript的规范，定义了语言的核心特性和行为。ES6引入了许多新的语法特性和功能，以使JavaScript代码更加现代化、清晰和强大。 在此专栏中，我们会持续更新有关于ES6的新特性，感兴趣的小伙伴们可以订阅一下~

前言

今天我们来聊聊ES6新特性中的Set 和 Map,Set 和 Map 是 ECMAScript 6（ES6）引入的两种新的数据结构，Set 和 Map 提供了更灵活、更强大的数据结构，允许开发者更方便地处理一组唯一的值或键值对。在某些场景下，使用 Set 和 Map 可以带来更高效的数据操作，因为它们是为特定目的而设计的数据结构，而不像普通对象那样有可能包含额外的原型链属性。

Set

Set 是 ECMAScript 6（ES6）中引入的一种数据结构，用于存储一组唯一的值，即不允许重复。它是一种集合类型，与数组类似，但是没有顺序概念。

创建 Set：

可以使用 new Set() 构造函数创建一个空的 Set，或者通过传递一个可迭代对象（如数组）来创建包含初始值的 Set。

// 创建空的 Set
const mySet = new Set();

// 创建包含初始值的 Set
const initialSet = new Set([1, 2, 3, 4, 5]);

Set 的基本操作：

• 添加值： 使用 add 方法向 Set 中添加新的值。

  mySet.add(6);

• 删除值： 使用 delete 方法从 Set 中删除指定的值。

  mySet.delete(2);

• 检查是否存在： 使用 has 方法检查 Set 中是否存在某个值。

  console.log(mySet.has(3)); // 输出 true

• 获取 Set 的大小： 使用 size 属性获取 Set 的大小（包含的唯一值的数量）。

  console.log(mySet.size); // 输出当前 Set 的大小

使用 Set 解决数组去重问题：

由于 Set 中的值是唯一的，可以利用这个特性轻松实现数组去重。

const array = [1, 2, 3, 3, 4, 5, 5];

// 使用 Set 进行数组去重
const uniqueValues = [...new Set(array)];

console.log(uniqueValues);
// 输出: [1, 2, 3, 4, 5]

这里的步骤是：

1. 创建一个 Set 对象，利用 Set 的唯一性会忽略重复值的特性。
2. 将数组的值通过解构赋值传递给 Set 构造函数，这样 Set 内部会自动去重。
3. 最后，使用扩展运算符 (...) 将 Set 转回数组。

这样，得到的 uniqueValues 数组就是去重后的结果。

请注意，这种方法去重的结果是保持原数组中的元素顺序的。

set迭代器属性

Set 是可迭代的，这意味着你可以使用一些迭代的方式来遍历 Set 中的元素。以下是 Set 的迭代属性和方法：

1. 使用 for...of 循环：

const mySet = new Set([1, 2, 3, 4, 5]);

for (const value of mySet) {
    console.log(value);
}

这会遍历 Set 中的每一个元素，输出：

1
2
3
4
5

2. 使用 forEach 方法：

const mySet = new Set([1, 2, 3, 4, 5]);

mySet.forEach(value => {
    console.log(value);
});

这也会遍历 Set 中的每一个元素，输出同样的结果。

3. 使用 entries() 方法：

entries() 方法返回一个包含 [value, value] 对的迭代器对象，其中 value 是 Set 中的元素。

const mySet = new Set([1, 2, 3, 4, 5]);

for (const entry of mySet.entries()) {
    console.log(entry);
}

这将输出：

[1, 1]
[2, 2]
[3, 3]
[4, 4]
[5, 5]

在 Set 中，键和值相同，所以每个条目都是 [value, value]。

4. 使用 values() 方法：

values() 方法返回一个包含 Set 中值的迭代器对象。

const mySet = new Set([1, 2, 3, 4, 5]);

for (const value of mySet.values()) {
    console.log(value);
}

这将输出：

1
2
3
4
5

5. 使用 keys() 方法：

keys() 方法也返回一个包含 Set 中值的迭代器对象，与 values() 方法相同。

const mySet = new Set([1, 2, 3, 4, 5]);

for (const key of mySet.keys()) {
    console.log(key);
}

这同样会输出：

1
2
3
4
5

在 Set 中，键和值是相同的。

Map

Map 是 ECMAScript 6（ES6）中引入的一种键值对的集合，用于存储任意类型的键和值之间的映射关系。以下是关于 Map 的全面介绍：

创建 Map：

可以使用 new Map() 构造函数创建一个空的 Map，或者通过传递一个包含键值对的数组或其他可迭代对象来创建带有初始值的 Map。

// 创建空的 Map
const myMap = new Map();

// 创建包含初始值的 Map
const initialMap = new Map([
  ['key1', 'value1'],
  ['key2', 'value2'],
  // ...
]);

Map 的基本操作：

• 添加键值对： 使用 set 方法向 Map 中添加新的键值对。

  myMap.set('key3', 'value3');

• 获取值： 使用 get 方法获取指定键对应的值。

  console.log(myMap.get('key1')); // 输出 'value1'

• 检查键是否存在： 使用 has 方法检查 Map 中是否存在某个键。

  console.log(myMap.has('key2')); // 输出 true

• 删除键值对： 使用 delete 方法从 Map 中删除指定的键值对。

  myMap.delete('key1');

• 清空 Map： 使用 clear 方法清空 Map 中的所有键值对。

  myMap.clear();

Map可以用任意数据类型做 key 的一种对象

Map 允许使用任意类型的值作为键，包括基本数据类型（如字符串、数字、布尔值）、对象、函数等。这是 Map 相对于普通对象的一个重要区别。在普通对象中，键会被自动转换为字符串，而在 Map 中，键的比较是严格相等的，不会发生类型转换。

const myMap = new Map();

// 使用字符串作为键
myMap.set('stringKey', 'This is a string key');

// 使用数字作为键
myMap.set(42, 'This is a number key');

// 使用布尔值作为键
myMap.set(true, 'This is a boolean key');

// 使用对象作为键
const objKey = { key: 'objectKey' };
myMap.set(objKey, 'This is an object key');

// 使用函数作为键
const functionKey = function() {};
myMap.set(functionKey, 'This is a function key');

// 输出 Map 中的键值对
for (const [key, value] of myMap) {
    console.log(key, value);
}

在这个例子中，myMap 包含了不同类型的键，而且每个键都对应一个值。使用 Map 的这种灵活性使得它非常适合在需要根据不同类型的键检索值的场景，而不受键类型转换的影响。

Map 的迭代：

Map 提供了多种迭代的方法，允许遍历键、值或键值对：

• 遍历键值对：

  for (const [key, value] of myMap) {
      console.log(key, value);
  }

• 遍历键：

  for (const key of myMap.keys()) {
      console.log(key);
  }

• 遍历值：

  for (const value of myMap.values()) {
      console.log(value);
  }

总结

Map 的特点：

1. 键可以是任意类型： 与对象不同，Map 的键可以是任意类型，包括基本数据类型、对象、函数等。
2. 保持插入顺序： Map 保持插入顺序，即键值对的顺序与插入的顺序一致。
3. 可迭代： Map 是可迭代的，可以使用 for...of 循环遍历。
4. 动态变化： Map 的大小可以动态变化，可以随时添加或删除键值对。

使用场景：

• 存储和获取键值对，适用于需要根据键来检索值的场景。
• 需要使用非字符串键的情况，例如对象、函数等。
• 保持键值对的顺序很重要的场景。

Set 的特点：

1. 唯一性： Set 中的值是唯一的，重复的值会被忽略。
2. 无序性： Set 中的值是无序的，不具备索引和顺序概念。
3. 可迭代性： Set 是可迭代的，可以使用 for...of 循环遍历。
4. 大小可动态变化： 可以随时向 Set 中添加或删除值，其大小会动态变化。

使用场景：

• 存储一组唯一的值，不关心顺序。
• 进行数组去重。
• 判断值是否存在。