ES6如何將?Set?轉(zhuǎn)化為數(shù)組示例詳解
正文
Set 是 ES6 中新增的一種集合類型，類似于數(shù)組，但其成員的值是唯一的，即不會(huì)重復(fù)。關(guān)于Set，可以閱讀《JavaScript中的Set數(shù)據(jù)操作：交集、差集、交集、對(duì)稱差集》。Set 對(duì)象是一個(gè)構(gòu)造函數(shù)，可以使用 new 關(guān)鍵字來創(chuàng)建一個(gè) Set 實(shí)例。
例如：
const mySet = new Set();
Set 對(duì)象具有以下特征：
Set實(shí)例的成員唯一，不會(huì)重復(fù)。Set實(shí)例可以存儲(chǔ)任何類型的值，包括基本類型和對(duì)象。Set實(shí)例是可迭代的，可以使用for...of循環(huán)遍歷其中的值。Set實(shí)例的size屬性可以用來獲取它包含的成員數(shù)量。
Set 對(duì)象有以下常用方法：
add(value)：添加一個(gè)值到 Set 實(shí)例中。 delete(value)：從 Set 實(shí)例中刪除一個(gè)值。 has(value)：判斷 Set 實(shí)例中是否包含某個(gè)值，返回一個(gè)布爾值。 clear()：清空 Set 實(shí)例中的所有值。
可以使用以下代碼創(chuàng)建一個(gè)包含幾個(gè)元素的 Set 對(duì)象并使用其方法：
const mySet = new Set();
mySet.add(1);
mySet.add("two");
mySet.add({ name: "DevPoint" });
console.log(mySet.has("two")); // 輸出 true
mySet.delete(1);
console.log(mySet.size); // 輸出 2
mySet.clear();
console.log(mySet.size); // 輸出 0
在 ES6 中，可以使用 Array.from() 方法將 Set 轉(zhuǎn)換為數(shù)組。該方法接受一個(gè)可迭代對(duì)象，并返回一個(gè)新數(shù)組。
例如，假設(shè)有一個(gè) Set 對(duì)象 mySet，可以按以下方式將其轉(zhuǎn)換為數(shù)組：
const mySet = new Set([1, 2, 3]); const myArray = Array.from(mySet); console.log(myArray); // 輸出 [1, 2, 3]
除此之外，還可以使用擴(kuò)展運(yùn)算符 ... 來將 Set 轉(zhuǎn)換為數(shù)組。例如：
const mySet = new Set([1, 2, 3]); const myArray = [...mySet]; console.log(myArray); // 輸出 [1, 2, 3]
這種方法更簡(jiǎn)潔，但不支持 IE 瀏覽器。
除了使用 Array.from() 方法和擴(kuò)展運(yùn)算符 ...，還有就是通過遍歷 Set 并將每個(gè)元素添加到一個(gè)新數(shù)組中。
const mySet = new Set([1, 2, 3]);
const myArray = [];
for (let item of mySet) {
myArray.push(item);
}
console.log(myArray); // 輸出 [1, 2, 3]以上就是ES6如何將 Set 轉(zhuǎn)化為數(shù)組示例詳解的詳細(xì)內(nèi)容，更多關(guān)于ES6將Set轉(zhuǎn)化為數(shù)組的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章！
相關(guān)文章
JavaScript實(shí)現(xiàn)星座查詢功能 附詳細(xì)代碼
最近小編在做一個(gè)項(xiàng)目，其中涉及到一個(gè)模塊關(guān)于星座查詢功能，即在文本框中輸入一個(gè)生日值，點(diǎn)擊按鈕可以得到對(duì)應(yīng)的星座，怎么實(shí)現(xiàn)這個(gè)需求呢？下面小編通過示例代碼給大家介紹下，需要的朋友參考下吧2021-11-11
這篇文章主要介紹了微信小程序form表單組件示例代碼,文章給大家提到了一些相關(guān)屬性名和類型及說明，需要的朋友可以參考下2018-07-07
原生js實(shí)現(xiàn)fadein 和 fadeout淡入淡出效果
這篇文章主要介紹了通過原生js實(shí)現(xiàn)fadein 和 fadeout淡入淡出效果,需要的朋友可以參考下2014-06-06
微信小程序開發(fā)之實(shí)現(xiàn)食堂點(diǎn)餐系統(tǒng)
這篇文章主要為大家詳細(xì)介紹了如何通過微信小程序開發(fā)一個(gè)簡(jiǎn)單的食堂點(diǎn)餐系統(tǒng)，文中的示例代碼講解詳細(xì)，感興趣的小伙伴可以和小編一起學(xué)習(xí)一下2023-01-01
XMLHTTP 亂碼的解決方法（UTF8,GB2312 編碼 解碼）
XMLHTTP 亂碼的解決方法（UTF8,GB2312 編碼 解碼）（附帶解決DHTMLX不能用中文的問題）2011-01-01
JavaScript設(shè)計(jì)模式中的觀察者模式
這篇文章主要介紹了JavaScript設(shè)計(jì)模式中的觀察者模式，觀察者設(shè)計(jì)模式適用于監(jiān)聽一對(duì)多的操作，例如監(jiān)聽對(duì)象屬性的修改等等，觀察者模式能夠降低代碼耦合度，提升可擴(kuò)展性2022-06-06
js需要把時(shí)間戳轉(zhuǎn)為為普通格式，一般的情況下可能用不到的，下面與大家分享幾種不錯(cuò)的方法，感興趣的朋友不要錯(cuò)過2013-11-11
這篇文章主要介紹了微信小程序如何自定義table組件,文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-06-06
這篇文章主要介紹了關(guān)于小程序獲取用戶名和頭像的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),對(duì)大家學(xué)習(xí)或者用小程序具有一需要的參考借鑒價(jià)值,朋友可以參考下2023-07-07
這篇文章主要給大家介紹了關(guān)于ES6的異步終極解決方案，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用ES6具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧2019-07-07