Map?對象保存鍵值對。任何值(對象或者原始值) 都可以作為一個鍵或一個值。

語法

new Map([iterable])

參數(shù)

iterable

Iterable 可以是一個數(shù)組或者其他?iterable 對象，其元素或?yàn)殒I值對，或?yàn)閮蓚€元素的數(shù)組。?每個鍵值對都會添加到新的 Map。null 會被當(dāng)做?undefined。

描述

一個Map對象以插入順序迭代其元素?—?一個 ?for...of?循環(huán)為每次迭代返回一個[key，value]數(shù)組。

?

鍵的相等(Key equality)

鍵的比較是基于?"same-value" 算法：NaN 是與?NaN 相同的（雖然?NaN !== NaN），剩下所有其它的值是根據(jù) === 運(yùn)算符的結(jié)果判斷是否相等。在?ECMAScript 6 草稿的早期版本中視?-0?和?+0?為不相同的?(雖然?-0 === +0)，在近期版本里這個問題已經(jīng)被更正，且在?Gecko 29 (Firefox 29 / Thunderbird 29 / SeaMonkey 2.26) (bug?952870) 和近期的 nightly Chrome?版本這個已經(jīng)更改了。

Objects 和 maps 的比較

Object?和?Map類似的一點(diǎn)是,它們都允許你按鍵存取一個值,都可以刪除鍵,還可以檢測一個鍵是否綁定了值.因此,一直以來,我們都把對象當(dāng)成Map來使用,不過,現(xiàn)在有了Map,下面的區(qū)別解釋了為什么使用Map更好點(diǎn).

• 一個對象通常都有自己的原型,所以一個對象總有一個"prototype"鍵。不過，從 ES5 開始可以使用?map = Object.create(null)來創(chuàng)建一個沒有原型的對象。
• 一個對象的鍵只能是字符串或者?Symbols，但一個?Map 的鍵可以是任意值。
• 你可以通過size屬性很容易地得到一個Map的鍵值對個數(shù)，而對象的鍵值對個數(shù)只能手動確認(rèn)。

但是這并不意味著你可以隨意使用?Map，對象仍舊是最常用的。Map?實(shí)例只適合用于集合(collections)，你應(yīng)當(dāng)考慮修改你原來的代碼——先前使用對象來對付集合的地方。對象應(yīng)該用其字段和方法來作為記錄的。
如果你不確定要使用哪個，請思考下面的問題：

• 在運(yùn)行之前 key 是否是未知的，是否需要動態(tài)地查詢 key?呢？
• 是否所有的值都是統(tǒng)一類型，這些值可以互換么？
• 是否需要不是字符串類型的 key ？
• 鍵值對經(jīng)常增加或者刪除么？
• 是否有任意個且非常容易改變的鍵值對?
• 這個集合可以遍歷么(Is the collection iterated)?

假如以上全是“是”的話，那么你需要用?Map?來保存這個集。?相反，你有固定數(shù)目的鍵值對，獨(dú)立操作它們，區(qū)分它們的用法，那么你需要的是對象。

屬性

Map.length

屬性 length 的值為 0 。

get Map[@@species]

本構(gòu)造函數(shù)用于創(chuàng)建派生對象。

Map.prototype

表示?Map?構(gòu)造器的原型。?允許添加屬性從而應(yīng)用于所有的?Map?對象。

Map?實(shí)例

所有的?Map?對象實(shí)例都會繼承 Map.prototype。

屬性

?

Map.prototype.constructor

返回一個函數(shù)，它創(chuàng)建了實(shí)例的原型。默認(rèn)是Map函數(shù)。

Map.prototype.size

返回Map對象的鍵/值對的數(shù)量。

?

方法

?

Map.prototype.clear()

移除Map對象的所有鍵/值對 。

Map.prototype.delete(key)

移除任何與鍵相關(guān)聯(lián)的值，并且返回該值，該值在之前會被Map.prototype.has(key)返回為true。之后再調(diào)用Map.prototype.has(key)會返回false。

Map.prototype.entries()

返回一個新的 Iterator 對象，它按插入順序包含了Map對象中每個元素的 [key, value] 數(shù)組。

Map.prototype.forEach(callbackFn[, thisArg])

按插入順序，為 Map對象里的每一鍵值對調(diào)用一次callbackFn函數(shù)。如果為forEach提供了thisArg，它將在每次回調(diào)中作為this值。

Map.prototype.get(key)

返回鍵對應(yīng)的值，如果不存在，則返回undefined。

Map.prototype.has(key)

返回一個布爾值，表示Map實(shí)例是否包含鍵對應(yīng)的值。

Map.prototype.keys()

返回一個新的 Iterator對象， 它按插入順序包含了Map對象中每個元素的鍵 。

Map.prototype.set(key, value)

設(shè)置Map對象中鍵的值。返回該Map對象。

Map.prototype.values()

返回一個新的Iterator對象，它按插入順序包含了Map對象中每個元素的值 。

