I have an array containing several objects similar to the following:
{person: {name: "Steve", id: 1}, role: 1}
{person: {name: "Phil", id: 2}, role: 1}
{person: {name: "Steve", id: 1}, role: 3}
{person: {name: "Phil", id: 2}, role: 6}
My intention is to return an array of the same type, but I'd like to return only one object per "person" with their highest role.
I understand the following will give me a single object with the highest role.
array.reduce((prev, cur) => prev.role > cur.role ? prev : cur);
How do I return each unique person and their corresponding highest role as a new array?
Like so:
{person: {name: "Steve", id: 1}, role: 3}
{person: {name: "Phil", id: 2}, role: 6}
You need to collect the objects and if you have already one with the same id
check the role
and take the greater one.
var data = [{ person: { name: "Steve", id: 1 }, role: 1 }, { person: { name: "Phil", id: 2 }, role: 1 }, { person: { name: "Steve", id: 1 }, role: 3 }, { person: { name: "Phil", id: 2 }, role: 6 }],
grouped = data.reduce((r, o) => {
var index = r.findIndex(({ person: { id } }) => id === o.person.id);
if (index === -1) {
r.push(o);
return r;
}
if (r[index].role < o.role) {
r[index] = o;
}
return r;
}, []);
console.log(grouped);
.as-console-wrapper { max-height: 100% !important; top: 0; }
Group the items by person.id
with Array.reduce()
, but for each id
store only the object with the highest role. Convert back to array using Object.values()
:
const data = [{ person: { name: "Steve", id: 1 }, role: 1 }, { person: { name: "Phil", id: 2 }, role: 1 }, { person: { name: "Steve", id: 1 }, role: 3 }, { person: { name: "Phil", id: 2 }, role: 6 }];
const result = Object.values(data.reduce((r, o) => {
const id = o.person.id;
if(!r[id] || r[id].role < o.role) r[id] = o;
return r;
}, []));
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }
I want to pass the value from select list - ListComponentComponent to sibling component - DisplayComponentComponent and display the value in the template of DisplayComponentComponent. I want to use ...
I want to pass the value from select list - ListComponentComponent to sibling component - DisplayComponentComponent and display the value in the template of DisplayComponentComponent. I want to use ...
import React, { useContext } from 'react'; useContext is undefined. error details: Uncaught (in promise) TypeError: Object(...) is not a function error when processing const context = ...
import React, { useContext } from 'react'; useContext is undefined. error details: Uncaught (in promise) TypeError: Object(...) is not a function error when processing const context = ...
var imagecount = 1; var total = 3; I'd like to know why I can't make an imageslider this way. I have pictures saved such as studentbild1, studentbild2 and studentbild3. How do I get those to show in ...
var imagecount = 1; var total = 3; I'd like to know why I can't make an imageslider this way. I have pictures saved such as studentbild1, studentbild2 and studentbild3. How do I get those to show in ...
I'm in the process of making a code that prints all numbers divisable by 3 using an array, but im having trouble removing specific values. All the values i want prints correctly, but what i want is to ...
I'm in the process of making a code that prints all numbers divisable by 3 using an array, but im having trouble removing specific values. All the values i want prints correctly, but what i want is to ...