在 JavaScript 中從陣列中刪除重複的內容
-
使用
Set刪除帶有 ECMAScript 6spread語法的 JavaScript 中的重複項 -
使用
Array.filter()從 JavaScript 陣列中刪除重複的內容 -
在 JavaScript 中使用
hashtable從一個原始陣列中刪除重複的元素 -
使用
underscore和LoDash庫中的_.uniq()函式從 JavaScript 中刪除陣列中的重複元素
本教程將解釋我們如何在 JavaScript 中使用不同的方法從陣列中刪除重複的陣列。其中一種方法是將目標陣列傳遞給 Set 類的建構函式，以返回一個等價的非重複陣列。另一種方法是使用 JavaScript Array 的 filter() 方法，並在其回撥函式中實現測試條件。
使用 Set 刪除帶有 ECMAScript 6 spread 語法的 JavaScript 中的重複項
在數學中，集合包含一組唯一的、非重複的元素。在 JavaScript 中，Set 類可以從一個陣列中得到所有這些非重複的元素。
在 ECMAScript 6 中，我們可以通過使用 Set 類來獲得一個新的非重複元素陣列，並將其傳送給 Set() 建構函式，從而使用傳播語法的力量。
var arr = [1, 2, 3, 4, 1, 2, 3, 1, 2, 3]
var uniqueArr = [...new Set(arr)]
console.log(uniqueArr)
輸出：
[1, 2, 3, 4]
使用 Array.filter() 從 JavaScript 陣列中刪除重複的內容
JavaScript 陣列引入了一個名為 filter() 的高階函式，它對每個陣列元素進行迴圈，對其應用一個測試條件，只有在滿足條件時才返回該元素。這個測試條件將在回撥函式裡面實現，作為引數傳遞給 filter() 方法。
我們可以通過設定測試條件來檢查當前元素在迴圈中的索引是否是該陣列中的第一次出現，從而從陣列中刪除重複的元素。filter() 函式在執行過程中，會取額外的引數 pos 來代表元素的陣列索引。
var arrTwo = ['Hello 1 ', ' Hello 2 ', 'Hello 1 ', ' Hello 2 ', 'Hello 1 again']
const filteredArray = arrTwo.filter(function(ele, pos) {
return arrTwo.indexOf(ele) == pos;
})
console.log('The filtered array ', filteredArray);
輸出：
The filtered array (3) ["Hello 1 ", " Hello 2 ", "Hello 1 again"]
如果我們能使用 JavaScript ECMAScript 6 的箭頭語法，那麼刪除重複操作就能更好地實現。
var arrTwo =
['Hello 1 ', ' Hello 2 ', 'Hello 1 ', ' Hello 2 ', 'Hello 1 again'];
const filteredArray = arrTwo.filter((ele, pos) => arrTwo.indexOf(ele) == pos);
console.log('The filtered array', filteredArray);
輸出：
The filtered array (3) ["Hello 1 ", " Hello 2 ", "Hello 1 again"]
在 JavaScript 中使用 hashtable 從一個原始陣列中刪除重複的元素
如果我們有一個陣列只由數字 [ 1, 2, 3, 4, 1, 2, 3 ] 這樣的基元型別組成，而我們想從這個陣列 [ 1, 2, 3, 4 ] 中刪除重複的值，我們可以使用 hashtables 實現我們的 filterArray() 函式。
我們將建立一個名為 found 的臨時物件，它將包含所有非重複的值。在 filter 函式中，如果元素已經存在於 found 物件中，我們的條件將返回 false；否則，我們將以 true 的值將該元素新增到 found 物件中。
var arrThree =
[
'Hello 1 ', ' Hello 2 ', ' Hello 2 ', 'Welcome', 'Hello 1 again',
'Welcome', 'Goodbye'
]
function filterArray(inputArr) {
var found = {};
var out = inputArr.filter(function(element) {
return found.hasOwnProperty(element) ? false : (found[element] = true);
});
return out;
}
const outputArray = filterArray(arrThree);
console.log('Original Array', arrThree);
console.log('Filtered Array', outputArray);
輸出：
Original Array ["Hello 1 ", " Hello 2 ", " Hello 2 ", "Welcome", "Hello 1 again", "Welcome", "Goodbye"]
Filtered Array ["Hello 1 ", " Hello 2 ", "Welcome", "Hello 1 again", "Goodbye"]
使用 underscore 和 LoDash 庫中的 _.uniq() 函式從 JavaScript 中刪除陣列中的重複元素
如果我們已經在使用 underscore 庫中的任何一種方法，我們可以使用 _.uniq() 方法，因為它只返回輸入陣列中元素的第一次出現。
var arrFive = [1, 2, 3, 1, 5, 2];
console.log('LoDash output', _.uniq(arrFive));
LoDash output [1, 2, 3, 5]
我們可以從這裡匯入這個庫。