你可能不知道的 Map 和 Set

239 阅读3分钟

set

set数据结构内的键值具有唯一性,不会重复,格式类似数据,都具有下标,但是数据的长度是 length 而 set 的长度是 size

const set = new Set();
set.add('a');
set.add('b');
set.add('c');
set.add('d');

Set 数据结构的add 方法,可向Set中新增一个元素,返回的是添加后新 Set

set.add(10);

Set 数据结构的 delete 方法,可删除 Set 中的一个元素,返回值是一个布尔值,如果被删除的元素存在则从 Set 中删除并返回 true,如果不存在则返回 false

console.log(set.delete(10)); 
console.log(set);

set 数据结构的 has 方法,用于判断参数元素是否存在于 Set 中,如果存在则返回 true,如果不存在则返回 false

console.log(set.has(10));
console.log(set.has(9));

set 数据结构的 clear 方法,用于清除 Set 内的所有数据,没有返回值

console.log(set.clear());
console.log(set)

set 数据结构的 keys 方法

console.log(set.keys());

set 数据结构的 values 方法

console.log(set.values());

set 数据结构的 entries 方法

console.log(set.entries());

set 数据结构的 forEach 方法

set.forEach((value, key) => {
    console.log(value + ':' + key);
});

注意: set 数据结构没有键,只有值,所以 values 和 keys 的使用方法完全一致,forEach 也没有意义

map

map 数据结构是键值对的集合,他接收一个数组作为参数,并且每一个数组元素都是一个数组,元素数组中包含两个元素,第一个是键,第二个为值

const map = new Map([
    ['a', 1],
    ['b', 2],
    ['c', 3],
]);
console.log(map);

map 区别于 set ,map 更像是一个对象的集合,他每一个元素都像是一个对象

Set 和 Map 都可以生成新的 Map

注意:map 和 set 的接受值都必须是数组,数组元素可以是非数组,但是传入构造函数内部的参数必须是数组

const set = new Set([
    ['foo', 1],
    ['bar', 2]
]);
console.log(new Map(set));

如果对一个键多次赋值,那么后面的值将会覆盖掉前面的值

 map.set('a', 4);
 console.log(map);

如果通过 get 方法获取一个未定义的键名,那么返回的将会是 undefined

console.log(map.get('d'));

map 中的 set 方法,用于向 Map 中设置一个键值对

map.set('d', 4);
console.log(map);

Map 中的 get 方法,用获取对应的值

console.log(map.get('c'));
​
如果查询不到则获取 undefined
​
console.log(map.get('d'));// undefined

Map 中的 has 方法,用来查询一个 key 是否在 Map 中,

console.log(map.has('c'));// true
console.log(map.has('d'));// false

Map 中的 delete 方法,用来删除一个键名为参数的键值对

map.delete('c');
console.log(map.has('c'));// false

Map 中的 clear 方法,用来清除 Map 中的所有键值对

map.clear()
console.log(map);// { size:0 }

Map 的遍历方法 keys 用于获取一个由键名组成的 iterator 迭代集合

console.log(map.keys()); // { 'a', 'b', 'c' }

Map 的遍历方法 values 用于获取一个由键值组成的 iterator 迭代集合

console.log(map.values());// {1 , 2 , 3 }

Map 的遍历方法 forEach 类似数组方法,可以遍历 Map 中所有的键名和键值

 const result = map.forEach((item, index) => {
 console.log(item + ':' + index);
 });
console.log(result);// forEach 方法没有返回值(undefined)
​
console.log([...map]); // 使用拓展字符串可以将其转换成源参数

不要吹灭你的灵感和你的想象力; 不要成为你的模型的奴隶。 ——文森特・梵高