欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

ES6基礎(chǔ)語法之Map和Set對象

 更新時間:2022年05月02日 09:46:38   作者:農(nóng)碼一生  
這篇文章介紹了ES6基礎(chǔ)語法之Map和Set對象,文中通過示例代碼介紹的非常詳細。對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下

一、Map對象

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

Map中的鍵值是有序的。

let myMap = new Map();
myMap.set("23","喬丹");
myMap.set("33","皮蓬");
let name = myMap.get("33");
console.log(name);  //皮蓬
let has = myMap.has("24"); //查找是否含有此鍵
console.log(has); //false

Map的迭代:

let myMap = new Map();
myMap.set("23","喬丹");
myMap.set("33","皮蓬");
myMap.set("99","羅德曼");
//循環(huán)鍵
for (let key of myMap.keys()) {
  console.log(key);
}		
//循環(huán)值
for (let value of myMap.values()) {
  console.log(value);
}			
//循環(huán)鍵和值
for (let [key, value] of myMap) {
  console.log(key + " = " + value);
}
//或
for (let [key, value] of myMap.entries()) {
  console.log(key + " = " + value);
}
			
//使用forEach循環(huán)
myMap.forEach(function(value,key){
	console.log(key + "=" + value);
},myMap);

Map 與 Array的轉(zhuǎn)換:

//二維數(shù)組轉(zhuǎn)換成map對象
let arr = [[23,"喬丹"],[33,"皮蓬"],[99,"羅德曼"]];
let myMap = new Map(arr);
for (let [key, value] of myMap) {
  console.log(key + " = " + value);
}
//map對象轉(zhuǎn)換成二維數(shù)組
let outArr = Array.from(myMap);
console.log(outArr);

Map的克?。?/p>

let myMap1 = new Map([[23,"喬丹"],[33,"皮蓬"],[99,"羅德曼"]]);
let myMap2 = new Map(myMap1);
for (let [key, value] of myMap2) {
   console.log(key + " = " + value);
}

Map的合并(合并兩個 Map 對象時,如果有重復(fù)的鍵值,則后面的會覆蓋前面的)

let myMap1 = new Map([[23,"喬丹"],[33,"皮蓬"],[99,"羅德曼"]]);
let myMap2 = new Map([[23,"詹姆斯"],[24,"科比"],[11,"姚明"]]);
let myMap = new Map([...myMap1,...myMap2]); //合并之后詹姆斯會替換喬丹
for (let [key, value] of myMap) {
	console.log(key + " = " + value);
}

二、Set對象

Set 對象允許你存儲任何類型的唯一值,無論是原始值或者是對象引用。

Set 對象存儲的值總是唯一的,所以需要判斷兩個值是否恒等。有幾個特殊值需要特殊對待:

(1) +0 與 -0 在存儲判斷唯一性的時候是恒等的,所以不重復(fù);

(2) undefined 與 undefined 是恒等的,所以不重復(fù);

(3) NaN 與 NaN 是不恒等的,但是在 Set 中只能存一個,不重復(fù)。

let mySet = new Set();
mySet.add(1);
mySet.add("hello");  //這里體現(xiàn)了類型的多樣性
mySet.add(2);
mySet.add(1); //這里添加不了,這里體現(xiàn)了值的唯一性
console.log(mySet); //{1,"hello",2}
console.log(mySet.has(3)); //false, 是否含有3

以下代碼體現(xiàn)了對象之間引用不同不恒等,即使值相同,Set 也能存儲

let mySet = new Set();
let o = {a: 1, b: 2}; 
mySet.add(o);
mySet.add({a: 1, b: 2});
console.log(mySet);

Set類型轉(zhuǎn)換:

//Array 轉(zhuǎn) Set
let arr = ["喬丹","皮蓬","羅德曼"];
let mySet = new Set(arr);
console.log(mySet);

//Set轉(zhuǎn)Array(使用...)
let mySet = new Set();
mySet.add("喬丹");
mySet.add("皮蓬");
mySet.add("羅德曼");
let arr = [...mySet];
console.log(arr);

//字符串轉(zhuǎn)Set(注:Set中toString方法是不能將Set轉(zhuǎn)換成String)
let mySet = new Set("hello");
console.log(mySet);  //h e l o (兩個l只出現(xiàn)一次)

