ES6之Map

123 阅读2分钟

每天做个总结吧,坚持就是胜利!

    /**
        @date 2021-06-09
        @description ES6之Map
    */

壹(序)

MapES6新增的一种数据结构,与Object类似,区别在于Object的键名只能是字符串,如果将一个引用数据类型做为Object的键名会先将该引用数据类型转化为字符串,而Map可以使用JavaScript中所有的数据类型做为键名。

贰(使用)

使用Map构造函数声明一个新的Map对象,可以传一个带有Iterator接口的数据结构,且每个成员都是双元素

const map = new Map([['a', 1], ['b', 2]]); // Map(2) {"a" => 1, "b" => 2}
const map = new Map(new Set([['a', 1], ['b', 2]])); // Map(2) {"a" => 1, "b" => 2}

叁(属性及方法)

Map内置了以下属性及方法: 公共代码:

let map = new Map([['a', 1], ['b', 2]]);
  1. size-返回Map对象的长度
map.size; // 2
  1. set(key, value)-设置Map对象键名key的键值为value,如果Map对象中已存在此键名,则覆盖,否则新建,返回设置之后的Map对象;
map.set('a', 3); // Map(2) {"a" => 3, "b" => 2}
map.set('c', 4); // Map(3) {"a" => 3, "b" => 2, "c" => 4}
  1. get(key)-获取Map对象中key对应的值,不存在则返回undefined;
map.get('a'); // 3
map.get('d'); // undefined
  1. has(key)-判断key是否存在于Map对象中;
map.has('a'); // true
map.has('d'); // false
  1. delete(key)-删除Map对象的某一项,返回是否删除成功;
map.delete('a'); // true
map.delete('d'); // false
console.log(map); // Map(2) {"b" => 2, "c" => 4}
  1. clear()-清空Map对象,没有返回值;
map.clear();
console.log(map); // Map(0) {}
  1. keys()-返回Map对象键名的遍历器;
map.set('name', 'E1e').set('age', 18); // Map(2) {"name" => "E1e", "age" => 18}
for(const key of map.keys()){
    console.log(key); // 'name', 'age'
}
  1. values()-返回Map对象键值的遍历器;
for(const val of map.values()){
    console.log(val); // 'E1e', 18
}
  1. entries()-返回Map对象键值对的遍历器;
for(const item of map.entries()){
    console.log(item); // ['name', 'E1e'], ['age', 18]
}
  1. forEach()-遍历Map对象所有成员,与数组的forEach方法类似;
map.forEach((val, key, source) => {
    console.log(val, key, source);
})
/**
'E1e' 'name' Map(2) {"name" => "E1e", "age" => 18}
18 'age' Map(2) {"name" => "E1e", "age" => 18}
*/
  1. 使用扩展运算符(...)将Map对象转换为数组;
const mapArr = [...map]; // [['name', 'E1e'], ['age', 18]]

肆(引申)

Set一样,Map也对应一种数据结构WeakMapWeakMap与Map主要区别如下:

  1. WeakMap中的键名只能是对象
const wm = new WeakMap();
wm.set(true, 1); // Uncaught TypeError: Invalid value used as weak map key
wm.set({a: 1}, {b: 2}); // WeakMap {{…} => {…}}
  1. WeakMap中键名的引用与WeakSet中的值一样,是弱引用,垃圾回收机制不会考虑WeakMap中键名的引用;
  2. WeakMap中没有遍历操作,也没有size属性;
wm.size; // undefined
wm.keys; // undefined