Javascript developers get this problem very often. When we deal with rest API responses, we often receive an array of complex objects as a result. API’s can give us a sorted result to an extent. But in UI, when we try to represent that result in multiple forms, we do some preprocessing.

Today I am going to explain how to sort an array of objects in javascript. To be more specific, I am going to describe various methods of sorting.

Below are the three ways of sorting I am going to explain

• Sort an array of objects by a string
• Sort an array of objects by number
• Sort an array of date

I am going to solve all of these three problems using the sort() function.

Sort() function in javascript

The sort() function takes only one parameter, a compare function. Compare function contains the logic that performs an in-place comparison between two values and applies sort logically.

Below is an example, to sort an integer array in ascending order.

var numbers = [40, 100, 1, 5, 25, 10];

numbers.sort(function(a, b){return b-a});

console.log(numbers);  // [1, 2, 5, 10, 25, 40, 100]

In the above function, the comparison function is simple.

function(a, b) {
    return a-b;
}

If you interchange a-b to b-a in the function, then you will get an array sorted in descending order.

Similarly, we will implement all three problems by changing the logic in the compare function.

Example array of objects

 let cars= [
     {
             name: 'Swift',
             batchNumber: 391,
             mfgDate: 'July 1, 2019'
         },
     {
             name: 'Corolla',
             batchNumber: 142,
             mfgDate: 'January 19, 2019'
         },
     {
             name: 'Zen',
             batchNumber: 213,
             mfgDate: 'March 23, 2019'
      }
 ];

Sort an array of objects by a string

The cars array objects have a string property name. Below is the code which will sort all the objects in ascending order depending on the name property value.

cars.sort((a, b) => { 

    if (a.name < b.name) { 
        return -1; 
    } 
    if (a.name > b.name) { 

        return 1; 

    } 

    return 0; 

});

Result array:

 let cars= [
         {
             name: 'Corolla',
             batchNumber: 142,
             mfgDate: 'January 19, 2019'
         },
     {
             name: 'Swift',
             batchNumber: 391,
             mfgDate: 'July 1, 2019'
        },
       {
             name: 'Zen',
             batchNumber: 213,
             mfgDate: 'March 23, 2019'
        }
 ];

Sort an array of objects by number

The cars array objects have a number property batchNumber. Below is the code which will sort all the objects in ascending order depending on the batchNumber property value.

cars.sort((a, b) => { 

    return a.batchNumber - b.batchNumber; 

});

Result array:

let cars= [

        {
            name: 'Corolla',
            batchNumber: 142,
            mfgDate: 'January 19, 2019'
        },
      {
            name: 'Zen',
            batchNumber: 213,
            mfgDate: 'March 23, 2019'
       },
    {
            name: 'Swift',
            batchNumber: 391,
            mfgDate: 'July 1, 2019'
       }
];

Sort an array of objects by date

The cars array objects have a number property mfgDate. Below is the code which will sort all the objects in ascending order depending on the mfgDate property value.

cars.sort((a, b) => { 

    return new Date(a.mfgDate) - new Date(b.mfgDate); 

});

Result array:

let cars= [

        {
            name: 'Corolla',
            batchNumber: 142,
            mfgDate: 'January 19, 2019'
        },
      {
            name: 'Zen',
            batchNumber: 213,
            mfgDate: 'March 23, 2019'
       },
    {
            name: 'Swift',
            batchNumber: 391,
            mfgDate: 'July 1, 2019'
       }
];

The sort function is powerful. It is easy to use and reduces the requirement of any external library for sorting.