es6中如何實(shí)現(xiàn)數(shù)組去重

這篇“es6中如何實(shí)現(xiàn)數(shù)組去重”文章的知識(shí)點(diǎn)大部分人都不太理解，所以小編給大家總結(jié)了以下內(nèi)容，內(nèi)容詳細(xì)，步驟清晰，具有一定的借鑒價(jià)值，希望大家閱讀完這篇文章能有所收獲，下面我們一起來(lái)看看這篇“es6中如何實(shí)現(xiàn)數(shù)組去重”文章吧。

3種實(shí)現(xiàn)方法：1、Set數(shù)據(jù)結(jié)構(gòu)和“Array.from()”去重，語(yǔ)法“Array.from(new Set(arr))”；2、Set數(shù)據(jù)結(jié)構(gòu)和擴(kuò)展運(yùn)算符“...”去重，語(yǔ)法“[...new Set(arr)]”；3、filter()和indexOf()過(guò)濾，語(yǔ)法“arr.filter((it,in)=>{return arr.indexOf(it,0)===in;});”。

本教程操作環(huán)境：windows7系統(tǒng)、ECMAScript 6版、Dell G3電腦。

ES6數(shù)組去重的5種方法

1、Set數(shù)據(jù)結(jié)構(gòu)和Array.from()去重

• Set是ES6新提供的數(shù)據(jù)結(jié)構(gòu)，類似于數(shù)組，但是本身沒(méi)有重復(fù)值。利用這一特性，我們可以將數(shù)組轉(zhuǎn)為Set類型進(jìn)行去重，然后使用Array.from方法將其再轉(zhuǎn)為數(shù)組。

• Array.from方法用于將兩類對(duì)象轉(zhuǎn)為真正的數(shù)組：類似數(shù)組的對(duì)象（array-like object）和可遍歷（iterable）的對(duì)象（包括 ES6 新增的數(shù)據(jù)結(jié)構(gòu) Set 和 Map）。

實(shí)現(xiàn)思想：

• 將數(shù)組轉(zhuǎn)為set集合去重后，使用Array.from方法將集合轉(zhuǎn)為數(shù)組

語(yǔ)法：

Array.from(new Set(arr))

示例：

let arr=[1,2,3,3,2,"1",0,undefined,undefined];
let newArr=Array.from(new Set(arr));
console.log(newArr);

2、Set數(shù)據(jù)結(jié)構(gòu)和擴(kuò)展運(yùn)算符“...”去重

• 擴(kuò)展運(yùn)算符…是ES6中引入的，將可迭代對(duì)象展開(kāi)到其單獨(dú)的元素中，所謂的可迭代對(duì)象就是任何能用for of循環(huán)進(jìn)行遍歷的對(duì)象，例如：數(shù)組、字符串、Map 、Set 、DOM節(jié)點(diǎn)等。

實(shí)現(xiàn)思想：

• 將數(shù)組轉(zhuǎn)為set集合去重后，使用擴(kuò)展運(yùn)算符…將集合展開(kāi)到數(shù)組中，將集合轉(zhuǎn)為數(shù)組

語(yǔ)法：

[...new Set(arr)]

示例：

let arr=[1,2,3,3,2,"1",0,1,2];
let newArr=[...new Set(arr)];
console.log(newArr);

3、利用數(shù)組的 filter+indexOf方法去重

filter() 方法創(chuàng)建一個(gè)新的數(shù)組，新數(shù)組中的元素是通過(guò)檢查指定數(shù)組中符合條件的所有元素。

indexOf方法返回指定元素在數(shù)組中的第一個(gè)索引(index)， 如果沒(méi)有則返回 -1

示例：

var arr=[1, 2, 3, 2, 3];
var newArr = arr.filter((item,index)=> {
  return arr.indexOf(item,0) === index;
});
console.log(newArr);

所以這里的 arr 數(shù)組中的每個(gè)元素通過(guò) indexOf() 方法返回的索引值分別是 0 1 2 1 2

arr.forEach(item => console.log(arr.indexOf(item))); // 0 1 2 1 2

可以通過(guò) indexOf 來(lái)實(shí)現(xiàn)去重，比如 arr 中的第四個(gè)元素 2 通過(guò) indexOf 返回的是索引是 1， 但是它當(dāng)前的 index 下標(biāo)是 3，不相等，說(shuō)明當(dāng)前的這個(gè) 2 元素在之前出現(xiàn)過(guò), 所以應(yīng)該把它過(guò)濾掉。

以上就是關(guān)于“es6中如何實(shí)現(xiàn)數(shù)組去重”這篇文章的內(nèi)容，相信大家都有了一定的了解，希望小編分享的內(nèi)容對(duì)大家有幫助，若想了解更多相關(guān)的知識(shí)內(nèi)容，請(qǐng)關(guān)注億速云行業(yè)資訊頻道。