首頁 > web前端 > js教程 > JavaScript中的Map、Set實例詳解

JavaScript中的Map、Set實例詳解

零下一度
發布: 2017-06-26 10:12:09
原創
1327 人瀏覽過

Map

 Map是一組鍵值對的結構,具有極快的查找速度。

 Map的定義。

//空map设值key-valuevar m = new Map();
m.set("XiaoMing",99);
m.set("XiaoHong",66);//构造参数传key-valuevar m = new Map([['XiaoMing', 99], ['XiaoHong', 66]]);
登入後複製

  Map中的方法

var m = new Map(); // 空Mapm.set('XiaoMing', 99); // 添加新的key-valuem.has('XiaoMing'); // 是否存在key 'XiaoMing': truem.get('XiaoMing'); // 99m.delete('XiaoMing'); // 删除key 'XiaoMing'm.get('XiaoMing'); // undefined
登入後複製

 對一個key重複設值,後面的值會將前面的值覆寫。

var m = new Map();
m.set('XiaoMing', 99);
m.set('XiaoMing', 98);
m.get('XiaoMing'); // 98
登入後複製

Set

 Set和Map類似,但set之儲存key,且key不重複。

 Set的創建。

var s1 = new Set(); // 空Sets1.add(1);
s1.add(2);
s1.add(3);var s2 = new Set([1, 2, 3]); // 含1, 2, 3
登入後複製

 插入重複的值,set會將重複的值進行過濾

#
 s =  Set([1, 2, 33>>s; s.delete(3);
>>s;
登入後複製

Map及Set的遍歷

 Array可以採用下標進行循環遍歷,Map和Set就無法使用下標。為了統一集合類型,ES6標準引入了iterable類型,Array、Map、Set都屬於iterable類型。

 具有iterable類型的集合可以透過新的for ... of迴圈來遍歷。

var a = ['A', 'B', 'C'];var s = new Set(['A', 'B', 'C']);var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]);for (var x of a) { // 遍历Array    alert(x);
}for (var x of s) { // 遍历Set    alert(x);
}for (var x of m) { // 遍历Mapalert(x[0] + '=' + x[1]);
}
登入後複製

更好的遍歷:forEach

 forEach是iterable內建的方法,它接收一個函數,每次迭代就會自動回調該函數。

var a = ['A', 'B', 'C'];
a.forEach(function (element, index, array) {// element: 指向当前元素的值// index: 指向当前索引// array: 指向Array对象本身    alert(element);
});
登入後複製

 SetArray類似,但Set沒有索引,因此回呼函數的前兩個參數都是元素本身:

var s = new Set(['A', 'B', 'C']);
s.forEach(function (element, sameElement, set) {
    alert(element);
});
登入後複製

 Map的回呼函數參數依序為valuekeymap 本身:

var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]);
m.forEach(function (value, key, map) {
    alert(value);
});
登入後複製

 

#

以上是JavaScript中的Map、Set實例詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板