前言

在ES6中引入JavaScript的新特性中，我們看到了Set和Map的介紹。與常規對象和Array不同的是，它們是“鍵控集合（keyed collections）”。這就是說它們的行為有稍許不同，并且在特定的上下文中使用，它們可以提供相當大的性能優勢。

在這篇文章中，我將剖析Map，它究竟有何不同，哪里可以派上用場，相比于常規對象有什么性能優勢。

Map與常規對象有什么不同

Map和常規對象主要有2個不同之處。

1.無限制的鍵（Key）

常規JavaScript對象的鍵必須是String或Symbol，下面的對象說明的這一點：

const symbol = Symbol();const string2 = 'string2';const regularObject = { string1: 'value1', [string2]: 'value2', [symbol]: 'value3'};

相比之下，Map允許你使用函數、對象和其它簡單的類型（包括NaN）作為鍵，如下代碼：

const func = () => null;const object = {};const array = [];const bool = false;const map = new Map();map.set(func, 'value1');map.set(object, 'value2');map.set(array, 'value3');map.set(bool, 'value4');map.set(NaN, 'value5');

在鏈接不同數據類型時，這個特性提供了極大的靈活性。

2.直接遍歷

在常規對象中，為了遍歷keys、values和entries，你必須將它們轉換為數組，如使用Object.keys()、Object.values()和Object.entries()，或者使用for ... in循環，因為常規對象不能直接遍歷，另外for ... in循環還有一些限制：它僅僅遍歷可枚舉屬性、非Symbol屬性，并且遍歷的順序是任意的。
而Map可以直接遍歷，并且由于它是鍵控集合，遍歷的順序和插入鍵值的順序是一致的。你可以使用for ... of循環或forEach方法來遍歷Map的entries，如下代碼：

for (let [key, value] of map) { console.log(key); console.log(value);};map.forEach((key, value) => { console.log(key); console.log(value);});

還有一個好處就是，你可以調用map.size屬性來獲取鍵值數量，而對于常規對象，為了做到這樣你必須先轉換為數組，然后獲取數組長度，如：Object.keys({}).length。

Map和Set有何不同

Map的行為和Set非常相似，并且它們都包含一些相同的方法，包括：has、get、set、delete。它們兩者都是鍵控集合，就是說你可以使用像forEach的方法來遍歷元素，順序是按照插入鍵值排列的。
最大的不同是Map通過鍵值（key/value）成對出現，就像你可以把一個數組轉換為Set，你也可以把二維數組轉換為Map：

const set = new Set([1, 2, 3, 4]);const map = new Map([['one', 1], ['two', 2], ['three', 3], ['four', 4]]);

類型轉換

要將Map切換回數組，你可以使用ES6的結構語法：