Javascript – Sort JavaScript array of Objects based on one of the object’s properties

javascript

I've got an array of objects, each of which has a property name, a string. I'd like to sort the array by this property. I'd like them sorted in the following way..

`ABC`
`abc`
`BAC`
`bac`
etc...

How would I achieve this in JavaScript?

Best Answer

There are 2 basic ways:

var arr = [{name:"ABC"},{name:"BAC"},{name:"abc"},{name:"bac"}];

arr.sort(function(a,b){
  var alc = a.name.toLowerCase(), blc = b.name.toLowerCase();
  return alc > blc ? 1 : alc < blc ? -1 : 0;
 });

or

arr.sort(function(a,b){
  return a.name.toLowerCase().localeCompare(b.name.toLowerCase());
 });

Be aware that the 2nd version ignore diacritics, so a and à will be sorted as the same letter.

Now the problem with both these ways is that they will not sort uppercase ABC before lowercase abc, since it will treat them as the same.

To fix that, you will have to do it like this:

arr.sort(function(a,b){
  var alc = a.name.toLowerCase(), blc = b.name.toLowerCase();
  return alc > blc ? 1 : alc < blc ? -1 : a.name > b.name ? 1 : a.name < b.name ? -1 : 0;
});

Again here you could choose to use localeCompare instead if you don't want diacritics to affect the sorting like this:

arr.sort(function(a,b){
  var lccomp = a.name.toLowerCase().localeCompare(b.name.toLowerCase());
  return lccomp ? lccomp : a.name > b.name ? 1 : a.name < b.name ? -1 : 0;
});

You can read more about sort here: https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/sort