JavaScript學習-ES6-Map與weakMap
語法 new Map([iterable]);
Iterable 可以是一個數組或者其他 iterable 物件,其元素或為鍵值對,或為兩個元素的陣列。 每個鍵值對都會新增到新的 Map。null 會被當做 undefined。
一個Map物件以插入順序迭代其元素 — 一個 for...of 迴圈為每次迭代返回一個[key,value]陣列。
Map 例項所有的 Map 物件例項都會繼承 Map.prototype。
屬性
Map.prototype.constructor 返回一個函式,它建立了例項的原型。預設是Map函式。
Map.prototype.size 返回Map物件的鍵/值對的數量。
Map.prototype.clear() 移除Map物件的所有鍵/值對 。
Map.prototype.delete(key) 移除任何與鍵相關聯的值,並且返回該值,該值在之前會被Map.prototype.has(key)返回為true。之後再呼叫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] 陣列
Objects 和 maps 的比較
Object 和 Map 類似的是,它們都允許你按鍵存取一個值、刪除鍵、檢測一個鍵是否綁定了值。因此(並且也沒有其他內建的替代方式了)過去我們一直都把物件當成 Map 使用。不過 Map 和 Object 有一些重要的區別,在下列情況裡 Map 會是更好的選擇:
一個物件的鍵只能是字串或者 Symbols,但一個 Map 的鍵可以是任意值,包括函式、物件、基本型別。
你可以通過 size 屬性直接獲取一個 Map 的鍵值對個數,而 Object 的鍵值對個數只能手動計算。
Map 是可迭代的,而 Object 的迭代需要先獲取它的鍵陣列然後再進行迭代。
Object 都有自己的原型,所以原型鏈上的鍵名有可能和物件上的鍵名產生衝突。雖然 ES5 開始可以用 map = Object.create(null) 來建立一個沒有原型的物件,但是這種用法不太常見。
Map 在涉及頻繁增刪鍵值對的場景下會有些效能優勢。
let map = new Map();
let keyObj = {};
let keyFnc = function () {};
let keyString = "keyStr";
let noNumber = Number("aaa");
//新增鍵值對
map.set(keyObj,"鍵·物件");
map.set(keyFnc,"鍵·function");
map.set(keyString,"鍵·字串");
map.set(noNumber,"鍵·NAN");
// console.log(map.size);
// console.log(map);
//獲取值
// console.log(map.get(keyObj));
// console.log(map.get({}));
// console.log(map.get(keyFnc));
// console.log(map.get(function(){}));
// console.log(map.get(keyString));
// console.log(map.get("keyStr"));
// console.log(map.get(noNumber));
// console.log(map.get(NaN));
////迭代1
// for(let [key,value] of map){
// console.log(key + ":" + value);
// }
////迭代2
// for (let key of map.keys()) {
// console.log(key);
// }
////迭代3
// for (let value of map.values()) {
// console.log(value);
// }
////迭代4
// for (let [key, value] of map.entries()) {
// console.log(key + " = " + value);
// }
////迭代4
// map.forEach(function (value ,key) {
// console.log(key + ":" + value);
// },map);
//這裡傳入的map是可選引數,指代this的值
// let aaa = {
// "a" : 1,
// "b" : 2
// };
// map.forEach(function (value ,key) {
// console.log(key + ":" + value);
// console.log(this.a);
// },aaa);
// 對映與陣列物件的關係
let kvArray = [["key1", "value1"], ["key2", "value2"]];
// 使用對映物件常規的建構函式將一個二維鍵值對陣列物件轉換成一個對映關係
let myMap = new Map(kvArray);
myMap.get("key1"); // 返回值為 "value1"
// 使用展開運算子將一個對映關係轉換成一個二維鍵值對陣列物件
console.log([...myMap]); // 將會向您顯示和kvArray相同的陣列
// 或者使用展開運算子作用在鍵或者值的迭代器上,進而得到只含有鍵或者值得陣列
console.log([...myMap.keys()]); // 輸出 ["key1", "key2"]
補充:
1、Map在forEach時,callback函式的引數依次為:(value,key,本身)
weakMap:
WeakMap 的 key 只能是 Object 型別。 原始資料型別 是不能作為 key 的(比如 Symbol)。也是弱引用,受垃圾回收機制影響;