JavaScript中陣列去重的幾種方法
正常情況下，資料去重的作業一般都是由后端同事來完成的，但是前端也要掌握好處理資料的能力，萬一去重的作業交給我們大前端處理，我們也不能慫呀，現在我總結了一些去重的方法，希望對大家有點幫助，
方法一：new Set()實作陣列去重
ES6 提供了新的資料結構 Set，它類似于陣列，但是成員的值都是唯一的，沒有重復的值， Set 本身是一個建構式，用來生成 Set 資料結構，Set函式可以接受一個陣列，用于初始化，根據 Set的資料特性，我們可以實作陣列去重，
let list = [1, 1, 'a', 'a', true, true, false, false, null, '', null, '', undefined, undefined];
let list1 = Array.from(new Set(list)); // [ 1, "a", true, false, null, "", undefined ]
let list2 = [...new Set(list)]; // [ 1, "a", true, false, null, "", undefined ]
方法二：some()+回圈去重
some() 方法用于檢測陣列中的元素是否滿足指定條件（函式提供） ， 如果有一個元素滿足條件，則運算式回傳true , 剩余的元素不會再執行檢測， 如果沒有滿足條件的元素，則回傳false， 我們可以定義一個新陣列來承接沒有重復的資料，遍歷原始陣列的時候，用新陣列來判斷資料是否已經出現過，
function distinct(list) {
let result = [list[0]];// 用于承接沒有重復的資料，初始時將原始陣列的第一個值賦給它，
for (let i = 1; i < list.length; i++) {
// 判斷結果陣列中是否存在一樣的值，若果沒有的話則將資料存入結果陣列中，
if (!(result.some(val => list[i] === val))) {
result.push(list[i]);
}
}
return result;
}
let arr = [1, 1, 'a', 'a', true, true, false, false, null, '', null, '', undefined, undefined];
distinct(arr); // [ 1, "a", true, false, null, "", undefined ]
方法三：雙重for回圈去重
雙重for回圈，第一層回圈確保陣列中的每一項都能被比較，第二層回圈確保被比較項后的每一項都能跟被比較項比較，
function distinct2(list) {
for (let i = 0; i < list.length; i++) {
for (let j = i + 1; j < list.length; j++) {
// 后面資料的若跟前一項資料相同，則重復，需要去除，
if (list[i] === list[j]) {
list.splice(j, 1); // 去除后面的相同項
j--;
}
}
}
return list;
}
let arr = [1, 1, 'a', 'a', true, true, false, false, null, '', null, '', undefined, undefined];
distinct2(arr); // [ 1, "a", true, false, null, "", undefined ]
方法四：hasOwnProperty()方法去重
hasOwnProperty() 方法用來檢測一個屬性是否是物件的自有屬性，而不是從原型鏈繼承的，如果該屬性是自有屬性，那么回傳 true，否則回傳 false，
function unique(arr) {
var obj = {}; // 用來記錄陣列中的資料
return arr.filter(function(item, index, arr){
// 如果記錄物件中存在某個資料，則回傳false過濾掉；否則obj進行記錄并篩選出來
return obj.hasOwnProperty(typeof item + item) ? false : (obj[typeof item + item] = true)
})
}
let arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
unique(arr) // [ 1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, 'a', {}]
方法五：利用filter()+indexOf()方法去重
indexOf() 方法可回傳某個指定的字串值在字串中首次出現的位置，
function unique(arr) {
return arr.filter(function(item, index, arr) {
// 從陣列0位開始查，如果當前元素在原始陣列中的第一個索引==當前索引值，說明它是第一次出現，
return arr.indexOf(item, 0) === index;
});
}
let list = [1, 1, 'a', 'a', true, true, false, false, null, '', null, '', undefined, undefined];
unique(list); // [ 1, "a", true, false, null, "", undefined ]
此外，陣列去重還可以利用filter()、includes()等方法實作，但是思路都跟上面幾種方法類似，這里就不一一列舉了，
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/47805.html
標籤：JavaScript
上一篇：用js制作簡易計算器
下一篇：講講 Promise