语言►JavaScript►Map

JavaScript中的Map

本文作者: jsweibo

本文链接: https://jsweibo.github.io/2020/06/21/JavaScript%E4%B8%AD%E7%9A%84Map/

摘要

本文主要讲述了：

  1. 什么是 Map
  2. 作用
  3. 实例属性
  4. 原型方法
  5. 类型转换

正文

什么是 Map

一种新的键值对实现，是 ES2015 新增的一种引用类型。

作用

对象的键名只能为string或symbol，而Map的键名可以为任意的数据类型。

示例：

1
2
3
4
5
6
7
8
const foo = new Map();
foo.set('a', 'a');
foo.set(2, 'b');
foo.set(true, 'c');
console.log(foo);

// 3
console.log(foo.size);

多次以相同键名存储值，后者会覆盖前者

示例：

1
2
3
4
5
6
7
const foo = new Map();
foo.set('a', 'a');
foo.set('a', 'b');
foo.set('a', 'c');

// "c"
console.log(foo.get('a'));

注意：Map的键名相等比较使用的是和Set相同的SameValueZero算法。

示例：

1
2
3
4
5
6
7
const foo = new Map();
foo.set(NaN, 'a');
foo.set(NaN, 'b');
foo.set(NaN, 'c');

// "c"
console.log(foo.get(NaN));

由于Map实现了Map.prototype[Symbol.iterator]，因此可以被for...of迭代。此外，迭代的顺序和插入的顺序是相同的。

示例：

1
2
3
4
5
6
7
const foo = new Map();
foo.set('a', 'a');
foo.set(2, 'b');
foo.set(true, 'c');
for (let item of foo) {
  console.log(item);
}

实例属性

size

大小

原型方法

set()

设置键值对，返回Map实例本身

get()

获取键值

has()

判断Map中是否存在此键名

delete()

从Map中删除元素

  • 如果删除成功，返回true
  • 如果删除失败，返回false

clear()

清空Map

forEach()

遍历Map中的值

示例：

1
2
3
4
5
6
7
const foo = new Map();
foo.set('a', 'a');
foo.set(2, 'b');
foo.set(true, 'c');
for (let item of foo) {
  console.log(item);
}

keys()

返回包含键名的迭代器对象

values()

返回包含键值的迭代器对象

entries()

返回包含有键名和键值组成的数组的迭代器对象

类型转换

其他类型转换成 Set

Array

二维数组

1
2
3
4
5
new Map([
  ['a', 'a'],
  [2, 'b'],
  [true, 'c'],
]);

Set 转换成其他类型

Array

1
Array.from(new Map().set('a', 'a').set(2, 'b').set(true, 'c'));

或

1
[...new Map().set('a', 'a').set(2, 'b').set(true, 'c')];

参考资料

本文作者: jsweibo

本文链接: https://jsweibo.github.io/2020/06/21/JavaScript%E4%B8%AD%E7%9A%84Map/

本文对你有帮助？请支持我

支付宝
微信