1. 程式人生 > >js實現陣列去重-ES6實現

js實現陣列去重-ES6實現

方法一:

function unique(arr) {
    const res = new Map();
    return arr.filter((a) => !res.has(a) && res.set(a, 1))
}

就這麼短,就可以了,我們來解釋一下為什麼。

Map物件

Map是ES6 提供的新的資料結構。
Map 物件儲存鍵值對。任何值(物件或者原始值) 都可以作為一個鍵或一個值。

下表列出了 Map 物件的方法。

方法 描述
clear 刪除所有的鍵/值對,沒有返回值。
delete 刪除某個鍵,返回true。如果刪除失敗,返回false。
forEach 對每個元素執行指定操作。
get 返回Map物件key相對應的value值。
has 返回一個布林值,表示某個鍵是否在當前 Map 物件之中。
set 給Map物件設定key/value 鍵/值對。
Map物件還有一個size屬性,他返回Map物件的鍵/值對的數量。

陣列的 filter() 方法

filter() 方法建立一個新的陣列,新陣列中的元素 是 通過檢查 指定陣列 中 符合條件的所有元素。

語法:

array.filter(function(currentValue,index,arr), thisValue)  

引數說明:

箭頭函式

return arr.filter((a) => !res.has(a) && res.set(a, 1))
//上面的程式碼可以改成這樣
return arr.filter(function(a){
    return !res.has(a) && res.set(a, 1);
});

1、箭頭函式寫程式碼擁有更加簡潔的語法;
2、不會繫結this。

瞭解更多,點這裡

方法一 分析

function unique(arr) {
    //定義常量 res,值為一個Map物件例項
    const res = new Map();
    
    //返回arr陣列過濾後的結果,結果為一個數組
    //過濾條件是,如果res中沒有某個鍵,就設定這個鍵的值為1
    return arr.filter((a) => !res.has(a) && res.set(a, 1))
}

方法二:

function unique(arr) {
    return Array.from(new Set(arr))
}

這個方法的程式碼量更少,簡直不可思議。
陣列的 from方法

Array.from() 方法從一個類似陣列或可迭代的物件(包括 Array,Map,Set,String,TypedArray,arguments 物件等等) 中建立一個新的陣列例項

語法:

Array.from(arrayLike[, mapFn[, thisArg]])

引數 描述
arrayLike 必需,想要轉換成真實陣列的類陣列物件或可迭代的物件。
mapFn 可選,如果指定了該引數,則最後生成的陣列會經過該函式的加工處理後再返回。
thisArg 可選,執行 mapFn 函式時 this 的值。
示例程式碼:

const bar = ["a", "b", "c"];
Array.from(bar);
// ["a", "b", "c"]

Array.from('foo');
// ["f", "o", "o"]

Set物件

Set 物件允許你儲存任何型別的 唯一值 ,無論是原始值或者是物件引用。
Set物件是值的集合,你可以按照插入的順序迭代它的元素。
Set中的元素只會出現一次,即 Set 中的元素是唯一的。

語法:

new Set([iterable]);

引數:
iterable,如果傳遞一個可迭代物件(包括 Array,Map,Set,String,TypedArray,arguments 物件等等),它的所有元素將被新增到新的 Set中。如果不指定此引數或其值為null,則新的 Set為空。

下表列出了 Set 物件的方法。

方法 描述
add 新增某個值,返回Set物件本身。
clear 刪除所有的鍵/值對,沒有返回值。
delete 刪除某個鍵,返回true。如果刪除失敗,返回false。
forEach 對每個元素執行指定操作。
has 返回一個布林值,表示某個鍵是否在當前 Set 物件之中。
Set物件和Map物件一樣,都有一個size屬性,他返回Set物件的值的個數。

方法二 分析

function unique(arr) {
    //通過Set物件,對陣列去重,結果又返回一個Set物件
    //通過from方法,將Set物件轉為陣列
    return Array.from(new Set(arr))
}