Javascript Array Sort strings with numbers

As you know JavaScript sort() function is for sort an array alphabetically. before getting to javascript array sort with string and numbers. let’s learn simple javascript array sort.

const vehicles = [“Car”, “Bus”, “Van”, “Lorry”, “Bike”];
vehicles.sort();

//Output -> [“Bike”, “Bus”, “Car”, “Lorry”, “Van”]

As you can see the sort() method sorts an array alphabetically. When we getting to numeric array sort, there is no common method like as sort(). But we are using sort() method to sort numeric arrays also.

const numbers = [56, 12, 100, 4, 28, 33, 128];
numbers.sort(function(a, b){ return a-b })

//Output -> [4, 12, 28, 33, 56, 100, 128]

You can use same trick to sort an array to descending order.

const numbers = [56, 12, 100, 4, 28, 33, 128];
numbers.sort(function(a, b){ return b – a })

//Output -> [4, 12, 28, 33, 56, 100, 128]

Javascript Array Sort | Object Array Sort

const person = [
          {‘name’ : ‘Gamage’, ‘birth_year’ : 1997},
          {‘name’ : ‘John’, ‘birth_year’ : 2010},
          {‘name’ : ‘Silva’, ‘birth_year’ : 1999},
          {‘name’ : ‘Peter’, ‘birth_year’ : 2008},
          {‘name’ : ‘Tom’, ‘birth_year’ : 2006}
];

person.sort(function(a, b){ return (a.birth_year – b.birth_year) })

//Output ->
[
          {‘name’ : ‘Gamage’, ‘birth_year’ : 1997},
          {‘name’ : ‘Silva’, ‘birth_year’ : 1999},
          {‘name’ : ‘Tom’, ‘birth_year’ : 2006},
          {‘name’ : ‘Peter’, ‘birth_year’ : 2008},
          {‘name’ : ‘John’, ‘birth_year’ : 2010}
];

As per the example above, you can see the object array is sorting according to the birth year. We are using sort() method and modifying the sort method with a function to sort an object array.

How to sort an array with string and numbers

Here is the advance part. Just kidding. This part also similar as the above parts. Just take a look at below object.

const loations = [
          {‘site’ : ‘site 01’},
          {‘site’ : ‘area 10’},
          {‘site’ : ‘site 11’},
          {‘site’ : ‘area 02’},
          {‘site’ : ‘site 20’},
          {‘site’ : ‘area 01’},
          {‘site’ : ‘site 10’},
          {‘site’ : ‘area 11’},
          {‘site’ : ‘site 02’},
          {‘site’ : ‘area 20’}
];

In here, let assume we want to sort the array object alphabetically and also with the numbers. It means ‘area 01, area 02, area 10, area 11, area 20 … site 01, site 02, site 10, site 11, site 20‘ like wise. How do you going to do that?

Here is the answer.

locations.sort((a, b) => a.site.localeCompare(b.site, undefined, {numeric:true, sensitivity: ‘base’}))

and here is the output.

//Output ->
[
          {‘site’ : ‘area 01’},
          {‘site’ : ‘area 02’},
          {‘site’ : ‘area 10’},
          {‘site’ : ‘area 11’},
          {‘site’ : ‘area 20’},
          {‘site’ : ‘site 01’},
          {‘site’ : ‘site 02’},
          {‘site’ : ‘site 10’},
          {‘site’ : ‘site 11’},
          {‘site’ : ‘site 20’}
];

If you want to reverse this array object, just change the a, b values.

locations.sort((a, b) => b.site.localeCompare(a.site, undefined, {numeric:true, sensitivity: ‘base’}))

Thank you for your valuable time. Please leave a comment if you are interested this article.