JavaScript Sort Array Method

By onjsdev

Jan 2nd, 2024

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

Let's explain it with examples.

Sort Numbers In Ascending Order

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 without using any parameters or a callback function

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

Sort Strings In Ascending Order

You 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 you want to sort the elements in the array in descending order, you 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:

Negative number the first element should come before the second element,
Positive number the first element should come after the second element
Zero this means two elements are equal.

For example:

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 Array Of 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, you can also pass a comparator function that compares two objects based on a specific property of the objects.

For example, if you 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 },
];

You 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 array of objects in the ascending and descending order with the help of comparator callback function.

If you want to learn more about Javascript array and string methods, you can check the following articles:

Thank you for reading.