ES6的Set与Map

Niucode

已于 2024-04-17 16:32:24 修改

阅读量413

点赞数 8

分类专栏： es6 文章标签： es6 前端 javascript

于 2024-04-17 15:55:30 首次发布

本文链接：https://blog.csdn.net/niucode/article/details/137875378

版权

es6 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

本文介绍了ES6中新增的Set和Map数据结构，包括它们的特点、使用方法（如创建、操作、遍历和转换），以及在实际编程中的应用场景，如数组去重和集合操作。

摘要由CSDN通过智能技术生成

在ES6之前，我们存储数据的结构主要有两种：数组、对象，而在ES6中新增了另外两种数据结构：Set、Map。

一、什么是Set？

Set是ES6新增的数据结构，类似数组，但是它的元素成员是唯一的。

Set的使用，属性和方法

1. 创建Set

① new Set()方式创建

let a = new Set()

② 通过传入数组方式创建

let a = new Set([1, 2, 'akun'])

2. Set.size：返回Set中元素的数量

let a = new Set([1, 2, 'akun'])

a.size // 3

3. Set.has(key)：查找Set对象中是否存在key，返回一个布尔值

let a = new Set([1, 2, 'akun'])

a.has('akun') // true

4. Set.add(key)：往Set对象中添加一个元素

let a = new Set()

a.add(1)

5. Set.delete(key)：删除元素key

let a = new Set([1, 2, 'akun'])

a.delete("akun")

6. Set.clear(): 清空Set的全部元素

let a = new Set([1, 2, 'akun'])

a.clear()

7. 遍历 Set

① forEach 遍历

let a = new Set([1, 2, 'akun'])

a.forEach(item => {
  console.log(item)
})

② for of 遍历

let a = new Set([1, 2, 'akun'])

for(let item of a) {
 console.log(item)
}

8. Set 转数组

① 使用 Array.from 方法

let a = new Set([1, 2, 'akun'])

let arr = Array.from(a)

② 使用扩展运算符

let a = new Set([1, 2, 'akun'])

let arr = [...a]

Set的使用场景：如可以利用元素成员唯一性实现数组去重，方法has()判断是否有某个元素等等。

代码的实现：

 // 数组去重
 let arr = [1, 1, 2, 3]
 let unique = [...new Set(arr)] // [1, 2, 3]
 

 let a = new Set([1, 2, 'akun'])
 let b = new Set([2, 3, 4])

 // 并集
 let union = [...new Set([...a, ...b])] // [1, 2, 'akun', 3, 4]

 // 交集
 let intersect = [...new Set([...a].filter(item => b.has(item)))] // [2]

 // 差集
 let difference = [
   ...new Set([...a].filter(item => !b.has(item))),
   ...new Set([...b].filter(item => !a.has(item))),
 ] //  [1, 'akun', 3, 4]

二、什么是Map?

Map是ES6新增的数据结构，类似于对象，本质上就是键值对的集合，对象的键只能是字符串或者Symbols，但Map的键可以为任意类型。

Map的使用，属性和方法

1. 创建Map

① new Map()方式创建

let a = new Map()

② 通过传入二维数组方式创建

let kvArray = [
  ['key1', 'value1'],
  ['key2', 'value2'],
]

let a = new Map(kvArray)

2. Map.size：返回Map对象中键值对数量

let kvArray = [
  ['key1', 'value1'],
  ['key2', 'value2'],
]

let a = new Map(kvArray)
a.size // 2

3. Map.has(key)：查找Map对象中是否存在key，返回一个布尔值

let kvArray = [
  ['key1', 'value1'],
  ['key2', 'value2'],
]

let a = new Map(kvArray)
a.has('key1') // true

4. Map.set(key, value)：设置Map对象的键值对（键名，键值），返回当前对象

let a = new Map()
a.set(0, 'zero')
a.set('key1', 'value1')

5. Map.get(key)：返回key值对应的value，如果key不存在则返回undefined

let kvArray = [
  ['key1', 'value1'],
  ['key2', 'value2'],
]

let a = new Map(kvArray)
a.get('key1') // value1

6. Map.delete(key)：删除Map对象中键名为key的键值对

let kvArray = [
  ['key1', 'value1'],
  ['key2', 'value2'],
]

let a = new Map(kvArray)
a.delete("key1")

7. Map.clear()：移除Map对象中保存的所有键名/键值对

let kvArray = [
  ['key1', 'value1'],
  ['key2', 'value2'],
]

let a = new Map(kvArray)
a.clear()

8. 遍历 Map