快捷導(dǎo)航

JavaScript數(shù)組去重常見(jiàn)四種方法(最新整理)

更新時(shí)間：2025年07月09日 11:57:07 作者：Codellllll

數(shù)組去重是JavaScript開(kāi)發(fā)中常見(jiàn)的需求,本文將詳細(xì)解析四種常用的數(shù)組去重方法及其優(yōu)缺點(diǎn),感興趣的朋友一起看看吧

JavaScript數(shù)組去重的四種方法解析

數(shù)組去重是JavaScript開(kāi)發(fā)中常見(jiàn)的需求，本文將詳細(xì)解析四種常用的數(shù)組去重方法及其優(yōu)缺點(diǎn)。

方法1: 使用Set數(shù)據(jù)結(jié)構(gòu)

function deduplicateWithSet(arr) {
  return [...new Set(arr)];
}

原理：

ES6的Set數(shù)據(jù)結(jié)構(gòu)天生具有元素唯一性特性
通過(guò)展開(kāi)運(yùn)算符...將Set轉(zhuǎn)換回?cái)?shù)組

優(yōu)點(diǎn)：

代碼簡(jiǎn)潔，一行搞定
性能最佳（O(n)時(shí)間復(fù)雜度）

缺點(diǎn)：

無(wú)法區(qū)分對(duì)象引用（兩個(gè)內(nèi)容相同的對(duì)象會(huì)被視為不同元素）
需要ES6支持

方法2: 使用filter和indexOf

function deduplicateWithFilter(arr) {
  return arr.filter((item, index) => arr.indexOf(item) === index);
}

原理：

indexOf返回元素第一次出現(xiàn)的索引
只保留索引匹配的元素

優(yōu)點(diǎn)：

代碼可讀性好
不改變?cè)紨?shù)組

缺點(diǎn)：

時(shí)間復(fù)雜度O(n²)，大數(shù)據(jù)量性能較差
同樣無(wú)法處理對(duì)象類型元素

方法3: 使用reduce方法

function deduplicateWithReduce(arr) {
  return arr.reduce((unique, item) => {
    return unique.includes(item) ? unique : [...unique, item];
  }, []);
}

原理：

使用reduce累積唯一值
通過(guò)includes檢查是否已存在

優(yōu)點(diǎn)：

函數(shù)式編程風(fēng)格
邏輯清晰

缺點(diǎn)：

每次迭代都創(chuàng)建新數(shù)組（使用...展開(kāi)）
時(shí)間復(fù)雜度O(n²)

方法4: 使用對(duì)象屬性

function deduplicateWithObject(arr) {
  const obj = {};
  return arr.filter(item => {
    return obj.hasOwnProperty(item) ? false : (obj[item] = true);
  });
}

原理：

利用對(duì)象屬性不可重復(fù)的特性
通過(guò)hasOwnProperty檢查存在性

優(yōu)點(diǎn)：

時(shí)間復(fù)雜度O(n)
兼容性好

缺點(diǎn)：

所有元素會(huì)被轉(zhuǎn)為字符串（如數(shù)字1和字符串"1"會(huì)被視為相同）
無(wú)法處理復(fù)雜對(duì)象

性能比較

方法	時(shí)間復(fù)雜度	適用場(chǎng)景
Set	O(n)	ES6環(huán)境，簡(jiǎn)單數(shù)據(jù)類型
filter	O(n²)	小數(shù)據(jù)量，兼容性要求
reduce	O(n²)	函數(shù)式編程偏好
Object	O(n)	兼容性要求高