Javascript - sorting array by multiple criteria

Question

I have an array of objects:

var arr = [
  {title:'50 - 50'},
  {title:'100 - 100'},
  {title:'50 - 65'},
  {title:'100 - 125'}
];

I'm attempting to sort this array so that the items appear in the following order:

var arr = [
  {title:'50 - 50'},
  {title:'50 - 65'},
  {title:'100 - 100'},
  {title:'100 - 125'}
];

Currently I'm using the following sorting function to attempt this:

arr.sort(function(a, b){
  var titleA = a.title;
  var titleB = b.title;
  var arrA = titleA.split(' - ');
  var arrB = titleB.split(' - ');
  var keyA = parseInt(arrA[0]), 
      keyB = parseInt(arrB[0]);

  // Compare the 2 keys
  if(keyA < keyB) return -1;
  if(keyA > keyB) return 1;
  return 0;
});

However, this returns the items in the following order:

var arr = [
  {title:'50 - 65'},
  {title:'50 - 50'},
  {title:'100 - 125'},
  {title:'100 - 100'}
];

It looks like I need to sort by the first number in the title and then the second number. Any ideas?

use the code sample instead of code snippet when you are sharing the code. use code snippet whenever you are running it. — Prabhu Murthy
– Prabhu Murthy, Commented Feb 17, 2015 at 11:23
You are sorting on the first number only. Add another criterium for the second number when keyA == keyB. — Jongware
– Jongware, Commented Feb 17, 2015 at 11:28

Leonid Pyrlia · Accepted Answer · 2018-05-29 08:58:39Z

38

Here is a cleaner and shorter version that does not require a bunch of nested if/else cases:

const sorted = arr.sort((a,b) => {

    const [a1, a2] = a.title.split(' - ').map(Number);
    const [b1, b2] = b.title.split(' - ').map(Number);

    return a1 - b1 || a2 - b2;

});

answered May 29, 2018 at 8:58

Leonid Pyrlia

1,7322 gold badges12 silver badges16 bronze badges

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

1 Comment

OXiGEN Over a year ago

By far the simplest and cleanest solution here. It works because when a and b are the same, the value is zero, which means it moves on to the next OR operand, and so on.

Alex Kopachov · Accepted Answer · 2015-02-17 11:28:25Z

20

Try this:

arr.sort(function(a, b){
  var titleA = a.title;
  var titleB = b.title;
  var arrA = titleA.split(' - ');
  var arrB = titleB.split(' - ');
  var keyA1 = parseInt(arrA[0]), keyA2 = parseInt(arrA[1]) 
      keyB1 = parseInt(arrB[0]), keyB2 = parseInt(arrB[1]);

  // Compare the 2 keys
  if (keyA1 < keyB1) return -1;
  if (keyA1 > keyB1) return 1;
  if (keyA2 < keyB2) return -1;
  if (keyA2 > keyB2) return 1;
  return 0;
});

answered Feb 17, 2015 at 11:28

Alex Kopachov

7334 silver badges10 bronze badges

3 Comments

user2866434 Over a year ago

Thanks Alex. Works a treat.

Anthony Nandaa Over a year ago

Can't understand completely how it works, but surely does work. Will look up the docs. Thanks!

3gwebtrain Over a year ago

@Alex Kopachov can you help here please : stackoverflow.com/questions/74928718/…

meskobalazs · Accepted Answer · 2015-02-17 12:05:09Z

14

In pseudocode, the logic would be the following:

Procedure: comparator(a,b)

If a < b then return -1
If a = b then call comparator(a1, b1) recursively, where a1 and b1 are the comparable values of the next level in the sorting.
If a > b then return 1

In your concrete case, you can do simply do it by modifying your code a bit:

if (keyA < keyB) {
    return -1;
} else if (keyA > keyB) {
    return 1;
} else { // keyA == keyB
    if (titleA < titleB) {
        return -1;
    } else if (title > titleB) {
        return 1;
    } else {
        return 0;
    }
}

edited Feb 17, 2015 at 12:05

answered Feb 17, 2015 at 11:28

meskobalazs

16.1k2 gold badges44 silver badges63 bronze badges

1 Comment

dakab Over a year ago

＋１ for pseudocode and the actual crux: on comparison equality, compare at next level.

ShellNinja · Accepted Answer · 2018-04-11 19:27:57Z

1

Create a compare function similar to this:

arr.sort(function(a, b){
  var titleA = a.title;
  var titleB = b.title;
  var arrA = titleA.split(' - ');
  var arrB = titleB.split(' - ');
  var keyA1 = parseInt(arrA[0]), 
      keyA2 = parseInt(arrA[1]),
      keyB1 = parseInt(arrB[0]),
      keyB2 = parseInt(arrB[1]),

  // Compare the 2 keys
  if(keyA1 < keyB1) return -1;
  if(keyA1 > keyB1) return 1;
  else
  {
      if(keyA2 < keyB2) return -1;
      if(keyA2 > keyB2) return 1;
      return 0;
});

edited Apr 11, 2018 at 19:27

ShellNinja

6448 silver badges25 bronze badges

answered Feb 17, 2015 at 11:29

Mukesh Agarwal

5284 silver badges15 bronze badges

Comments

Evan Siroky · Accepted Answer · 2020-02-05 02:21:57Z

Another possibility is to compose a sort function based off of multiple comparator functions. Here is an example function that would do this:

function makeMultiCriteriaSort (...criteria) {
  return (a, b) => {
    for (let i = 0; i < criteria.length; i++) {
      const curCriteriaComparatorValue = criteria[i](a, b)
      // if the comparison objects are not equivalent, return the value obtained
      // in this current criteria comparison
      if (curCriteriaComparatorValue !== 0) {
        return curCriteriaComparatorValue
      }
    }
    return 0
  }
}

// sort an array with multiple criteria
arr.sort(makeMultiCriteriaSort(comparator1, comparator2))

The npm package thenby takes this idea to the next level.

Collectives™ on Stack Overflow

Javascript - sorting array by multiple criteria

5 Answers 5

1 Comment

3 Comments

1 Comment

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

1 Comment

3 Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related