How to Sort an Array of Objects in JavaScript

Summary: in this tutorial, you will learn how to sort an array of objects by the values of the object’s properties.

Introduction to the Array sort() method #

The JavaScript Array object provides the sort() method that allows you to sort array items in place and returns the sorted array.

Here’s the syntax of the sort() method:

sort(comparator)Copy

In this syntax:

• comparator is an optional function that determines the order of items in the array.

The comparator function accepts two parameters a and b which are the elements of the array to compare:

function fn(a,b) {
   // ...
}Copy

The comparator function should return a number that will decide whether a is greater, lower, or equal to b:

• A negative number instructs the sort() function to place a before b.
• A positive number instructs the sort() function to place a after b.
• Zero or NaN instructs the sort() function to treat a and b are equal.

The sort() method returns the reference to the same original array with the items sorted. In other words, it modifies the order of items in the original array.

If you don’t want to return a copy of the original array with the item sorted, you can use the toSorted() method.

We’ll show you how to use the sort() method to sort an array of objects.

Sort an array of objects by numbers #

The following example shows how to sort an array of employee objects by scores in ascending order:

let employees = [
  { name: 'John', dob: 'Dec 15, 2007', score: 80 },
  { name: 'Ana', dob: 'Jan 15, 2009', score: 75 },
  { name: 'Zion', dob: 'Feb 15, 2011', score: 90 },
];

employees.sort((a, b) => a.score - b.score);

employees.forEach((e) => {
  console.log(`${e.name} ${e.score}`);
});Copy

Output:

Ana 75
John 80
Zion 90Copy

How it works.

First, declare an array of employee objects, where each object has the name, dob, and score properties.

Second, sort the employees by score using the sort() method:

employees.sort((a, b) => a.score - b.score);Copy

The sort() method uses the following comparator function:

(a, b) => a.score - b.scoreCopy

In this example, both a and b are employee objects that have name, dob, and score properties. The comparator function compares the score of two employee objects.

Sorting employees by scores in descending order #

To sort employees by scores in descending order, you need to modify the comparator function as follows:

let employees = [
  { name: 'John', dob: 'Dec 15, 2007', score: 80 },
  { name: 'Ana', dob: 'Jan 15, 2009', score: 75 },
  { name: 'Zion', dob: 'Feb 15, 2011', score: 90 },
];

employees.sort((a, b) => b.score - a.score);

employees.forEach((e) => {
  console.log(`${e.name} ${e.score}`);
});Copy

Output:

Zion 90
John 80
Ana 75Copy

Sort an array of objects by strings #

The following shows how to sort employees by name alphabetically:

let employees = [
  { name: 'John', dob: 'Dec 15, 2007', score: 80 },
  { name: 'Ana', dob: 'Jan 15, 2009', score: 75 },
  { name: 'Zion', dob: 'Feb 15, 2011', score: 90 },
];

employees.sort((a, b) => a.name.localeCompare(b.name));

employees.forEach((e) => {
  console.log(`${e.name} ${e.score}`);
});Copy

Output:

Ana
John
ZionCopy

Sort an array of objects by dates #

To sort the employees by date of birth (dob), you need to:

• Convert the dob from strings to Date objects.
• Sort the employees by dates.

The following code illustrates the idea:

let employees = [
  { name: 'John', dob: 'Dec 15, 2007', score: 80 },
  { name: 'Ana', dob: 'Jan 15, 2009', score: 75 },
  { name: 'Zion', dob: 'Feb 15, 2011', score: 90 },
];

employees.sort((a, b) => new Date(a.dob) - new Date(b.dob));

employees.forEach((e) => {
  console.log(`${e.name} ${e.dob}`);
});Copy

Output:

John - Dec 15, 2007
Ana - Jan 15, 2009
Zion - Feb 15, 2011Copy

Summary #

• Use the sort method with a comparator function to sort an array of objects by values of a specified property.