How to filter a Array of objects but change order

Question

Lets say I have an array of objects[] and an array of numbers.

let objects = [
{name: apple, id:1},
{name: banana, id:2},
{name: orange, id:5}
];

let numbers = [5, 1];

I want to filter the object array, so only the id that matches with the numbers stays, and the order should be changed to match the numbers array.

result should be [{name: orange, id:5} , {name: apple, id:1} ]

Can I do it with javascript object prototypes? or can I use 3rd party tools like lodash ?

I've tried with code bellow, but it keeps the order of the original list:

result = object.filter(p => {
    return numbers.includes(parseInt(p.id));
});

Nina Scholz · Accepted Answer · 2020-12-31 09:41:44Z

2

You could map the wanted items by finding the objects.

var objects = [{ name: 'apple', id: 1 }, { name: 'banana', id: 2 }, { name: 'orange', id: 5 }],
    numbers = [5, 1],
    result = numbers.map(id => objects.find(o => o.id === id));

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

A canonical solution for finding and reordering could be to use a hash table or Map with a fas access of O(1) and map the wanted parts.

For examle here a solution with an abstraction of the key byhanding over the original data array, an array of wanted values and the key.

const
    getObjects = (data, values, key) => values.map(
        Map.prototype.get,
        objects.reduce((m, o) => m.set(o[key], o), new Map)
    ),
    objects = [{ name: 'apple', id: 1 }, { name: 'banana', id: 2 }, { name: 'orange', id: 5 }],
    values = ['banana', 'apple', 'orange'],
    result = getObjects(objects, values, 'name');

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

edited Dec 31, 2020 at 9:41

answered Dec 6, 2018 at 9:36

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

shabarinath Over a year ago

that is good one. Though how do we filter it without id.. lets say., I dont have ID., but need to reorder by name.. e.g. I need reordering by [banana, apple, orange]

Nina Scholz Over a year ago

@shabarinath, please see edit. if you want all objects in different order, you could sort the array by taking the index of the wanted order.

nicholaswmin · Accepted Answer · 2018-12-06 09:42:46Z

2

Just Array.map and Array.find. You don't need to Array.filter.

const items = [{name: 'apple', id:1}, {name: 'banana', id:2}, {name: 'orange', id:5}]

const numbers = [5, 1]

const result = numbers.map(n => items.find(i => i.id === n))

console.log(result)

Since you're mapping over numbers, the order of the result Array is identical to numbers.

edited Dec 6, 2018 at 9:42

answered Dec 6, 2018 at 9:37

nicholaswmin

23.2k16 gold badges103 silver badges175 bronze badges

Comments

Wicar C · Accepted Answer · 2018-12-06 09:49:41Z

2

It keeps the order because you iterate over objects. If you want to use the order from numbers you have to iterate over numbers.

You didn't say if the ids in numbers had to exist in objects, my solution works even if a stray id finds its way into numbers

let result = []
numbers.forEach(
        element => { if (objects.find(anObject => anObject.id == element))
                         result.push(objects.find(anObject => anObject.id == element)) })

answered Dec 6, 2018 at 9:49

Wicar C

213 bronze badges

Comments

Najam Us Saqib · Accepted Answer · 2018-12-06 09:48:16Z

0

checkObject(obj, arr) {
 let x;
 for (x in arr) {
    if(arr[x].id == obj.id){
      return true;
     }
 }
 return false;
}

let items = [{name: 'apple', id:1}, {name: 'banana', id:2}, {name: 'orange', id:5}]
let numbers = [5, 1];
checkObject(items, numbers);

you can try this function to check if your numbers array matches in your array of Object.

edited Dec 6, 2018 at 9:48

answered Dec 6, 2018 at 9:41

Najam Us Saqib

3,4411 gold badge29 silver badges49 bronze badges

Collectives™ on Stack Overflow

How to filter a Array of objects but change order

4 Answers 4

2 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

2 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related