Ordering a Javascript array by object properties contained in another array

Question

My first array looks like this:

[
    {entityId: 1, name: 'Total sales'},
    {entityId: 2, name: 'Total customers'},
    {entityId: 3, name: 'Reach'}
]

I have a second array which stores entityIds, and I need to sort the first array using the values of the second array. So, if my second array looks like this:

[1, 3, 2]

then my first array should be sorted like this:

[
    {entityId: 1, name: 'Total sales'},
    {entityId: 3, name: 'Reach'},
    {entityId: 2, name: 'Total customers'}
]

I know I can sort an array based on object properties by using the sort method with my own callback:

array.sort(function(a, b) {
    // ... sorting logic ...
});

However I'm struggling to wrap my head around how the sorting logic will follow the sorting rules imposed by the second array, rather than just comparing two neighbouring elements.

Amir Popovich · Accepted Answer · 2015-09-03 11:21:59Z

7

Use Array.prototype.indexOf:

var arr = [
    {entityId: 1, name: 'Total sales'},
    {entityId: 2, name: 'Total customers'},
    {entityId: 3, name: 'Reach'}
];

var indArr = [3, 1, 2];

arr.sort(function(a, b) {
    return indArr.indexOf(a.entityId) - indArr.indexOf(b.entityId);
});

console.log(arr);

JSFIDDLE.

edited Sep 3, 2015 at 11:21

answered Sep 3, 2015 at 11:19

Amir Popovich

30.1k9 gold badges58 silver badges102 bronze badges

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

1 Comment

RobG Over a year ago

Concise, but as pointed out by Grundy, very slow as it calls indexOf twice on each iteration. It's very much faster (maybe 1,000 times faster on a big array) to not call indexOf at all.

Grundy · Accepted Answer · 2015-09-03 13:22:20Z

1

Yet another variant, possibly better for big array, because iterate over arrays just twice. In case indexOf - iterate twice on every calling sort callback.

first, create map from first array

var array = [
    {entityId: 1, name: 'Total sales'},
    {entityId: 2, name: 'Total customers'},
    {entityId: 3, name: 'Reach'}
];

var map = array.reduce(function(acc,el){
    acc[el.entityId] = el;
    return acc;
},{});

second, just map second array

var indexes = [1, 3, 2];

var result = indexes.map(function(index){ return map[index];});

naive test in jsperf

edited Sep 3, 2015 at 13:22

answered Sep 3, 2015 at 11:32

Grundy

13.4k3 gold badges39 silver badges57 bronze badges

4 Comments

RobG Over a year ago

"Better" in what way?

Grundy Over a year ago

@RobG, just two time go over by array, in case with sort - indexOf go over array twice on ever call sort callback

RobG Over a year ago

@Grudy—cool, just pointing out that when you say "better" you need to say why. ;-) You should include a plain reduce method without map in your jsperf example.

Grundy Over a year ago

@RobG, you mean your version from comment? a.reduce(function(acc, obj){return (acc[b.indexOf(obj.entityId)] = obj) && acc}, [])?

Willi Mentzel · Accepted Answer · 2015-09-03 11:27:08Z

-1

Simplest code would be:

var a = [
    {entityId: 1, name: 'Total sales'},
    {entityId: 2, name: 'Total customers'},
    {entityId: 3, name: 'Reach'}
];

var b = [1,3,2];
var c = b.slice(); //create copy

for (var i = 0;i< a.length;i++)
{
   var indexOf = b.indexOf(a[i].entityId);

   c[indexOf] = a[i];
}

console.log(c)

try the jsfiddle

edited Sep 3, 2015 at 11:27

Willi Mentzel

30.2k21 gold badges120 silver badges129 bronze badges

answered Sep 3, 2015 at 11:26

Asad Palekar

3012 silver badges12 bronze badges

2 Comments

Asad Palekar Over a year ago

true. He answered while i was preparing this.

RobG Over a year ago

Consider: a.reduce(function(acc, obj){return (acc[b.indexOf(obj.entityId)] = obj) && acc}, []). Doesn't use sort though.

Collectives™ on Stack Overflow

Ordering a Javascript array by object properties contained in another array

3 Answers 3

1 Comment

4 Comments

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

4 Comments

2 Comments

Related