【JS】Built-in objects -＞ Map

Built-in objects -> Map

Map 对象

Map 对象保存键值对。
任何值(对象或者原始值) 都可以作为一个键或一个值。

Maps 和 Objects 的区别

• 一个 Object 的键只能是字符串或者 Symbols，但一个 Map 的键可以是任意值
• Map 中的键值是有序的（FIFO 原则/First Input First Output），而添加到对象中的键则不是
• Map 的键值对个数可以从 size 属性获取，而 Object 的键值对个数只能手动计算
• Object 都有自己的原型，原型链上的键名有可能和你自己在对象上的设置的键名产生冲突

Map 中的 key

• key 是字符串

// 对象
var myObj = new Object();
console.log(myObj); //{}

myObj["a string"] = "和键'a string'关联的值";
console.log(myObj);
/**
 * {a string: "和键'a string'关联的值"}
 * a string: "和键'a string'关联的值"
 * __proto__: Object
 */

// Map
var myMap = new Map();
console.log(myMap); //Map(0) {}

var keyString = "a string";

myMap.set(keyString, "和键'a string'关联的值"); //set

myMap.get(keyString); //get
myMap.get("和键'a string'关联的值");

console.log(myMap);
/**
 * Map(1) {"a string" => "和键'a string'关联的值"}
 * [[Entries]]
 * 0: {"a string" => "和键'a string'关联的值"}
 * size: 1
 * __proto__: Map
 */

• key 是对象

var myMap = new Map();
var keyObj = {},

myMap.set(keyObj, "和键 keyObj 关联的值");

myMap.get(keyObj); // "和键 keyObj 关联的值"
myMap.get({}); // undefined, 因为 keyObj !== {}（对象的值是地址）

• key 是函数

var myMap = new Map();
var keyFunc = function () {
  console.log("keyFunc");
}, // 函数

myMap.set(keyFunc, "和键 keyFunc 关联的值");

myMap.get(keyFunc); // "和键 keyFunc 关联的值"
myMap.get(function() {}) // undefined, 因为 keyFunc !== function () {}

• key 是 NaN

var myMap = new Map();
myMap.set(NaN, "not a number");

myMap.get(NaN); // "not a number"

var otherNaN = Number("foo");
myMap.get(otherNaN); // "not a number"

键的相等:键的比较是基于 sameValueZero 算法：

• NaN 是与 NaN 相等的（虽然 NaN !== NaN），剩下所有其它的值是根据 === 运算符的结果判断是否相等
  
  
• 在目前的 ECMAScript 规范中，-0 和+0 被认为是相等的，尽管这在早期的草案中并不是这样。

构造函数

Map()-
创建 Map 对象

属性

Map.length-
属性 length 的值为 0,
想要计算一个 Map 中的条目数量， 使用 Map.prototype.size

方法(Map.prototype.xxx)

• clear()方法会移除Map对象中的所有元素。

const map1 = new Map();

map1.set("bar", "baz");
map1.set(1, "foo");

console.log(map1.size);
// expected output: 2

map1.clear();

console.log(map1.size);
// expected output: 0

• delete(key) 方法用于移除 Map 对象中指定的元素。

  返回值是一个布尔值

• 方法has(key) 返回一个bool值，用来表明map 中是否存在指定元素.

const map1 = new Map();
map1.set("bar", "foo");

console.log(map1.has("bar"));
// expected result: true

console.log(map1.delete("bar"));
// expected result: true
// (true indicates successful removal)

console.log(map1.delete("test"));
// expected result: false

console.log(map1.has("bar"));
// expected result: false

• entries() 方法返回一个新的包含 [key, value] 对的 Iterator 对象，返回的迭代器的迭代顺序与 Map 对象的插入顺序相同。

  返回值是迭代器对象(MapIterator);

const map1 = new Map();

map1.set("0", "foo");
map1.set(1, "bar");

const iterator1 = map1.entries();

console.log(iterator1.next().value);
// expected output: ["0", "foo"]

console.log(iterator1.next().value);
// expected output: [1, "bar"]

console.log(iterator1.next().value);
// expected output: undefined

• set(key,value) 方法为 Map 对象添加或更新一个指定了键（key）和值（value）的（新）键值对。
• get(key) 方法返回某个 Map 对象中的一个指定元素。

const map1 = new Map();
map1.set("bar", "foo");

console.log(map1.get("bar"));
// expected output: "foo"

console.log(map1.get("baz"));
// expected output: undefined

• forEach(callback(value,index,map)[, thisArg])[Map 的迭代]

• values() 方法返回一个新的 Iterator 对象。它包含按顺序插入 Map 对象中每个元素的 value 值。

var myMap = new Map();
myMap.set("0", "foo");
myMap.set(1, "bar");
myMap.set({}, "baz");

var mapIter = myMap.values();

console.log(mapIter.next().value); // "foo"
console.log(mapIter.next().value); // "bar"
console.log(mapIter.next().value); // "baz"

Map 的迭代

• for …of
• forEach

var myMap = new Map();
myMap.set(0, "zero");
myMap.set(1, "one");

for (var item of myMap) {
  console.log(item);
}
// [0, "zero"]
// [1, "one"]

// 将会显示两个 log。 一个是 "0 = zero" 另一个是 "1 = one"
//解构
for (var [key, value] of myMap) {
  console.log(key + " = " + value);
}

/* 这个 entries 方法返回一个新的 Iterator 对象，它按插入顺序包含了 Map 对象中每个元素的 [key, value] 数组。 */
for (var [key, value] of myMap.entries()) {
  console.log(key + " = " + value);
}

// 将会显示两个log。 一个是 "0" 另一个是 "1"
for (var key of myMap.keys()) {
  console.log(key);
}
/* 这个 keys 方法返回一个新的 Iterator 对象， 它按插入顺序包含了 Map 对象中每个元素的键。 */

// 将会显示两个log。 一个是 "zero" 另一个是 "one"
for (var value of myMap.values()) {
  console.log(value);
}
/* 这个 values 方法返回一个新的 Iterator 对象，它按插入顺序包含了 Map 对象中每个元素的值。 */

Map 的合并

var first = new Map([
  [1, "one"],
  [2, "two"],
  [3, "three"],
]);
var second = new Map([
  [1, "uno"],
  [2, "dos"],
]);

// 合并两个 Map 对象时，如果有重复的键值，则后面的会覆盖前面的，对应值即 uno，dos， three
var merged = new Map([...first, ...second]);