目錄前言方法一：使用 .filter() 和 .findIndex() 相結(jié)合的方法方法二：使用 .reduce() 方法方法三：使用 .forEach() 和 .some() 相結(jié)合的方法方法四：使用 Map方法五：Object.create()方法六：For const of 和 find 結(jié)合針對(duì)多個(gè)屬性進(jìn)行去重結(jié)束前言

大家好，關(guān)于對(duì)象數(shù)組去重的業(yè)務(wù)場(chǎng)景，想必大家都遇到過類似的需求吧，針對(duì)這樣的需求，你是怎么做的呢。

下面我就先和大家討論下基于對(duì)象的某個(gè)屬性如何去重。

方法一：使用 .filter() 和 .findIndex() 相結(jié)合的方法

使用 filter() 方法過濾掉重復(fù)的元素，使用 findIndex() 方法判斷對(duì)象是否重復(fù)，代碼如下：

const arr = [{id: 1, name: 'a'}, {id: 2, name: 'b'}, {id: 1, name: 'c'}, {id: 3, name: 'd'}];const uniqueArr = arr.filter((item, index) => arr.findIndex(i => i.id === item.id) === index);方法二：使用 .reduce() 方法

使用 reduce() 方法維護(hù)一個(gè)累加器，通過對(duì)象的屬性來判斷是否重復(fù)，代碼如下：

const arr = [{id: 1, name: 'a'}, {id: 2, name: 'b'}, {id: 1, name: 'c'}, {id: 3, name: 'd'}];const uniqueArr = arr.reduce((acc, curr) => { if (!acc.find(item => item.id === curr.id)) { acc.push(curr); } return acc;}, []);方法三：使用 .forEach() 和 .some() 相結(jié)合的方法

使用 forEach() 方法遍歷數(shù)組，使用 some() 方法判斷是否重復(fù)，代碼如下：

const arr = [{id: 1, name: 'a'}, {id: 2, name: 'b'}, {id: 1, name: 'c'}, {id: 3, name: 'd'}];const uniqueArr = [];arr.forEach(item => { if (!uniqueArr.some(i => i.id === item.id)) { uniqueArr.push(item); }});方法四：使用 Map

使用 Map 結(jié)構(gòu)去重對(duì)象數(shù)組時(shí)，需要借助 array.map() 函數(shù)將對(duì)象數(shù)組進(jìn)行轉(zhuǎn)換，示例代碼如下：

const arr = [{id: 1, name: 'a'}, {id: 2, name: 'b'}, {id: 1, name: 'c'}, {id: 3, name: 'd'}];const uniqueArr = [...new Map(arr.map(item => [item.id, item])).values()];方法五：Object.create()

使用Object.create()，按照對(duì)象的屬性來判斷是否重復(fù)，代碼如下

const arr = [{id: 1, name: 'a'}, {id: 2, name: 'b'}, {id: 1, name: 'c'}, {id: 3, name: 'd'}];const uniqueArr = arr.filter(function (item) { return !this[item.id] && (this[item.id] = true);}, Object.create(null));方法六：For const of 和 find 結(jié)合

這個(gè)方法的思想與方法3類似 ，其思路結(jié)構(gòu)如下：

創(chuàng)建一個(gè)空的唯一數(shù)組來存儲(chǔ)唯一對(duì)象。循環(huán)遍歷數(shù)組中的對(duì)象。對(duì)于每個(gè)對(duì)象，如果它不是重復(fù)的，則將其添加到唯一數(shù)組。否則，忽略它c(diǎn)onst arr = [{id: 1, name: 'a'}, {id: 2, name: 'b'}, {id: 1, name: 'c'}, {id: 3, name: 'd'}];const unique = [];for (const item of arr) { const isDuplicate = unique.find((obj) => obj.id === item.id); if (!isDuplicate) { unique.push(item); }}針對(duì)多個(gè)屬性進(jìn)行去重

有時(shí)候，您可能希望僅當(dāng)對(duì)象具有兩個(gè)或多個(gè)具有相同值的屬性時(shí)才將其視為重復(fù)對(duì)象——多個(gè)屬性值相同。

對(duì)于這種情況，我們可以將上述方法進(jìn)行稍微調(diào)整就可以進(jìn)行使用，有部分方法可能不適用,有哪些不合適，這個(gè)問題留給大家，歡迎大家在評(píng)論區(qū)討論。

我們先使用 .filter() 和 .findIndex() 相結(jié)合的方法嘗試下，看看如何操作：

const arr = [{id: 1, name: 'a'}, {id: 2, name: 'b'}, {id: 1, name: 'a'}, {id: 3, name: 'd'}];const uniqueArr = arr.filter((item, index) => arr.findIndex(i => i.id === item.id&& i.name === item.name) === index);

我們?cè)偈褂?For const of 和 find 結(jié)合的方法，也能實(shí)現(xiàn)同樣的效果

const arr = [{id: 1, name: 'a'}, {id: 2, name: 'b'}, {id: 1, name: 'a'}, {id: 3, name: 'd'}];const unique = [];for (const item of arr) { const isDuplicate = unique.find((obj) => obj.id === item.id && obj.name ==item.name); if (!isDuplicate) { unique.push(item); }}console.log(unique)結(jié)束

其他幾個(gè)方法的改造，歡迎大家作為練習(xí)進(jìn)行嘗試，這里就不再一一舉例了，今天的分享就到這里，這些方法都可以實(shí)現(xiàn)對(duì)象數(shù)組的去重，具體使用哪種方法取決于個(gè)人的喜好和項(xiàng)目的需求，如果你有其他的方法，歡迎大家在評(píng)論區(qū)補(bǔ)充，感謝你的關(guān)注。

到此這篇關(guān)于JS中6個(gè)對(duì)象數(shù)組去重的方法的文章就介紹到這了,更多相關(guān)JS對(duì)象數(shù)組去重內(nèi)容請(qǐng)搜索好吧啦網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持好吧啦網(wǎng)！