在 ES6 中新增了两种数据结构，它们分别是 Set 和 Map，我们可以分别将它们和 Array、Object 进行对比
Set
Set 的字面意思就是集合，与 Array 类似，都是一些成员的聚集
根据中学数学我们知道，集合中的所有元素都是唯一的，所以 Set 和 Array 之间最大的区别是：Set中所有的成员都是唯一的
const s1 = new Set()
s1.add(1)
s1.add(2)
s1.add(1)
// s1 的值为 {1, 2}
Set 函数可以接受一个可遍历的数据结构作为参数来初始化
const s2 = new Set([1,2,1,3,4])
// s2 的值为 {1, 2, 3, 4}
可遍历的数据结构有哪些呢？数组、类数组、含有 iterable 接口 的其他数据结构都是可遍历的
属性与方法
size
s2.size // 4
add(value)
向 Set 中添加一个值，返回 Set 结构本身
s2.add(5).add(6).add(7)
delete(value)
删除一个值，返回布尔值表示是否成功删除
s2.delete(7)
has(value)
Set 中是否包含某个值，返回布尔值
s2.has(1)
clear()
清除所有成员，无返回值
s2.clear()
遍历
可以通过forEach进行遍历
s1.forEach((value, key) => console.log(value, key))
由于 Set 没有键名，只有键值，所以 key 和 value 是同一个值
Map
Object 是键值对的集合，而其中的键只能使用字符串，而 Map 与 Object 类似，也是键值对的集合，但是 Map 的键可以是何种类型的值
const m1 = new Map()
const k = {key, 'value'}
m1.set(k, 'mapValue')
m1.get(k)
Map 可以接受一个数组作为参数，这个数组的成员是一个个表示键值对的数组
const m2 = new Map([
['name', 'xiaoming'],
['age', 18]
])
// {'name'=>'xiaoming', 'age'=>18}
属性与方法
size
m2.size //2
set(key, value)
设置一个键名为 key 键值为 value 的成员，并返回整个 Map 结构，如果已经存在该键名，则会更新键值
m2.set('sex', 'boy')
get(key)
读取这个 key 对应的值，如果没有则返回 undefined
m2.get('sex')
has(key) / delete(key) / clear()
使用方法可参照上文 Set 对应的方法使用方式
遍历
keys() / values() / entries()
这三个遍历器生成函数分别返回 键名的遍历器、键值的遍历器、所有成员的遍历器
for (let key of m2.keys()) {console.log(key)}
for (let value of m2. values()) {console.log(value)}
for (let item of m2. entries()) {console.log(item[0], item[1])}
// 这里的 item 是一个数组，其中第一个值为键名，第二个值为键值
forEach()
m2.forEach((value, key) => console.log(value, key))
扫码关注前端周记公众号
网友评论