Sorting Array Elements in Javascript

JavaScript has pretty powerful inbuilt functions to sort arrays. By default, the sort method sorts elements alphabetically. For example, 

Example

let arr1 = ["Zebra", "Bear", "Tiger"];
arr1.sort();
console.log(arr1);

Output

This will give the output −

[ 'Bear', 'Tiger', 'Zebra' ]

Now let's look at an int example, 

Example

let arr1 = [1, 8, 31, 21];
arr1.sort();
console.log(arr1);

Output

This will give the output −

[ 1, 21, 31, 8 ]

This is not what we expected. This is being output because by default the sort method sorts elements alphabetically. In order to sort according to our wish, we need to provide it a compare function that it'll apply 2 arguments to determine which is bigger and which is smaller and sort accordingly. So in order to sort an integer array, you should call −

Example

let arr1 = [1, 8, 31, 21];
arr1.sort((a, b) => a - b);
console.log(arr1);

Output

This will give the output &,minus;

[ 1, 8, 21, 31 ]

This can also be used to provide which keys should be used to sort in more complex cases like sorting object arrays. For example, 

Example

let people = [{
   name: "Zoe",
   age: 35
}, {
   name: "Richard",
   age: 21
}, {
   name: "Agnes",
   age: 25
}];
people.sort((a, b) => {
   let nameA = a.name.toUpperCase(); // ignore upper and lowercase
   let nameB = b.name.toUpperCase(); // ignore upper and lowercase
   if (nameA < nameB) {
      return -1;
   }
   if (nameA > nameB) {
      return 1;
   } // names must be equal
   return 0;
}) console.log(people)

Output

This will give the output −

[ { name: 'Agnes', age: 25 },
{ name: 'Richard', age: 21 },
{ name: 'Zoe', age: 35 } ]

Much more complex objects can also be sorted this way. Its all about how you structure your compare function.

As you've seen that this function sorts the array in place. In order to return a new sorted array while keeping the same order in this one, you could use the following to first create a copy then apply the sort.

output

arr.slice(0).sort();

Samual Sam

Published on 26-Jun-2018 14:17:19

• Related Questions & Answers
• Count unique elements in array without sorting JavaScript
• Sorting array of exactly three unique repeating elements in JavaScript
• Sorting array according to increasing frequency of elements in JavaScript
• Sorting array based on increasing frequency of elements in JavaScript
• Sorting elements of stack using JavaScript
• Sorting an array including the elements present in the subarrays in JavaScript
• JavaScript array sorting by level
• Uneven sorting of array in JavaScript
• Sorting Array based on another array JavaScript
• Sorting odd and even elements separately JavaScript
• Sorting Array with JavaScript reduce function - JavaScript
• Sorting Array without using sort() in JavaScript
• Sorting an array by date in JavaScript
• Sorting parts of array separately in JavaScript
• Sorting an array by price in JavaScript