JavaScript 唯一陣列
Ammar Ali
2023年10月12日
-
使用 JavaScript 中的
Set()
函式從陣列中獲取唯一值 -
使用 JavaScript 中的
indexOf()
函式從陣列中獲取唯一值 -
使用 JavaScript 中的
filter()
函式從陣列中獲取唯一值
本教程將討論如何使用 JavaScript 中的 Set()
、indexOf()
和 filter()
函式從陣列中獲取唯一值。
使用 JavaScript 中的 Set()
函式從陣列中獲取唯一值
要從陣列中獲取唯一值,我們可以使用 Set()
函式,該函式使用現有陣列中的唯一值建立一個新陣列。例如,讓我們建立一個具有重複值的陣列,使用 Set()
函式建立一個具有唯一值的新陣列,然後使用 JavaScript 中的 console.log()
函式在控制檯上顯示結果。請參考下面的程式碼。
var myArray = ['c', 'b', 'c', 2, 'b'];
var uniqueArray = [...new Set(myArray)]
console.log('Original Array = ', myArray);
console.log('Array with unique values = ', uniqueArray);
輸出:
Original Array = (5) ["c", "b", "c", 2, "b"]
Array with unique values = (3) ["c", "b", 2]
在輸出中,新陣列不包含任何重複值。
使用 JavaScript 中的 indexOf()
函式從陣列中獲取唯一值
要從陣列中獲取唯一值,我們可以使用 indexOf()
函式和迴圈建立我們自己的函式,這將建立一個具有現有陣列中唯一值的新陣列。我們將使用陣列將元素移動到新陣列,並使用 indexOf()
函式來檢查元素是否已經存在於新陣列中。
如果元素不在新陣列中,則將其移動到新陣列中;否則,它將保留。例如,讓我們建立一個具有重複值的陣列,然後使用我們的函式建立一個具有唯一值的新陣列,並使用 JavaScript 中的 console.log()
函式在控制檯上顯示結果。請參考下面的程式碼。
function uArray(array) {
var out = [];
for (var i = 0, len = array.length; i < len; i++)
if (out.indexOf(array[i]) === -1) out.push(array[i]);
return out;
}
var myArray = ['c', 'b', 'c', 2, 'b'];
var uniqueArray = uArray(myArray);
console.log('Original Array = ', myArray);
console.log('Array with unique values = ', uniqueArray);
輸出:
Original Array = (5) ["c", "b", "c", 2, "b"]
Array with unique values = (3) ["c", "b", 2]
在這裡,新陣列不包含任何重複值。
使用 JavaScript 中的 filter()
函式從陣列中獲取唯一值
要從陣列中獲取唯一值,我們可以使用 filter()
函式,該函式通過根據特定條件從現有陣列中過濾值來建立一個新陣列。filter()
函式將檢查原始陣列中存在的每個值。如果一個值是重複的,函式將刪除它;否則,該值將被新增到新陣列中。
例如,讓我們建立一個具有重複值的陣列,使用 filter()
函式建立一個具有唯一值的新陣列,並使用 JavaScript 中的 console.log()
函式在控制檯上顯示結果。請參考下面的程式碼。
var myArray = ['c', 'b', 'c', 2, 'b'];
var uniqueArray = myArray.filter((val, ind, arr) => arr.indexOf(val) === ind);
console.log('Original Array = ', myArray);
console.log('Array with unique values = ', uniqueArray);
輸出:
Original Array = (5) ["c", "b", "c", 2, "b"]
Array with unique values = (3) ["c", "b", 2]
正如你在此處看到的,新陣列不包含任何重複值。
作者: Ammar Ali