JavaScript 陣列去重

Advoster發表於2023-01-25

JavaScript 中有多種方法可以實現陣列去重,下面是幾種常用的方法:

1、使用 Set 去重:Set 資料結構中不能有重複元素,可以將陣列轉成 Set 型別,再轉回陣列。

let arr = [1,2,3,4,5,6,2,3,4];
let uniqueArr = [...new Set(arr)];
console.log(uniqueArr);  // [1, 2, 3, 4, 5, 6]

2、使用 Array.prototype.filter() 去重: filter() 函式可以過濾陣列中不符合條件的元素,可以用來去重。

let arr = [1,2,3,4,5,6,2,3,4];
let uniqueArr = arr.filter((item, index, array) => array.indexOf(item) === index);
console.log(uniqueArr);  // [1, 2, 3, 4, 5, 6]

3、使用 for 迴圈和 indexOf() 去重: 遍歷陣列,判斷當前遍歷到的元素在陣列中第一次出現的位置是否和當前遍歷到的位置相同,如果不同說明該元素之前出現過,則捨去。

let arr = [1,2,3,4,5,6,2,3,4];
let uniqueArr = [];
for(let i = 0; i < arr.length; i++) {
    if(uniqueArr.indexOf(arr[i]) === -1) {
        uniqueArr.push(arr[i]);
    }
}
console.log(uniqueArr);  // [1, 2, 3, 4, 5, 6]

4、使用 Object 鍵值對去重:遍歷陣列,將陣列元素當作物件的鍵,如果該鍵不存在,則將其新增到新陣列中。

let arr = [1,2,3,4,5,6,2,3,4];
let uniqueArr = [], obj = {};
for(let i = 0; i < arr.length; i++) {
    if(!obj[arr[i]]) {
        uniqueArr.push(arr[i]);
        obj[arr[i]] = true;
    }
}
console.log(uniqueArr);  // [1, 2, 3, 4, 5, 6]

5、使用 Array.prototype.reduce() 去重: reduce() 函式可以用來構建新陣列,只新增沒有出現過的元素。

let arr = [1,2,3,4,5,6,2,3,4];
let uniqueArr = arr.reduce((acc, cur) => acc.includes(cur) ? acc : [...acc, cur], []);
console.log(uniqueArr);  // [1, 2, 3, 4, 5, 6]

6、使用 Map 去重: Map 資料結構中不能有重複元素,可以將陣列轉成 Map型別,再轉回陣列。

let arr = [1,2,3,4,5,6,2,3,4];
let uniqueArr = Array.from(new Map(arr.map(item => [item, item])).values());
console.log(uniqueArr);  // [1, 2, 3, 4, 5, 6]

7、使用 Array.prototype.includes() 去重: 遍歷陣列,判斷當前遍歷到的元素是否存在於新陣列中,如果不存在則將其新增到新陣列中。

let arr = [1,2,3,4,5,6,2,3,4];
let uniqueArr = [];
for(let i = 0; i < arr.length; i++) {
    if(!uniqueArr.includes(arr[i])) {
        uniqueArr.push(arr[i]);
    }
}
console.log(uniqueArr);  // [1, 2, 3, 4, 5, 6]

8、使用 Array.prototype.sort() 去重: sort 方法可以將陣列元素排序,可以將相鄰的重複元素放在一起,然後遍歷陣列將不同的元素放入新陣列中。

let arr = [1,2,3,4,5,6,2,3,4];
let uniqueArr = arr.sort().filter(function (item, index, array) {
    return !index || item !== array[index - 1];
});
console.log(uniqueArr);  // [1, 2, 3, 4, 5, 6]

9、使用第三方庫 lodash 的 uniq() 去重。

10、使用第三方庫 Ramda 的 uniq() 去重。

相關文章