ES6新特性(四): Set 和 Map

简介: ES6新特性(四): Set 和 Map

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

前言

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

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] 对的迭代器对象,其中 valueSet 中的元素。

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 中添加或删除值,其大小会动态变化。

使用场景:

  • 存储一组唯一的值,不关心顺序。
  • 进行数组去重。
  • 判断值是否存在。
相关文章
|
3天前
|
存储 算法 Java
解析HashSet的工作原理,揭示Set如何利用哈希算法和equals()方法确保元素唯一性,并通过示例代码展示了其“无重复”特性的具体应用
在Java中,Set接口以其独特的“无重复”特性脱颖而出。本文通过解析HashSet的工作原理,揭示Set如何利用哈希算法和equals()方法确保元素唯一性,并通过示例代码展示了其“无重复”特性的具体应用。
14 3
|
3天前
|
存储 算法 Java
Java Set因其“无重复”特性在集合框架中独树一帜
【10月更文挑战第14天】Java Set因其“无重复”特性在集合框架中独树一帜。本文深入解析Set接口及其主要实现类(如HashSet、TreeSet)如何通过特定的数据结构(哈希表、红黑树)确保元素唯一性,并提供最佳实践建议,包括选择合适的Set实现类和正确实现自定义对象的`hashCode()`与`equals()`方法。
13 3
|
4天前
|
Java 开发者
在Java的集合世界里,Set以其独特的特性脱颖而出,它通过“哈希魔法”和“红黑树防御”两大绝技
【10月更文挑战第13天】在Java的集合世界里,Set以其独特的特性脱颖而出。它通过“哈希魔法”和“红黑树防御”两大绝技,有效抵御重复元素的侵扰,确保集合的纯洁性和有序性。无论是“人海战术”还是“偷梁换柱”,Set都能从容应对,成为开发者手中不可或缺的利器。
16 6
|
1天前
|
存储 Java 数据处理
Java Set接口凭借其独特的“不重复”特性,在集合框架中占据重要地位
【10月更文挑战第16天】Java Set接口凭借其独特的“不重复”特性,在集合框架中占据重要地位。本文通过快速去重和高效查找两个案例,展示了Set如何简化数据处理流程,提升代码效率。使用HashSet可轻松实现数据去重,而contains方法则提供了快速查找的功能,彰显了Set在处理大量数据时的优势。
6 2
|
1天前
|
Java 开发者
在Java集合世界中,Set以其独特的特性脱颖而出,专门应对重复元素
在Java集合世界中,Set以其独特的特性脱颖而出,专门应对重复元素。通过哈希表和红黑树两种模式,Set能够高效地识别并拒绝重复元素的入侵,确保集合的纯净。无论是HashSet还是TreeSet,都能在不同的场景下发挥出色的表现,成为开发者手中的利器。
10 2
|
1天前
|
Java
Java Set以其“不重复”的特性,为我们提供了一个高效、简洁的处理唯一性约束数据的方式。
【10月更文挑战第16天】在Java编程中,Set接口确保集合中没有重复元素,每个元素都是独一无二的。HashSet基于哈希表实现,提供高效的添加、删除和查找操作;TreeSet则基于红黑树实现,不仅去重还能自动排序。通过这两个实现类,我们可以轻松处理需要唯一性约束的数据,提升代码质量和效率。
8 2
|
3天前
|
存储 Java 数据处理
在Java集合框架中,Set接口以其独特的“不重复”特性脱颖而出
【10月更文挑战第14天】在Java集合框架中,Set接口以其独特的“不重复”特性脱颖而出。本文通过两个案例展示了Set的实用性和高效性:快速去重和高效查找。通过将列表转换为HashSet,可以轻松实现去重;而Set的contains方法则提供了快速的元素查找功能。这些特性使Set成为处理大量数据时的利器。
10 4
|
4天前
|
存储 Java 数据处理
Java中的Set接口以其独特的“不重复”特性,在集合框架中占据重要地位。
【10月更文挑战第13天】Java中的Set接口以其独特的“不重复”特性,在集合框架中占据重要地位。本文通过两个案例展示了Set的实用性和高效性:快速去重和高效查找。通过将列表转换为HashSet,可以轻松实现去重;而Set的contains方法则提供了高效的元素查找功能。这些特性使Set在处理大量数据时表现出色,值得我们在日常编程中充分利用。
16 3
|
10天前
|
存储 JavaScript 前端开发
Set、Map、WeakSet 和 WeakMap 的区别
在 JavaScript 中,Set 和 Map 用于存储唯一值和键值对,支持多种操作方法,如添加、删除和检查元素。WeakSet 和 WeakMap 则存储弱引用的对象,有助于防止内存泄漏,适合特定场景使用。
|
12天前
|
存储 缓存 Java
【用Java学习数据结构系列】HashMap与TreeMap的区别,以及Map与Set的关系
【用Java学习数据结构系列】HashMap与TreeMap的区别,以及Map与Set的关系
27 1