How to reorder object array by using order array?

Question

I need to reorder some objects in an array.

Assume this is my data array:

const data = [
  { id: 'ETHUVMY0m', name: 'item 1', value: 'value 1' },
  { id: 'McfTB40vO', name: 'item 2', value: 'value 2' }
]

And there is another array, which represents the new order:

const order = [ 'McfTB40vO', 'ETHUVMY0m' ]

As you can see, the second item gets on the first place.

So the result should be:

[
  { id: 'McfTB40vO', name: 'item 2', value: 'value 2' },
  { id: 'ETHUVMY0m', name: 'item 1', value: 'value 1' }
]

I thought of using an forEach loop:

data.forEach(d => {
  order.indexOf(d.id) // get new index
  // but how to reorder the array?
})

you would build your own custom sort and pass the custom function to sort — Derek Pollard
– Derek Pollard, Commented Mar 18, 2019 at 21:17

Ori Drori · Accepted Answer · 2019-03-18 21:19:25Z

3

Convert the data to a Map of objects by id. Then use Array.map() on the order array, and get the relevant item from the Map:

const data = [
  { id: 'ETHUVMY0m', name: 'item 1', value: 'value 1' },
  { id: 'McfTB40vO', name: 'item 2', value: 'value 2' }
]

const order = [ 'McfTB40vO', 'ETHUVMY0m' ]

const dataMap = new Map(data.map(o => [o.id, o]))
const result = order.map(id => dataMap.get(id))

console.log(result)

answered Mar 18, 2019 at 21:19

Ori Drori

196k32 gold badges243 silver badges233 bronze badges

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

Comments

jo_va · Accepted Answer · 2019-03-18 21:20:51Z

2

If you want to do it immutably, use map and find, not forEach:

const data = [
  { id: 'ETHUVMY0m', name: 'item 1', value: 'value 1' },
  { id: 'McfTB40vO', name: 'item 2', value: 'value 2' }
];

const order = [ 'McfTB40vO', 'ETHUVMY0m' ];

const result = order.map(id => data.find(x => x.id === id));

console.log(result);

edited Mar 18, 2019 at 21:20

answered Mar 18, 2019 at 21:18

jo_va

14.1k3 gold badges25 silver badges49 bronze badges

3 Comments

Patrick Roberts Over a year ago

If you reduce() order into a Map before using Array.prototype.map(), you can perform this in O(n) using Map.prototype.has() instead of Array.prototype.find().

user3142695 Over a year ago

@PatrickRoberts I don't understand what you suggest. Could you give an example?

jo_va Over a year ago

@user3142695, look at Ori Drori's answer for a solution using Map.get(), which is more efficient than using find()

Jack Bashford · Accepted Answer · 2019-03-18 21:20:33Z

0

You could map over order:

const data = [{
    id: 'ETHUVMY0m',
    name: 'item 1',
    value: 'value 1'
  },
  {
    id: 'McfTB40vO',
    name: 'item 2',
    value: 'value 2'
  }
]

const order = ['McfTB40vO', 'ETHUVMY0m']

const output = order.map(d => data.find(({
  id
}) => d == id));

console.log(output);

answered Mar 18, 2019 at 21:20

Jack Bashford

44.3k11 gold badges56 silver badges84 bronze badges

Collectives™ on Stack Overflow

How to reorder object array by using order array?

3 Answers 3

Comments

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related