ES6 Set和WeakSet、Map和WeakMap数据结构（实例方法属性size、add、delete、has、clear、keys、values、entries、forEach）

最新推荐文章于 2024-06-20 11:21:08 发布

YF-SOD

最新推荐文章于 2024-06-20 11:21:08 发布

阅读量255

点赞数 2

分类专栏： # ES6 文章标签： ES6新增数据结构Map详解 ES6新增数据结构Set详解 Map和WeakMap区别 Set和WeakSet区别 Set应用数组去重求交并差集

本文链接：https://blog.csdn.net/AIWWY/article/details/119940379

版权

ES6 专栏收录该内容

12 篇文章 2 订阅

订阅专栏

Set.prototype.add(value)

Set.prototype.delete(value)

Set.prototype.has(value)

Set.prototype.clear()

add、delete、has、clear方法例子

Set.prototype.keys()

Set.prototype.values()

Set.prototype.entries()

Set.prototype.forEach()

keys、values、entries、forEach方法例子

Map.prototype.set(key, value)

Map.prototype.get(key)

Map.prototype.has(key)

Map.prototype.delete(key)

Map.prototype.clear()

Map.prototype.keys()

Map.prototype.values()

Map.prototype.entries()

Map.prototype.forEach()

keys、values、entries、forEach方法例子

WeakMap

Iterator遍历器

Set数据结构

ES6 提供的新数据结构。它类似于数组，但是成员的值都是唯一的，没有重复的值，可以理解为集合。

Set（）

通过new Set（）来新建该数据结构的实例对象，参数接收为一个数组（或者具有 iterable 接口的其他数据结构，例如下面例三）作为参数，用来初始化。iterable 接口见文底链接。

const set = new Set([1, 2, 3, 4, 4]);//Set(4) {1,2,3,4}
[...set]
// [1, 2, 3, 4]
// 例二
const items = new Set([1, 2, 3, 4, 5, 5, 5, 5]);//Set(5) {1,2,3,4,5}
items.size // 5
// 例三
const set = new Set(document.querySelectorAll('div'));

注意Set的数据结构里面比较值使用的算法叫做“Same-value-zero equality”，它类似于精确相等运算符（===），主要的区别是向 Set 加入值时认为NaN等于自身，而精确相等运算符认为NaN不等于自身。

Set 实例的属性和方法

`Set.prototype.size`

返回Set实例的成员总数，相当于数组中length。

`Set.prototype.add(value)`

添加某个值，返回 Set 结构本身即可以链式调用。

`Set.prototype.delete(value)`

删除某个值，返回一个布尔值，表示删除是否成功。

`Set.prototype.has(value)`

返回一个布尔值，表示该值是否为Set的成员。

`Set.prototype.clear()`

清除所有成员，没有返回值。

add、delete、has、clear方法例子

let s= new Set()
s.add(1).add(2).add(2);
// 注意2被加入了两次
s.size // 2
s.has(1) // true
s.has(2) // true
s.has(3) // false
s.delete(2);
s.has(2) // false
s.clear()
s.has(1)//false

`Set.prototype.keys()`

返回键名的遍历器

`Set.prototype.values()`

返回键值的遍历器

`Set.prototype.entries()`

返回键值对的遍历器

`Set.prototype.forEach()`

使用回调函数遍历每个成员

keys、values、entries、forEach方法例子

let set = new Set(['red', 'green', 'blue']);
for (let item of set.keys()) {
  console.log(item);
}
// red
// green
// blue
for (let item of set.values()) {
  console.log(item);
}
// red
// green
// blue
for (let item of set.entries()) {
  console.log(item);
}
// ["red", "red"]
// ["green", "green"]
// ["blue", "blue"]
set.forEach((value, key) => console.log(key + ' : ' + value))
//red : red
//green : green
//blue : blue

注意forEach方法还可以有第二个参数，表示绑定处理函数内部的this对象。

Set应用

数组去重

let arr = [3, 5, 2, 2, 5, 5];
let unique = [...new Set(arr)];

求数组交集、并集和差集

let a = new Set([1, 2, 3]);
let b = new Set([4, 3, 2]);
// 并集
let union = new Set([...a, ...b]);
// Set {1, 2, 3, 4}
// 交集
let intersect = new Set([...a].filter(x => b.has(x)));
// set {2, 3}
// （a 相对于 b 的）差集
let difference = new Set([...a].filter(x => !b.has(x)));
// Set {1}