Map.prototype[@@iterator]()

返回一個新的Iterator對象，它按插入順序包含了Map對象中每個元素的 [key, value] 數(shù)組。

?

示例

使用映射對象

var myMap = new Map(); var keyObj = {}, keyFunc = function () {}, keyString = "a string"; // 添加鍵 myMap.set(keyString, "和鍵'a string'關(guān)聯(lián)的值"); myMap.set(keyObj, "和鍵keyObj關(guān)聯(lián)的值"); myMap.set(keyFunc, "和鍵keyFunc關(guān)聯(lián)的值"); myMap.size; // 3 // 讀取值 myMap.get(keyString); // "和鍵'a string'關(guān)聯(lián)的值" myMap.get(keyObj); // "和鍵keyObj關(guān)聯(lián)的值" myMap.get(keyFunc); // "和鍵keyFunc關(guān)聯(lián)的值" myMap.get("a string"); // "和鍵'a string'關(guān)聯(lián)的值" // 因?yàn)閗eyString === 'a string' myMap.get({}); // undefined, 因?yàn)閗eyObj !== {} myMap.get(function() {}) // undefined, 因?yàn)閗eyFunc !== function () {}

將NaN作為映射的鍵

NaN 也可以作為Map對象的鍵. 雖然 NaN 和任何值甚至和自己都不相等(NaN !== NaN 返回true), 但下面的例子表明, 兩個NaN作為Map的鍵來說是沒有區(qū)別的:

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"

使用for..of方法迭代映射

映射也可以使用for..of循環(huán)來實(shí)現(xiàn)迭代：

var myMap = new Map(); myMap.set(0, "zero"); myMap.set(1, "one"); for (var [key, value] of myMap) { console.log(key + " = " + value); } // 將會顯示兩個log。一個是"0 = zero"另一個是"1 = one" for (var key of myMap.keys()) { console.log(key); } // 將會顯示兩個log。 一個是 "0" 另一個是 "1" for (var value of myMap.values()) { console.log(value); } // 將會顯示兩個log。 一個是 "zero" 另一個是 "one" for (var [key, value] of myMap.entries()) { console.log(key + " = " + value); } // 將會顯示兩個log。 一個是 "0 = zero" 另一個是 "1 = one"

使用forEach()方法迭代映射

映射也可以通過forEach()方法迭代：

myMap.forEach(function(value, key) { console.log(key + " = " + value); }, myMap) // 將會顯示兩個logs。 一個是 "0 = zero" 另一個是 "1 = one"

映射與數(shù)組對象的關(guān)系

var kvArray = [["key1", "value1"], ["key2", "value2"]];// 使用映射對象常規(guī)的構(gòu)造函數(shù)將一個二維鍵值對數(shù)組對象轉(zhuǎn)換成一個映射關(guān)系 var myMap = new Map(kvArray);myMap.get("key1"); // 返回值為 "value1"// 使用展開運(yùn)算符將一個映射關(guān)系轉(zhuǎn)換成一個二維鍵值對數(shù)組對象 console.log(uneval([...myMap])); // 將會向您顯示和kvArray相同的數(shù)組// 或者使用展開運(yùn)算符作用在鍵或者值的迭代器上，進(jìn)而得到只含有鍵或者值得數(shù)組 console.log(uneval([...myMap.keys()])); // 輸出 ["key1", "key2"]

規(guī)范

SpecificationStatusComment

ECMAScript 2015 (6th Edition, ECMA-262) Map	Standard	Initial definition.
ECMAScript Latest Draft (ECMA-262) Map	Living Standard	?

瀏覽器兼容情況

?

• Desktop
• Mobile

FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari

Basic support	38 [1]	12	13 (13)	11	25	7.1
Constructor argument: new Map(iterable)	38	12	13 (13)	未實(shí)現(xiàn)	25	9
iterable	38	12	17 (17)	未實(shí)現(xiàn)	25	7.1
Map.clear()	31 38	12	19 (19)	11	25	7.1
Map.keys(), Map.values(), Map.entries()	37 38	12	20 (20)	未實(shí)現(xiàn)	25	7.1
Map.forEach()	36 38	12	25 (25)	11	25	7.1
Key equality for -0 and 0	34 38	12	29 (29)	未實(shí)現(xiàn)	25	9
Constructor argument: new Map(null)	(Yes)	12	37 (37)	11	(Yes)	9
Monkey-patched set() in Constructor	(Yes)	12	37 (37)	未實(shí)現(xiàn)	(Yes)	9
Map[@@species]	51	13	41 (41)	未實(shí)現(xiàn)	38	10
Map() without new throws	(Yes)	12	42 (42)	11	(Yes)	9

?

[1] Starting with Chrome 31，the feature was available behind a preference. In chrome://flags, activate the entry “Enable Experimental JavaScript”.

轉(zhuǎn)載于:https://www.cnblogs.com/h2zZhou/p/7477544.html

總結(jié)

以上是生活随笔為你收集整理的Map与object的区别的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。