JavaScript Sort Array Method


By onjsdev

JavaScript provides sort method that allows us to easily rearrange the elements of an array in a specific order. The sort() method can be used to sort numbers and strings in an array in ascending or descending order.

Let's explain it with examples.

Sort Numbers In Ascending Order

In javascript, by default, the sort method sorts the elements of an array in ascending order, according to their Unicode code points. For example, To sort the following array of numbers in ascending order using the sort method, we can simply call it on the array:

let numbers = [4, 2, 9, 1, 3];
numbers.sort();
console.log(numbers);
// [1, 2, 3, 4, 9]

The sort method mutate the original array.

Sort Strings In Ascending Order

We can also sort strings in ascending order, for example, if we have an array of strings like this:

const fruits = ["apple", "banana", "cherry", "date"];
fruits.sort();
console.log(fruits)
// ["apple", "banana", "cherry", "date"]

The fruits array will be sorted in ascending order based on the Unicode values of the elements.

Sort Method In Descanding Order

If we want to sort the elements of the array in descending order, we can pass a comparator function to the sort() method. The compare function takes two arguments a and b, which represent two elements of the array being sorted.

If this function return:

  • A negative number the first element should come before the second element,
  • A positive number the first element should come after the second element
  • Zero this means two elements are equal.
let numbers = [4, 2, 9, 1, 3];
function compare(a, b) {
  return b - a;
}
numbers.sort(compare);
console.log(numbers)
// [9, 4, 3, 2, 1]

Sort Strings In Descanding Order

To sort an array of strings in descending order, you can also use the sort() method in JavaScript with the custom compare function that compares two strings and returns a value that indicates their order.

An example of compare function with strings:

function compare(a, b) {
  if (a < b) {
    return 1; // a should come after b
  } else if (a > b) {
    return -1; // a should come before b
  } else {
    return 0; // a and b are equal
  }
}

In this example, the compare function takes two arguments a and b, which are two elements of the array being sorted.

  • If a is less than b, the function returns 1, indicating that a should come after b.
  • If a is greater than b, the function returns -1, indicating that a should come before b.
  • If a and b are equal, the function returns 0.

If you use this function with the sort method as shown in the following example,

const arr = ["banana", "apple", "orange", "grape"];
arr.sort(compare);
console.log(arr); // ["orange", "grape", "banana", "apple"]

The sort() method sorts the strings in the array in descending order.

The Sort Method with Objects

It can also be used to sort arrays of objects, which can be particularly useful when working with complex data structures.

When sorting an array of objects with the sort() method, we can pass a comparator function that compares two objects based on a specific property of the objects. For example, if we have an array of objects representing people like this:

const people = [
  { name: "John", age: 35 },
  { name: "Jane", age: 28 },
  { name: "Bob", age: 42 },
  { name: "Alice", age: 21 },
];

We can sort the array of objects by the age property using the following comparator function:

function sortByAge(a, b) {
  return a.age - b.age;
}
people.sort(sortByAge);

After calling this method, the people array will be sorted by age in ascending order, like this:

[
  { name: "Alice", age: 21 },
  { name: "Jane", age: 28 },
  { name: "John", age: 35 },
  { name: "Bob", age: 42 },
]

Conclusion

In conclusion, the sort method is a useful method that can be used to sort numbers, strings and objects in an array in ascending and descending order with the help of comparator callback function.

Thank you for reading.