ES6 中的 Map 和 Set 数据结构的常用方法
在 ES6 （ECMAScript 2015）中，Map 和 Set 数据结构被正式加入到 JavaScript 语言标准中。Map 是一种可存储键值对的集合，其中的键和值可以是任何类型的数据，而且键是唯一的。Set 则是一种类似于数组的集合，其中的元素也是唯一的，不能有重复。这两种数据结构在前端开发中非常常见，因此掌握它们的常用方法，对于 JavaScript 开发者来说非常重要。
一、Map 数据结构的常用方法
- 赋值
使用 set() 方法可以将键值对添加到 Map 中，这个方法可以链式调用。
const map = new Map()
map.set('a', 1).set('b', 2).set('c', 3)
console.log(map) // Map(3) { 'a' => 1, 'b' => 2, 'c' => 3 }- 取值
使用 get() 方法可以获取 Map 中指定键所对应的值，如果键不存在，则返回 undefined。
const map = new Map([['a', 1], ['b', 2], ['c', 3]])
console.log(map.get('a')) // 1
console.log(map.get('d')) // undefined- 删除
使用 delete() 方法可以删除 Map 中指定键所对应的键值对，如果删除成功，则返回 true，否则返回 false。
const map = new Map([['a', 1], ['b', 2], ['c', 3]])
console.log(map.delete('a')) // true
console.log(map.delete('d')) // false- 判断键是否存在
使用 has() 方法可以判断 Map 中是否存在指定的键，如果存在，则返回 true，否则返回 false。
const map = new Map([['a', 1], ['b', 2], ['c', 3]])
console.log(map.has('a')) // true
console.log(map.has('d')) // false- 遍历
Map 数据结构支持多种遍历方式，包括 for...of 循环、forEach() 方法、keys() 方法、values() 方法和 entries() 方法。
（1）使用 for...of 循环遍历
const map = new Map([['a', 1], ['b', 2], ['c', 3]])
for (const [key, value] of map) {
console.log(key, value)
}
// a 1
// b 2
// c 3（2）使用 forEach() 方法遍历
const map = new Map([['a', 1], ['b', 2], ['c', 3]])
map.forEach(function(value, key) {
console.log(key, value)
})
// a 1
// b 2
// c 3（3）使用 keys() 方法遍历键
const map = new Map([['a', 1], ['b', 2], ['c', 3]])
for (const key of map.keys()) {
console.log(key)
}
// a
// b
// c（4）使用 values() 方法遍历值
const map = new Map([['a', 1], ['b', 2], ['c', 3]])
for (const value of map.values()) {
console.log(value)
}
// 1
// 2
// 3（5）使用 entries() 方法遍历键值对
const map = new Map([['a', 1], ['b', 2], ['c', 3]])
for (const [key, value] of map.entries()) {
console.log(key, value)
}
// a 1
// b 2
// c 3二、Set 数据结构的常用方法
- 赋值
使用 add() 方法可以将元素添加到 Set 中，这个方法可以链式调用。
const set = new Set()
set.add('a').add('b').add('c')
console.log(set) // Set(3) { 'a', 'b', 'c' }- 删除
使用 delete() 方法可以删除 Set 中指定的元素，如果删除成功，则返回 true，否则返回 false。
const set = new Set(['a', 'b', 'c'])
console.log(set.delete('a')) // true
console.log(set.delete('d')) // false- 判断元素是否存在
使用 has() 方法可以判断 Set 中是否存在指定的元素，如果存在，则返回 true，否则返回 false。
const set = new Set(['a', 'b', 'c'])
console.log(set.has('a')) // true
console.log(set.has('d')) // false- 遍历
Set 数据结构也支持多种遍历方式，包括 for...of 循环、forEach() 方法、keys() 方法、values() 方法和 entries() 方法。
（1）使用 for...of 循环遍历
const set = new Set(['a', 'b', 'c'])
for (const value of set) {
console.log(value)
}
// a
// b
// c（2）使用 forEach() 方法遍历
const set = new Set(['a', 'b', 'c'])
set.forEach(function(value) {
console.log(value)
})
// a
// b
// c（3）使用 keys() 方法遍历元素
const set = new Set(['a', 'b', 'c'])
for (const value of set.keys()) {
console.log(value)
}
// a
// b
// c（4）使用 values() 方法遍历元素
const set = new Set(['a', 'b', 'c'])
for (const value of set.values()) {
console.log(value)
}
// a
// b
// c（5）使用 entries() 方法遍历元素，等同于 values() 方法
const set = new Set(['a', 'b', 'c'])
for (const value of set.entries()) {
console.log(value)
}
// [ 'a', 'a' ]
// [ 'b', 'b' ]
// [ 'c', 'c' ]总结
通过本文的介绍，我们了解了 ES6 中 Map 和 Set 数据结构的常用方法，并学习了如何利用这些方法来处理键值对集合和元素集合。作为前端开发者，掌握这些方法对于我们日常的开发工作来说是非常有帮助的，希望本文能为大家提供一些实用的技术指导。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/649d7fa848841e9894a3d4e8