1.利用ES6的Set
Set是一種新的數(shù)據(jù)結(jié)構(gòu),它的成員具有唯一性。可以將數(shù)組轉(zhuǎn)換為Set,再轉(zhuǎn)換回?cái)?shù)組來實(shí)現(xiàn)去重。
let arr = [1, 2, 2, 3, 4, 4];
let uniqueArr = [...new Set(arr)];
console.log(uniqueArr); // [1, 2, 3, 4]
這種方法非常簡潔,而且效率較高。它適用于數(shù)組元素是基本數(shù)據(jù)類型(如數(shù)字、字符串、布爾值)或者是引用數(shù)據(jù)類型(對象、數(shù)組等)且希望根據(jù)引用是否相同來去重的情況。
2. 利用filter和indexOf
可以通過 filter 方法遍歷數(shù)組,只保留第一個出現(xiàn)的元素,即索引為 0 的元素。
let arr = [1, 2, 2, 3, 4, 4];
let uniqueArr = arr.filter((element, index) => {
return arr.indexOf(element) === index;
});
console.log(uniqueArr); // [1, 2, 3, 4]
這種方法的原理是 indexOf 返回元素在數(shù)組中第一次出現(xiàn)的位置,如果當(dāng)前元素的索引和 indexOf 返回的索引相同,說明這個元素是第一次出現(xiàn),就將其保留下來。不過這種方法對于包含對象等引用數(shù)據(jù)類型的數(shù)組,如果對象內(nèi)容相同但引用不同,可能無法達(dá)到理想的去重效果。
3. 利用雙重循環(huán)(傳統(tǒng)方法)
這種方法比較直觀,但效率相對較低。外層循環(huán)遍歷數(shù)組,內(nèi)層循環(huán)檢查當(dāng)前元素后面的元素是否與之重復(fù),若重復(fù)則刪除。
let arr = [1, 2, 2, 3, 4, 4];
for (let i = 0; i < arr.length; i++) {
for (let j = i + 1; j < arr.length; j++) {
if (arr[i] === arr[j]) {
arr.splice(j, 1);
j--;
}
}
}
console.log(arr); // [1, 2, 3, 4]
在這里,當(dāng)發(fā)現(xiàn)重復(fù)元素時,使用 splice 方法將其刪除,并且需要將內(nèi)層循環(huán)的索引 j 減 1 ,因?yàn)閯h除元素后數(shù)組長度和元素索引都發(fā)生了變化,否則可能會跳過一些元素。
4. 利用對象的屬性來記錄元素是否出現(xiàn)過(適用于基本數(shù)據(jù)類型)
創(chuàng)建一個空對象,遍歷數(shù)組,將數(shù)組元素作為對象的屬性名,屬性值可以是任意值(比如 true )。如果對象中不存在該屬性,就將元素添加到新數(shù)組中,并在對象中記錄該屬性;如果已經(jīng)存在,則說明元素重復(fù),跳過該元素。
let arr = [1, 2, 2, 3, 4, 4];
let uniqueArr = [];
let obj = {};
for (let i = 0; len = arr.length; i < len; i++) {
let element = arr[i];
if (!obj[element]) {
uniqueArr.push(element);
obj[element] = true;
}
}
console.log(uniqueArr); // [1, 2, 3, 4]
這種方法在處理基本數(shù)據(jù)類型時速度比較快,但如果數(shù)組元素是對象等引用數(shù)據(jù)類型,需要根據(jù)對象的內(nèi)容來判斷是否重復(fù),這種方法就需要修改,比如對對象進(jìn)行序列化(如使用 JSON.stringify )后作為屬性名來判斷。
5.利用for循環(huán)和includes方法
- 思路是創(chuàng)建一個新的數(shù)組,通過 for 循環(huán)遍歷原始數(shù)組。對于每個元素,檢查它是否已經(jīng)存在于新數(shù)組中(使用 includes 方法)。如果不存在,就將其添加到新數(shù)組中。
- 示例代碼如下:
let arr = [1, 2, 2, 3, 4, 4];
let newArr = [];
for (let i = 0; i < arr.length; i++) {
if (!newArr.includes(arr[i])) {
newArr.push(arr[i]);
}
}
console.log(newArr);
這種方法的優(yōu)點(diǎn)是比較直觀,容易理解。但是 includes 方法在某些瀏覽器中的性能可能不是最優(yōu)的,特別是對于大型數(shù)組。
6. 利用Map數(shù)據(jù)結(jié)構(gòu)
與使用對象進(jìn)行去重類似,不過 Map 有一些額外的優(yōu)勢,比如可以更好地處理對象等復(fù)雜數(shù)據(jù)類型(通過合適的鍵值設(shè)置)。
思路是創(chuàng)建一個 Map 對象,遍歷數(shù)組。對于每個元素,檢查 Map 中是否已經(jīng)存在對應(yīng)的鍵。如果不存在,就將元素添加到新數(shù)組中,并在 Map 中設(shè)置鍵值對(鍵為元素,值可以是任意值,比如 true )。
示例代碼如下:
let arr = [1, 2, 2, 3, 4, 4];
let newArr = [];
let map = new Map();
for (let i = 0; i < arr.length; i++) {
if (!map.has(arr[i])) {
newArr.push(arr[i]);
map.set(arr[i], true);
}
}
console.log(newArr);
Map 的 has 和 set 方法在處理數(shù)據(jù)時比較高效,而且 Map 可以更方便地處理復(fù)雜數(shù)據(jù)類型,因?yàn)樗逆I可以是任意數(shù)據(jù)類型,不像普通對象的鍵必須是字符串或符號。
7. 利用reduce方法
reduce 方法可以對數(shù)組中的每個元素執(zhí)行一個由您提供的reducer函數(shù)(升序執(zhí)行),將其結(jié)果匯總為單個返回值。
- 思路是使用 reduce 函數(shù),初始值是一個空數(shù)組。在每次迭代中,檢查累積數(shù)組( accumulator )中是否已經(jīng)包含當(dāng)前元素。如果不包含,就將其添加到累積數(shù)組中。
示例代碼如下:
let arr = [1, 2, 2, 3, 4, 4];
let newArr = arr.reduce((acc, cur) => {
if (!acc.includes(cur)) {
acc.push(cur);
}
return acc;
}, []);
console.log(newArr);
這種方法可以將去重操作和其他數(shù)據(jù)處理操作結(jié)合起來,在對數(shù)組進(jìn)行匯總和轉(zhuǎn)換的同時實(shí)現(xiàn)去重,不過對于簡單的去重場景可能會顯得稍微復(fù)雜一些。
該文章在 2024/12/20 11:25:05 編輯過