博主网站:www.dzyong.top
微信公众号:《前端筱园》
Map对象保存键值对,并且能够记住键的原始插入顺序,最为主要的一点是可以以任意值作为键。
语法
new Map([iterable])
iterable:可以是一个数组或者其他iterable对象,其元素为键值对(如:[[1: 'a'],[2: 'b']])。每个键值对都会被添加到Map中。当为null时会被当做undefined。
let map = new Map([[ 1, 'one' ],[ 2, 'two' ]])
//map {1 => "one", 2 => "two"}
键是否相等
键的比较是基于 sameValueZero算法
NaN是与NaN相等的(虽然NaN !== NaN),其他的值根据 === 运算符的结果进行判断是否相等
在目前的ECMAScript规范中,-0与+0被认为是相等的。
Objects 和 maps 的比较
相同点:都允许按键存取一个值、删除键、检测一个键是否绑定了值。
区别:
-
Object的键只能是字符串或者Symbols,但是Map可以是任意值,包括函数、对象、基本类型。
-
Map中的键值是有序的,他会按照我们插入的顺序返回,而Object中是无序的。
-
可通过Map.size属性返回键值对的个数,而Object的个数只能手动计算。
-
Map可直接进行迭代,而Object的迭代需要先获取它的键值组。
-
Object有自己的原型,自己设置的键名可能会与原型链上的键名产生冲突。ES5开始可以使用map = Object.create(null)来创建一个没有原型的对象。
-
Map在涉及频繁增删键值对的场景下性能更佳。
属性
Map.length
值为0,可通过Map.size()计算一个Map中的键值对数量
Map.prototype
表示Map构造器的原型。允许添加属性从而应用于所有的Map对象。
Map实例
所有的Map对象都会继承Map.prototype。
属性
Map.prototype.size
返回Map对象的键/值对的数量。
Map.prototype.constructor
回一个函数,它创建了实例的原型。默认是Map
函数。
方法
Map.prototype.clear()
移除Map对象的所有键/值对 。
Map.prototype.delete(key)
如果 Map
对象中存在该元素,则移除它并返回 true
;否则如果该元素不存在则返回 false
。随后调用 Map.prototype.has(key)
将返回 false
。
Map.prototype.entries()
返回一个新的 Iterator
对象,它按插入顺序包含了Map对象中每个元素的 [key, value]
数组
。
Map.prototype.forEach(callbackFn[, thisArg])
按插入顺序,为 Map
对象里的每一键值对调用一次callbackFn函数。如果为forEach提供了thisArg,它将在每次回调中作为this值。
Map.prototype.get(key)
返回键对应的值,如果不存在,则返回undefined。
Map.prototype.has(key)
返回一个布尔值,表示Map实例是否包含键对应的值。
Map.prototype.keys()
返回一个新的 Iterator
对象, 它按插入顺序包含了Map对象中每个元素的键 。
Map.prototype.set(key, value)
设置Map对象中键的值。返回该Map对象。
Map.prototype.values()
返回一个新的Iterator
对象,它按插入顺序包含了Map对象中每个元素的值 。
Map.prototype[@@iterator]()
返回一个新的Iterator
对象,它按插入顺序包含了Map对象中每个元素的 [key, value]
数组
。
示例
使用Map 对象
let myMap = new Map();
let keyObj = {};
let keyFunc = function() {};
let keyString = 'a string';
// 添加键
myMap.set(keyString, "和键'a string'关联的值");
myMap.set(keyObj, "和键keyObj关联的值");
myMap.set(keyFunc, "和键keyFunc关联的值");
myMap.size; // 3
// 读取值
myMap.get(keyString); // "和键'a string'关联的值"
myMap.get(keyObj); // "和键keyObj关联的值"
myMap.get(keyFunc); // "和键keyFunc关联的值"
myMap.get('a string'); // "和键'a string'关联的值"
// 因为keyString === 'a string'
myMap.get({}); // undefined, 因为keyObj !== {}
myMap.get(function() {}); // undefined, 因为keyFunc !== function () {}
let myMap = new Map();
myMap.set(NaN, "not a number");
myMap.get(NaN); // "not a number"
拓展
复制或合并Maps
这是一个浅复制过程,数据本身并没有被克隆。
let original = new Map([
[1, 'one']
]);
let clone = new Map(original);
console.log(clone.get(1)); // one
console.log(original === clone); // false.
合并两个Map对象时,如果有重复的键值,则后面的会覆盖前面的。
拓展运算符的本质是将Map转为数组。
let first = new Map([
[1, 'one'],
[2, 'two'],
[3, 'three'],
]);
let second = new Map([
[1, 'uno'],
[2, 'dos']
]);
let merged = new Map([...first, ...second]);
console.log(merged.get(1)); // uno
console.log(merged.get(2)); // dos
console.log(merged.get(3)); // three
Map对象同数组进行合并时,如果有重复的键值,则后面的会覆盖前面的。
let first = new Map([
[1, 'one'],
[2, 'two'],
[3, 'three'],
]);
let second = new Map([
[1, 'uno'],
[2, 'dos']
]);
let merged = new Map([...first, ...second, [1, 'eins']]);
console.log(merged.get(1)); // eins
console.log(merged.get(2)); // dos
console.log(merged.get(3)); // three