灏天阁

Map 的使用

· Yin灏

Map类型是键值对的有序列表,而键和值都可以是任意类型

  1. set()
  2. get()
  3. has()
  4. size

先看下简单的调用

  1. set 用来设置键和值
  2. get 通过键获取值
  3. has 判断是否存在某个值
  4. size 返回 map 中的个数
  5. clear 清空 map
let n = new Map();
n.set(1, "a");
console.log(n); //Map(1) { 1 => 'a' }
console.log(n.get(1)); //a
console.log(n.has(1)); //true
n.set(2, "a");
console.log(n.size); //2
n.clear();
n.size; // 0

基本使用

  1. 可以使用 set 来对 map 设置键值,并且可以使用链式操作来进行设置
  2. 键可以是任意数据类型
  3. 只能出现一次;它在  Map  的集合中是独一无二的
  4. entries 和 values 的使用
//基本数据类型
let m = new Map();
m.set(1, "a").set(2, "b").set(3, "c"); // 链式操作
// console.log(m) //Map(3) { 1 => 'a', 2 => 'b', 3 => 'c' }

只能出现一次

情况1:在这里 set 设置的都是同一个值,所以在这里键会被认为是同一个值,会更改值,而不会新加一个键 情况2:这种情况下 set 会设置一个新键

//情况1
let a = { a: 2 };
m.set(a, "a").set(a, "b");
console.log(m); //Map(1) { { a: 2 } => 'b' }
console.log(m.has(a)); //true
console.log(m.has({ a: 2 })); //false

//情况2
m.set({ a: 1 }, "a").set({ a: 1 }, "b");
console.log(m); //Map(2) { { a: 1 } => 'a', { a: 1 } => 'b' }
console.log(m.has({ a: 1 })); //false
let a = { a: 1 };
console.log(m.has(a)); //false

//对于情况2的解释
console.log({ a: 1 } === { a: 1 }); //false 因为复杂数据类型判断是否不相等,所以map在复杂数据类型的设置键上会有同样的效果
console.log(a === { a: 1 }); //false

4.遍历:entries 的使用

const map = new Map([
  ["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"

上面是 map 的使用方法,entries 可以用在 map 上面,object 的遍历也有用到 entries 这个功能,只是写法不一样,写法如下,用法和 map 都是相同的,结果的数据也是相同的

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

应用场景

从这里我们可以看出 map 的存储类型和 object 的存储非常相似,都是通过键值对的方式存储,并且可以通过遍历输出,不同的是 map 的键可以是任意的数据类型

对于 map 的应用场景,可以放到实现深拷贝中进行使用,存储对象中的复杂数据类型

- Book Lists -