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() 去重,
作者:yuzhihui出處:http://www.cnblogs.com/yuzhihui/ 宣告:歡迎任何形式的轉載,但請務必注明出處!!!
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/542394.html
標籤:JavaScript
下一篇:JavaScript 型別轉換
