Anjan Dutta
Javascript sort array of objects
Javascript sort array of objects
Updated On: 27/10/2021
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 the objects in an array based upon a common property value from each objects.
Prerequisite
Before trying to sort any array of objects in javascript, we must check if all objects in that array has a common property name.
For example, below is our sample object:
let obj = [{a: 2, b: 1, c: 3},{a: 7, c: 8},{b: 0, c: 5}];
In the above example, the common property name among all the objects is ācā.
Next, we have to check what is the data type of the common object property. An object can have multiple types of properties. Type means data type of any property. In this article, I have explained the three most commonly used type based sorting.
Three most commonly used object property based sorting in javascript.
- Sort array of objects in javascript by a string property
- Sort array of objects in javascript by number property
- Sort array of objects in javascript by date property
There are many approaches that we can use to code all three of these solutions. Manually we can compare object to object by property values and sort objects. Go for it and give it a try if you love solving algorithms problems.
Or, we can use inbuilt javascript functions to quickly code these solutions. For this article we are going to use the sort()
function.
If you do not know what is a sort()
function then do not worry. I am going to explain it next.
The sort function is powerful. It is easy to use and reduces the requirement of any external library for sorting.
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.
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. Hope you have got a good brief of the javascript sort()
function by now.
Next we are going to declare a sample object that we will use in our solution.
Sample array of objects
This is the sample javascript object we are going to use in our next examples.
1let cars= [2 {3 name: 'Swift',4 batchNumber: 391,5 mfgDate: 'July 1, 2019'6 },7 {8 name: 'Corolla',9 batchNumber: 142,10 mfgDate: 'January 19, 2019'11 },12 {13 name: 'Zen',14 batchNumber: 213,15 mfgDate: 'March 23, 2019'16 }17];
For ease of understanding we have declared a simple array of objects here. Make sure to check the objects you will receive in your programs.
Sort array of objects in javascript by a string property
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.
1cars.sort((a, b) => { 2
3 if (a.name < b.name) { 4 return -1; 5 } 6 if (a.name > b.name) { 7
8 return 1; 9
10 } 11
12 return 0; 13
14});
Result array:
1let cars= [2 {3 name: 'Corolla',4 batchNumber: 142,5 mfgDate: 'January 19, 2019'6 },7 {8 name: 'Swift',9 batchNumber: 391,10 mfgDate: 'July 1, 2019'11 },12 {13 name: 'Zen',14 batchNumber: 213,15 mfgDate: 'March 23, 2019'16 }17 ];
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:
1let cars= [2
3 {4 name: 'Corolla',5 batchNumber: 142,6 mfgDate: 'January 19, 2019'7 },8 {9 name: 'Zen',10 batchNumber: 213,11 mfgDate: 'March 23, 2019'12 },13 {14 name: 'Swift',15 batchNumber: 391,16 mfgDate: 'July 1, 2019'17 }18];
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:
1let cars= [2
3 {4 name: 'Corolla',5 batchNumber: 142,6 mfgDate: 'January 19, 2019'7 },8 {9 name: 'Zen',10 batchNumber: 213,11 mfgDate: 'March 23, 2019'12 },13 {14 name: 'Swift',15 batchNumber: 391,16 mfgDate: 'July 1, 2019'17 }18];
These are the 3 ways to sort array of objects in javascript by its key or property value. Please comment if you need any brief.
Happy to help.