Set對象的作用:

//數(shù)組去重復(fù)
let mySet = new Set([1,2,1,2,3,3,4,5,6,4,7]);
let arr = [...mySet];
console.log(arr); //1,2,3,4,5,6,7

//數(shù)組求并集
let a = new Set([1, 2, 3]);
let b = new Set([4, 3, 2]);
let union = new Set([...a, ...b]);
let arr = [...union];
console.log(arr); //1, 2, 3, 4

//數(shù)組求交集
let a = new Set([1, 2, 3]);
let b = new Set([4, 3, 2]);
let intersect = new Set([...a].filter(p=>b.has(p)));
let arr = [...intersect];
console.log(arr); //2, 3

到此這篇關(guān)于ES6基礎(chǔ)語法之Map和Set對象的文章就介紹到這了。希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。

相關(guān)文章

  • 在JavaScript中處理時間之getHours()方法的使用

    在JavaScript中處理時間之getHours()方法的使用

    這篇文章主要介紹了在JavaScript中處理時間之getHours()方法的使用,是JS入門學(xué)些中的基礎(chǔ)知識,需要的朋友可以參考下
    2015-06-06
  • ES6基礎(chǔ)語法之Map和Set對象

    ES6基礎(chǔ)語法之Map和Set對象

    這篇文章介紹了ES6基礎(chǔ)語法之Map和Set對象,文中通過示例代碼介紹的非常詳細。對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下
    2022-05-05
  • 關(guān)于js原型的面試題講解

    關(guān)于js原型的面試題講解

    下面小編就為大家?guī)硪黄P(guān)于js原型的面試題講解。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2016-09-09
  • THREE.JS入門教程(4)創(chuàng)建粒子系統(tǒng)

    THREE.JS入門教程(4)創(chuàng)建粒子系統(tǒng)

    Three.js是一個偉大的開源WebGL庫,WebGL允許JavaScript操作GPU,在瀏覽器端實現(xiàn)真正意義的3D本文將介紹創(chuàng)建一個粒子系統(tǒng)/風(fēng)格/引入物理等等,感興趣的朋友可以了解下哦,希望本文對你有所幫助
    2013-01-01
  • 告訴你什么是javascript的回調(diào)函數(shù)

    告訴你什么是javascript的回調(diào)函數(shù)

    在javascript中回調(diào)函數(shù)非常重要,它們幾乎無處不在。像其他更加傳統(tǒng)的編程語言都有回調(diào)函數(shù)概念,但是非常奇怪的是,完完整整談?wù)摶卣{(diào)函數(shù)的在線教程比較少,倒是有一堆關(guān)于call()和apply()函數(shù)的,或者有一些簡短的關(guān)于callback的使用示例。
    2014-09-09
  • javascript es6的常用語法你知道嗎

    javascript es6的常用語法你知道嗎

    這篇文章主要為大家介紹了javascriptes6的常用語法,具有一定的參考價值,感興趣的小伙伴們可以參考一下,希望能夠給你帶來幫助
    2022-01-01
  • javascript indexOf函數(shù)使用說明

    javascript indexOf函數(shù)使用說明

    JavaScript中indexOf函數(shù)方法是返回 String 對象內(nèi)第一次出現(xiàn)子字符串的字符位置。
    2008-07-07
  • javascript函數(shù)中的arguments參數(shù)

    javascript函數(shù)中的arguments參數(shù)

    arguments當(dāng)然只在function體內(nèi)才有意義, arguments.length 返回的是傳入function的實參個數(shù)
    2010-08-08
  • javascript中clone對象詳解

    javascript中clone對象詳解

    這篇文章主要介紹了javascript中clone對象的方法,需要的朋友可以參考下
    2014-12-12
  • 不得不看之JavaScript構(gòu)造函數(shù)及new運算符

    不得不看之JavaScript構(gòu)造函數(shù)及new運算符

    這篇文章主要介紹了JavaScript構(gòu)造函數(shù)及new運算符,通過認識new運算符,代碼解讀,重點解析,new存在的意義,總結(jié)等全面介紹了知識點,具體操作步驟大家可查看下文的詳細講解,感興趣的小伙伴們可以參考一下。
    2017-08-08

最新評論