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)

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) {
   // ...
}Code language: JavaScript (javascript)

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}`);
});
Code language: JavaScript (javascript)

Output:

Ana 75
John 80
Zion 90

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);Code language: JavaScript (javascript)

The sort() method uses the following comparator function:

(a, b) => a.score - b.scoreCode language: PHP (php)

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}`);
});
Code language: JavaScript (javascript)

Output:

Zion 90
John 80
Ana 75

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}`);
});Code language: JavaScript (javascript)

Output:

Ana
John
Zion

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}`);
});Code language: JavaScript (javascript)

Output:

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

Summary

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