WeakSet

相比Set，WeakSet 的成员只能是对象，而不能是其他类型的值。WeakSet 没有遍历操作（即没有keys()、values()和entries()方法），也没有size属性。不支持clear方法。因此只有四个方法可用：get()、set()、has()、delete()。

详细见链接

https://es6.ruanyifeng.com/?search=%3A%3A&x=0&y=0#docs/set-map

Map数据结构

ES6 提供的新数据结构。它类似于对象，也是键值对的集合，但是“键”的范围不限于字符串，特点在于可以将对象作键即把对象作为属性名称。

Map()

通过new Map()来新建该数据结构的实例对象，Map构造函数接受数组或任何具有 Iterator 接口的数据结构作为参数，只会取数组中的每一位中的第一位为属性名，第二位为属性值（多的位数不取，少的为undefined）。这就是说，Set和Map都可以用来生成新的 Map。注意访问和设置Map实例中的属性和值只能通过实例的方法get、set等，不能通过点运算符和[]。

const set = new Set([
  ['foo',1],
  ['bar',2,3],
  ['car'],
  []
]);
const m1 = new Map(set);
//Map(4) {"foo" => 1, "bar" => 2, "car" => undefined, undefined => undefined}
m1.get('foo') // 1
m1.get('bar')//2
m1.get('car')//undefined
m1.get(undefined)//undefined
const m2 = new Map([['baz', 3]]);
const m3 = new Map(m2);
m3.get('baz') // 3
(new Map([])).size//0
(new Map()).size//0

Map实例的属性和方法

`Map.prototype.size`

size属性返回 Map 结构的成员总数。

Map.prototype.set(key, value)

设置键名key对应的键值为value，然后返回整个 Map 结构即可以链式编写。如果key已经有值，则键值会被更新，否则就新生成该键。注意设置对象为属性时，只有同一个对象引用，Map 结构才将其视为同一个键。+0和-0，NaN都视为同一个键。

const map = new Map();
map.set(['a'], 555);
map.get(['a']) // undefined

Map.prototype.get(key)

读取key对应的键值，如果找不到key，返回undefined。

Map.prototype.has(key)

返回一个布尔值，表示某个键是否在当前 Map 对象之中。

Map.prototype.delete(key)

删除某个键，返回true。如果删除失败，返回false。

Map.prototype.clear()

清除所有成员，没有返回值。

Map.prototype.keys()

返回键名的遍历器。

Map.prototype.values()

返回键值的遍历器。

Map.prototype.entries()

返回所有成员的遍历器。

Map.prototype.forEach()

遍历 Map 的所有成员。

keys、values、entries、forEach方法例子

const map = new Map([
  ['F', 'no'],
  ['T',  'yes'],
]);

for (let key of map.keys()) {
  console.log(key);
}
// "F"
// "T"

for (let value of map.values()) {
  console.log(value);
}
// "no"
// "yes"

for (let item of map.entries()) {
  console.log(item[0], item[1]);
}
// "F" "no"
// "T" "yes"

// 或者
for (let [key, value] of map.entries()) {
  console.log(key, value);
}
// "F" "no"
// "T" "yes"

// 等同于使用map.entries()
for (let [key, value] of map) {
  console.log(key, value);
}
// "F" "no"
// "T" "yes"
const map = new Map([
  ['F', 'no'],
  ['T',  'yes'],
]);
const reporter = {
  report: function(key, value) {
    console.log("Key: %s, Value: %s", key, value);
  }
};
map.forEach(function(value, key, map) {
  this.report(key, value);
}, reporter);
//Key: F, Value: no
//Key: T, Value: yes

注意forEach方法还可以接受第二个参数，用来绑定this。forEach方法的回调函数的this，就指向reporter。

WeakMap

WeakMap只接受对象作为键名（null除外），不接受其他类型的值作为键名。没有遍历操作（即没有keys()、values()和entries()方法），也没有size属性。不支持clear方法。因此只有四个方法可用：get()、set()、has()、delete()。

详细见链接

https://es6.ruanyifeng.com/?search=%3A%3A&x=0&y=0#docs/set-map