快捷導(dǎo)航

關(guān)于JavaScript數(shù)組對(duì)象去重的幾種方法

更新時(shí)間：2023年04月21日 11:06:09 作者：小太陽(yáng)...

這篇文章主要介紹了關(guān)于JavaScript數(shù)組對(duì)象去重的幾種方法,不管是map對(duì)象的特性還是reduce方法都是很好用的去重方法,需要的朋友可以參考下

數(shù)組對(duì)象如下:

    let repeatData = [
      { id: 1, name: 'sun', age: 18 },
      { id: 1, name: 'sun', age: 18 },
      { id: 2, name: 'baozi', age: 20 },
      { id: 1, name: 'sun', age: 18 },
      { id: 3, name: 'lele', age: 3 },
      { id: 2, name: 'baozi', age: 20 }
    ]

要把id一樣的數(shù)據(jù)刪掉，得到如下結(jié)果

在這里插入圖片描述

1.利用Map對(duì)象 Map 對(duì)象保存鍵值對(duì)。任何值(對(duì)象或者原始值) 都可以作為一個(gè)鍵或一個(gè)值。 Map對(duì)象如果有重復(fù)的鍵值，則后面的會(huì)覆蓋前面的

   // 利用map對(duì)象
   let map = new Map()
   repeatData.forEach(item => {
     map.set(item.id, item)
   })
   let newData = [...map.values()]
   console.log(newData, 'newData');

2.雙層for循環(huán)

   for (let i = 0; i < repeatData.length; i++) {
     for(let j = i + 1; j < repeatData.length; j++) {
       if (repeatData[i].id === repeatData[j].id) {
         repeatData.splice(j, 1)
         j--
       }
     }
   }
   console.log(repeatData, 'repeatData');

3.利用數(shù)組的reduce方法

   let newObj = {}; 
   repeatData = repeatData.reduce((preVal, curVal) => {
     newObj[curVal.id] ? '' : newObj[curVal.id] = preVal.push(curVal);
     return preVal 
   }, [])
   console.log(repeatData, 'repeatData');

4.利用對(duì)象的屬性

   let newObj = {}, newArr = []
   repeatData.forEach(item => {
     if (!newObj[item.id]) {
       newObj[item.id] = newArr.push(item)
     }
   })
   console.log(newArr, 'newArr');

注意：第二種方法用到的splice方法會(huì)改變?cè)瓟?shù)組

js數(shù)組中下面方法會(huì)改變?cè)瓟?shù)組：

方法	用法
push	向數(shù)組的末尾添加一個(gè)或更多元素，并返回新的長(zhǎng)度
unshift	向數(shù)組的開(kāi)頭添加一個(gè)或更多元素，并返回新的長(zhǎng)度
pop	刪除數(shù)組的最后一個(gè)元素并返回刪除的元素
shift	刪除并返回?cái)?shù)組的第一個(gè)元素
sort	對(duì)數(shù)組的元素進(jìn)行排序
splice	從數(shù)組中添加或刪除元素
reverse	反轉(zhuǎn)數(shù)組的元素順序

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

您可能感興趣的文章: