Set和Map数据结构

详情阅

Set

Set本身是一个构造函数，用来生成Set数据结构。Set结构中的值不会重复。
Set函数接收具有iterable接口的数据结构作为参数，用来初始化Set结构。

const set = new Set([1,2,3,4,4,4]);
const set1 = new Set("12345555");
const set2 = new Set(document.querySelectorAll("div"));

Set结构内部判断相等是用的类似于Object.is()的方式。

注意Object.is()和===的区别

Set实例的属性和方法

• Set.prototype.constructor:构造函数。
• Set.prototype.size:返回Set实例的成员总数。
• 操作类方法
  • add(value):向Set结构中添加值。
  • delete(value):删除Set结构中的值，返回布尔值表示删除是否成功。
  • has(value):Set结构中是否有该值，返回布尔值。
  • clear():清除Set结构中的所有成员，没有返回值。
• 遍历类方法
  • keys():返回Set结构的所有键名的遍历器。
  • values():返回Set结构的所有键值的遍历器。
  • entries():返回Set结构的所有键值对的遍历器。
  • forEach():使用回调函数遍历每个成员。
  • 由于Set结构其实没有键名，所以keys()和values()的行为是完全一样的。

  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的遍历顺序就是插入顺序。这个特性有时非常有用，比如使用 Set 保存一个回调函数列表，调用时就能保证按照添加顺序调用。

Map

JavaScript的对象，本质上是键值对的集合，但是只能是传统上的字符串当作键(不是字符串会被自动转为字符串)。
而Map数据结构则解决了这个问题。它类似于对象，也是键值对的集合，但是“键”的范围则不限制于字符串，各种类型的值(包括对象)都可以当作键。
任何具有iterator接口、且成员都是一个双元素的数组的数据结构都可以当做Map构造函数的参数。

const map = new Map([
  ['name', '张三'],
  ['title', 'Author']
]);

map.size // 2
map.has('name') // true
map.get('name') // "张三"
map.has('title') // true
map.get('title') // "Author"

如果对同一个键多次赋值，后面的值将覆盖前面的值。

const map = new Map();

map
.set(1, 'aaa')
.set(1, 'bbb');

map.get(1) // "bbb"

注意，只有对同一个对象的引用，Map 结构才将其视为同一个键。这一点要非常小心。

const map = new Map();

map.set(['a'], 555);
map.get(['a']) // undefined

上面代码的set和get方法，表面是针对同一个键，但实际上这是两个值，内存地址是不一样的，因此get方法无法读取该键，返回undefined。

由上可知，Map 的键实际上是跟内存地址绑定的，只要内存地址不一样，就视为两个键。这就解决了同名属性碰撞（clash）的问题，我们扩展别人的库的时候，如果使用对象作为键名，就不用担心自己的属性与原作者的属性同名。

Map实例的属性和方法

• 操作类方法
  • size:返回Map结构的成员总数
  • set(key,value):set方法设置键名key对应的键值为value，然后返回整个 Map 结构。如果key已经有值，则键值会被更新，否则就新生成该键。
  • get(key):get方法读取key对应的键值，如果找不到key，返回undefined。
  • has(key):has方法返回一个布尔值，表示某个键是否在当前 Map 对象之中。
  • delete(key):delete方法删除某个键，返回true。如果删除失败，返回false。
  • clear():clear方法清除所有成员，没有返回值。
• 遍历类方法
  • keys()：返回键名的遍历器。
  • values()：返回键值的遍历器。
  • entries()：返回所有成员的遍历器。
  • forEach()：遍历 Map 的所有成员。
  • 需要特别注意的是，Map 的遍历顺序就是插入顺序。

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"