欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

JavaScript數(shù)組去重的15種方法總結(jié)

 更新時間：2025年05月06日 11:13:00   作者：胖方Hale  
這篇文章主要介紹了JavaScript數(shù)組去重的15種方法,包括利用ES6 Set、filter、reduce、Map對象、sort等,適合在面試中展示,需要的朋友可以參考下

前言

數(shù)組去重，一般都是在面試的時候才會碰到，一般是要求手寫數(shù)組去重方法的代碼。如果是被提問到，數(shù)組去重的方法有哪些？你能答出其中的 10 種，面試官很有可能對你刮目相看。一般工作只需要記住使用 SET 和遞歸就夠用了。

在真實的項目中碰到的數(shù)組去重，一般都是后臺去處理，很少讓前端處理數(shù)組去重。雖然日常項目用到的概率比較低，但還是需要了解一下，以防面試的時候可能回被問到。

能力有限，但還是盡力想去做到最好。如果文檔內(nèi)容對你有一點幫助，請幫忙點一個免費的贊和關(guān)注??‍??‍??‍，這樣我就能得到更多分享的機會，多多給大家分享。萬分感謝

1. 利用 ES6 SET 去重(最常用)

// 數(shù)組去重
let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

// 方法一：使用Set對象
const uniqueArr1 = function(arr) {
  return Array.from(new Set(arr));
};
console.log(uniqueArr1(arr)); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

優(yōu)勢：簡單，方便，代碼最少，容易理解。

缺點：無法去掉 {} 空對象。

2. 使用 fliter 方法

// 方法二：使用filter方法
const uniqueArr2 = function(arr) {
  return arr.filter((item, index, self) => self.indexOf(item) === index);
};
console.log(uniqueArr2(arr)); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

3. 使用 reduce 方法

// 方法三：使用reduce方法
const uniqueArr3 = function(arr) {
  return arr.reduce((prev, cur) => prev.includes(cur) ? prev : [...prev, cur], []);
};

4. 使用 Map 對象

// 方法四：使用Map對象
const uniqueArr4 = function(arr) {
  const map = new Map();
  return arr.filter((item) => !map.has(item) && map.set(item, 1));
};
console.log(uniqueArr4(arr)); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

5. 使用 sort 方法

// 方法五：使用sort方法
const uniqueArr5 = function(arr) {
  return arr.sort().filter((item, index, self) => item !== self[index - 1]);
};

6. 使用 includes 方法

// 方法六：使用includes方法
const uniqueArr6 = function(arr) {
  const res = [];
  for (let i = 0; i < arr.length; i++) {
    if (!res.includes(arr[i])) {
      res.push(arr[i]);
    }
  }
  return res;
};
console.log(uniqueArr6(arr)); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

7. 使用 indexof() 方法

// 方法七：使用indexOf方法
const uniqueArr7 = function(arr) {
  const res = [];
  for (let i = 0; i < arr.length; i++) {
    if (res.indexOf(arr[i]) === -1) {
      res.push(arr[i]);
    }
  }
  return res;
};
console.log(uniqueArr7(arr)); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

8. 使用 for …of 循環(huán)

// 方法八：使用for...of循環(huán)
const uniqueArr8 = function(arr) {
  const res = [];
  for (const item of arr) {
    if (!res.includes(item)) {
      res.push(item);
    }
  }
  return res;
};
console.log(uniqueArr8(arr)); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

9. 使用 for…in 循環(huán)

// 方法九：使用for...in循環(huán)
const uniqueArr9 = function(arr) {
  const res = [];
  for (const item in arr) {
    if (!res.includes(arr[item])) {
      res.push(arr[item]);
    }
  }
  return res;
};
console.log(uniqueArr9(arr)); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

10. 使用 white 循環(huán)

// 方法十：使用while循環(huán)
const uniqueArr10 = function(arr) {
  const res = [];
  let i = 0;
  while (i < arr.length) {
    if (!res.includes(arr[i])) {
      res.push(arr[i]);
    }
    i++;
  }
  return res;
};
console.log(uniqueArr10(arr)); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

11. 使用 do…while 循環(huán)

// 方法十一：使用do...while循環(huán)
const uniqueArr11 = function(arr) {
  const res = [];
  let i = 0;
  do {
    if (!res.includes(arr[i])) {
      res.push(arr[i]);
    }
    i++;
  } while (i < arr.length);
  return res;
};
console.log(uniqueArr11(arr)); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

12. 使用 forEach 方法

// 方法十二：使用forEach方法
const uniqueArr12 = function(arr) {
  const res = [];
  arr.forEach((item) => {
    if (!res.includes(item)) {
      res.push(item);
    }
  });
  return res;
};
console.log(uniqueArr12(arr)); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

13. 使用 map 方法

// 方法十三：使用map方法
const uniqueArr13 = function(arr) {
  const res = [];
  arr.map((item) => {
    if (!res.includes(item)) {
      res.push(item);
    }
  })
}
console.log(uniqueArr13(arr)); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

14. 利用遞歸去重

// 方法十四：利用遞歸去重
const uniqueArr14 = function(arr) {
  const res = arr;
  const len = res.length;
  for (let i = 0; i < len; i++) {
    for (let j = i + 1; j < len; j++) {
      if (res[i] === res[j]) {
        res.splice(j, 1);
        len--;
      }
    }
  }
}
console.log(uniqueArr14(arr)); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

總結(jié) 

到此這篇關(guān)于JavaScript數(shù)組去重的15種方法的文章就介紹到這了,更多相關(guān)JS數(shù)組去重內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

相關(guān)文章

最新評論