by Sai gowtham

How to sort the array of objects by key in JavaScript

JavaScript has an inbuilt sort method which helps us to sort the array of the objects easily; we don’t need to write our own custom sort methods.

consider we have an array of objects with name and price properties.

const vegetables =  [

    {name:"beans",price: 5},
    {name:"tomato",price: 3},
    {name:"pumpkin",price: 2},
    {name:"broccoli",price: 7},
]

We need to sort the vegetables array in ascending order by using its price property.

example:

const vegetables =  [

     {name:"beans",price: 5},
     {name:"tomato",price: 3},
     {name:"pumpkin",price: 2},
     {name:"broccoli",price: 7},
]


console.log(vegetables.sort((a,b) =>  a.price-b.price ))
output - >

[
  {name: "pumpkin", price: 2},
  {name: "tomato", price: 3},
  {name: "beans",  price: 5},
  {name: "broccoli", price: 7}
]

Array.sort() : The sort method takes the callback function as its argument and returns the sorted array.

The return condition inside the callback function.

  • if our return condition is a - b then it sorts the array in ascending order.
  • if our return condition is b - a then it sorts the array in descending order.

Let’s sort our vegetables array in descending order.

console.log(vegetables.sort((a,b) =>  b.price-a.price ))
output- >

[
  {name: "broccoli",price: 7},
  {name: "beans",price: 5},
  {name: "tomato",price: 3},
  {name: "pumpkin",price: 2}
]

Top Udemy Courses

JavaScript - The Complete Guide 2020 (Beginner + Advanced)
JavaScript - The Complete Guide 2020 (Beginner + Advanced)
45,614 students enrolled
52 hours of video content
View Course
React - The Complete Guide (incl Hooks, React Router, Redux)
React - The Complete Guide (incl Hooks, React Router, Redux)
284,472 students enrolled
40 hours of video content
View Course
Vue JS 2 - The Complete Guide (incl. Vue Router & Vuex)
Vue JS 2 - The Complete Guide (incl. Vue Router & Vuex)
130,921 students enrolled
21 hours of video content
View Course