CODEWITHSUNDEEP
javascriptarraysangulartypescript
ashley g
ashley g

Reputation: 885

Removing duplicate objects from array by property

so i have an array of objects, there are duplicate objects that contain the same id, i want to receive the first object with a unique id each time and then store that in a separate array. I Thought a map would achieve this but it dont seem to be working. I am using typescript.

My array of objects:

var infos= [

{InfoPageId: 8, DepartmentId: 1, Name: "Pitched Roof Window Buying Guide", Url: "buying-guide-pitched", Html: "<div class="background-grey" style="position: rela….&nbsp;</p></div></div></div></div></div></div>
↵"}
{InfoPageId: 8, DepartmentId: 1, Name: "Pitched Roof Window Buying Guide", Url: "buying-guide-pitched", Html: "<div class="background-grey" style="position: rela….&nbsp;</p></div></div></div></div></div></div>
↵"}
{InfoPageId: 8, DepartmentId: 1, Name: "Pitched Roof Window Buying Guide", Url: "buying-guide-pitched", Html: "<div class="background-grey" style="position: rela….&nbsp;</p></div></div></div></div></div></div>
↵"}
{InfoPageId: 8, DepartmentId: 1, Name: "Pitched Roof Window Buying Guide", Url: "buying-guide-pitched", Html: "<div class="background-grey" style="position: rela….&nbsp;</p></div></div></div></div></div></div>
↵", …}
{InfoPageId: 8, DepartmentId: 1, Name: "Pitched Roof Window Buying Guide", Url: "buying-guide-pitched", Html: "<div class="background-grey" style="position: rela….&nbsp;</p></div></div></div></div></div></div>
↵"}
{InfoPageId: 8, DepartmentId: 1, Name: "Pitched Roof Window Buying Guide", Url: "buying-guide-pitched", Html: "<div class="background-grey" style="position: rela….&nbsp;</p></div></div></div></div></div></div>
↵"}
{InfoPageId: 9, DepartmentId: 1, Name: "Introducing Korniche Glass Lanterns", Url: "new-in-korniche-glass-lanterns", Html: "<div class="container py-4" data-jsplus-bootstrap-…">&nbsp;</span>today!</strong></span></p></div>
↵"}
{InfoPageId: 9, DepartmentId: 1, Name: "Introducing Korniche Glass Lanterns", Url: "new-in-korniche-glass-lanterns", Html: "<div class="container py-4" data-jsplus-bootstrap-…">&nbsp;</span>today!</strong></span></p></div>
↵"}
{InfoPageId: 9, DepartmentId: 1, Name: "Introducing Korniche Glass Lanterns", Url: "new-in-korniche-glass-lanterns", Html: "<div class="container py-4" data-jsplus-bootstrap-…">&nbsp;</span>today!</strong></span></p></div>
↵"}
{InfoPageId: 9, DepartmentId: 1, Name: "Introducing Korniche Glass Lanterns", Url: "new-in-korniche-glass-lanterns", Html: "<div class="container py-4" data-jsplus-bootstrap-…">&nbsp;</span>today!</strong></span></p></div>
↵", …}
{InfoPageId: 9, DepartmentId: 1, Name: "Introducing Korniche Glass Lanterns", Url: "new-in-korniche-glass-lanterns", Html: "<div class="container py-4" data-jsplus-bootstrap-…">&nbsp;</span>today!</strong></span></p></div>
↵"}
{InfoPageId: 10, DepartmentId: 1, Name: "What are Heritage Conservation Roof Windows?", Url: "new-in-heritage-conservation-roof-windows", Html: "<div class="container py-4" data-jsplus-bootstrap-…e more than happy to help you.</span></p></div>
↵"}
{InfoPageId: 10, DepartmentId: 1, Name: "What are Heritage Conservation Roof Windows?", Url: "new-in-heritage-conservation-roof-windows", Html: "<div class="container py-4" data-jsplus-bootstrap-…e more than happy to help you.</span></p></div>
↵"}
{InfoPageId: 10, DepartmentId: 1, Name: "What are Heritage Conservation Roof Windows?", Url: "new-in-heritage-conservation-roof-windows", Html: "<div class="container py-4" data-jsplus-bootstrap-…e more than happy to help you.</span></p></div>
↵"}
]

logic:

 this.getUniqueValues(this.infos, 'InfoTypeId')


  getUniqueValues(infos: Array<infoPage>, comp: string ) {

                // store the comparison  values in array
                var unique =  infos.map(e => e[comp])

                // store the indexes of the unique objects
                .map((e, i, final) => final.indexOf(e) === i && i)

                // eliminate the false indexes & return unique objects
               .filter((e) => infos[e]).map(e => infos[e]);

               console.log(unique)

}

Upvotes: 0

Views: 93

Answers (6)

Aakash Garg
Aakash Garg

Reputation: 10969

Simplest Solution would be to iterate through all items and keep a object of already processed items. and don't add already processed to new array.

public findUnique(data: any[], key: string): any[] {
  var result = [];
  var processedData = {};
  any.forEach((item) => {
     if(!processedData[item["key"]]) {
          result.push(item);
          processedData[item[key]] = true;
     }
  }
  return result;
}

Upvotes: 0

Andrew1325
Andrew1325

Reputation: 3579

You can use filter to achieve this as well.

let infos= [ 
  {InfoPageId: 8, DepartmentId: 1},
  {InfoPageId: 8, DepartmentId: 1},
  {InfoPageId: 8, DepartmentId: 1},
  {InfoPageId: 9, DepartmentId: 1},
  {InfoPageId: 9, DepartmentId: 1}
];

const uniqueInfos = infos.filter((infos, index, self) => self.findIndex(i => i.InfoPageId === infos.InfoPageId && i.DepartmentId === infos.DepartmentId) === index);

console.log(uniqueInfos)

Upvotes: 0

J&#225;n Jakub Naništa
J&#225;n Jakub Naništa

Reputation: 1916

You can use reduce in conjunction with Object.values:

const uniqBy = (infos: InfoPage[], key: keyof InfoPage): InfoPage[] => {
  return Object.values(
    infos.reduce((unique, info) => ({
      ...unique,
      [info[key]]: unique[info[key]] || info,
    }), {} as any) // You could also improve the types of the function to get rid of the "any" but the amount of code might not be worth it
  );
};

Upvotes: 1

Rajneesh
Rajneesh

Reputation: 5308

How about making it unique by making use of Map:

var infos= [ {InfoPageId: 7, DepartmentId: 1 }, {InfoPageId: 8, DepartmentId: 1 }, {InfoPageId: 8, DepartmentId: 1 }, {InfoPageId: 9, DepartmentId: 1 },]
var unique = [...new Map(infos.map(val=>[val.InfoPageId, val])).values()];

console.log(unique)

Upvotes: 1

Atishay Jain
Atishay Jain

Reputation: 1445

Hope this helps

var infos= [ 
  {InfoPageId: 8, DepartmentId: 1},
  {InfoPageId: 8, DepartmentId: 1},
  {InfoPageId: 8, DepartmentId: 1},
  {InfoPageId: 9, DepartmentId: 1},
  {InfoPageId: 9, DepartmentId: 1}
]

const uniqueInfos = []
const InfosMap = {}


infos.map((info) => {
  if (!InfosMap[info.InfoPageId]) {
    InfosMap[info.InfoPageId] = true
    uniqueInfos.push(info)
  }
})

console.log(uniqueInfos)

Upvotes: 0

Ashish
Ashish

Reputation: 4330

There are many ways to achieve this. What you need to do is pick on element and check is there any element with the same InfoPageId in your selected array.

var infos= [
  {InfoPageId: 7, DepartmentId: 1 },
  {InfoPageId: 8, DepartmentId: 1 },
  {InfoPageId: 8, DepartmentId: 2 },
  {InfoPageId: 9, DepartmentId: 1 },
]

const out = infos.reduce(
    (acc, cur) => acc.some(
        x => x.InfoPageId === cur.InfoPageId
    ) ? 
    acc : 
    acc.concat(cur),
    []
)

console.log(out)

In the above example I have used reduce and some. You can achieve the same with any other array looping method with the above logic.

Upvotes: 0

Related Questions