Sort array of objects by key value in JavaScript
To sort an array of objects by a specific key value in JavaScript, you can use the sort()
method along with a comparison function that compares the values of the key for each object.
Example: Sort array of objects by key value
// array of objects const fruits = [ { name: 'banana', price: 3 }, { name: 'apple', price: 2 }, { name: 'orange', price: 4 }, { name: 'grape', price: 1 } ];
// sort by price (ascending) fruits.sort((a, b) => a.price - b.price);
// output the sorted array console.log(fruits);
// Output: [{"name":"grape","price":1},{"name":"apple","price":2},{"name":"banana","price":3},{"name":"orange","price":4}]
In the above example, the sort()
method is used to sort the fruits
array by the price
key. The comparison function (a, b) => a.price - b.price
compares the price
values of each object in the array and returns a negative number if the first object’s price is less than the second, a positive number if the first object’s price is greater than the second, or zero if the prices are equal. This causes the sort()
method to order the objects in ascending order based on their price
values.
You can modify the comparison function to sort the array by other keys or in descending order by reversing the sign of the comparison result.
Here are some more examples of sorting an array of objects by key value in JavaScript:
Example 1: Sorting by numeric values
const people = [
{ name: 'John', age: 25 },
{ name: 'Jane', age: 30 },
{ name: 'Bob', age: 20 },
{ name: 'Sarah', age: 27 }
];
// Sort by age
const sortedPeople = people.sort((a, b) => a.age - b.age);
console.log(sortedPeople);
// Output: [{name: 'Bob', age: 20}, {name: 'John', age: 25}, {name: 'Sarah', age: 27}, {name: 'Jane', age: 30}]
Example 2: Sorting by string values
const fruits = [
{ name: 'banana', price: 0.5 },
{ name: 'apple', price: 0.6 },
{ name: 'grape', price: 0.4 },
{ name: 'orange', price: 0.3 }
];
// Sort by name
const sortedFruits = fruits.sort((a, b) => a.name.localeCompare(b.name));
console.log(sortedFruits);
// Output: [{name: 'apple', price: 0.6}, {name: 'banana', price: 0.5}, {name: 'grape', price: 0.4}, {name: 'orange', price: 0.3}]
Example 3: Sorting by date values
const events = [
{ name: 'Meeting', date: new Date('2023-02-15T10:30:00.000Z') },
{ name: 'Conference', date: new Date('2023-02-18T14:00:00.000Z') },
{ name: 'Webinar', date: new Date('2023-02-12T16:30:00.000Z') },
{ name: 'Workshop', date: new Date('2023-02-20T09:00:00.000Z') }
];
// Sort by date
const sortedEvents = events.sort((a, b) => a.date - b.date);
console.log(sortedEvents);
// Output: [{name: 'Webinar', date: '2023-02-12T16:30:00.000Z'}, {name: 'Meeting', date: '2023-02-15T10:30:00.000Z'}, {name: 'Conference', date: '2023-02-18T14:00:00.000Z'}, {name: 'Workshop', date: '2023-02-20T09:00:00.000Z'}]
Example 4: Sorting by boolean values
const tasks = [
{ name: 'Task 1', completed: false },
{ name: 'Task 2', completed: true },
{ name: 'Task 3', completed: false },
{ name: 'Task 4', completed: true }
];
// Sort by completed status
const sortedTasks = tasks.sort((a, b) => a.completed - b.completed);
console.log(sortedTasks);
// Output: [{name: 'Task 1', completed: false}, {name: 'Task 3', completed: false}, {name: 'Task 2', completed: true}, {name: 'Task 4', completed: true}]
That’s it for today.
Thank you for reading. Happy Coding..!!