 # Sort Array In JavaScript - Complete Guide

In this tutorial, we are going to learn how to sort an array in JavaScript. We will learn how to sort an array in ascending, descending, or sort even objects.

1. sort Method in JavaScript
2. Sort array of numbers
3. Sort array in descending order
4. Sort array of strings
5. Sort array of objects

## sort Method In JavaScript

The sort() method is used to sort an array in ascending order by changing the positions of elements within the array itself. The method sorts the array and also returns the sorted array.

The `sort()` is a built-in method of JavaScript. It converts the array element into a string and then compares their UTF-16 code point values.

Let's see an example of the sort method.

### Working Of sort Method

The `sort()` method converts the array element into a string and then compare their UTF-16 code point values and position them in ascending order.

Note: UTF-16 code point values are the same as ASCII code point values, but the Unicode standard defines the code point values of characters in the range U+0000 to U+FFFF

Suppose we have 2 numbers 5 and 1 in an array. According to the UTF-16 code point values, 5 is greater than 1. So, the `sort()` method will move 5 after 1.

Here comes the tricky part! What happens if we also have 2 or higher digit numbers in the array, like 12, 56, 263, etc?

Take a test array: `arr = [5, 2, 12, 56, 263, 1]` and apply `arr.sort()`

You would be thinking that it will be sorted like:
`arr = [1, 2, 5, 12, 56, 263]`
but it will be sorted like:
`arr = [1, 12, 2, 263, 5, 56]`

Thinking how! 🤔

This happens because sort() method first compare the first digit of array element and sort according to that. If the first digit is the same, then it will compare the second digit and sort according to that. And so on.

Due to this reason, 12 is sorted before 2 because when you compare the first digit of both numbers then 1 comes before 2. So 12 is sorted before 2.

Applying the same logic you can understand why 263 is before 5 and 56.

Then what should you do to sort the array elements in increasing order of their number value?

To fix this you need to pass a compare function in the sort method.

### Compare Function

The `sort()` method accepts a function as an argument. It is called compare function.

``array.sort(compareFunction)``

The compare function determines the order of sorting the elements. It takes two arguments and returns a number. The number returned is used to sort the array.

``````function compareFunction(a, b) {
// ...
}``````

The 2 arguments accepted by the compare function are generally names as 'a' and 'b'.

At any moment of sorting the array, the compare function is called with two elements of the array where 'a' is a current element and 'b' is the next element in the array.

These 2 elements are compared and the following actions are taken:

1. If compareFunction(a, b) returns less than 0, then `sort()` method sorts a at lower index than b. Simply a will come before b.
2. If compareFunction(a, b) returns equal to 0, then `sort()` method leave the element positions as it is.
3. If compareFunction(a, b) returns greater than 0, then `sort()` method sorts a at greater index than b. Simply a will come after b.

Let's see an example:

## Sort Array Of Numbers

Now that we know how to use compare function, let's see how to sort an array of numbers.

Use the `sort()` method and pass a compare function to it.

It is not necessary to use an external function. You can also use an anonymous function.

Let's sort an array of numbers using the `sort()` method.

# Shorten the compare function

If array elements are numbers and are not `Infinity` then instead of returning on the base of 3 conditions as in the above example simply return `a - b` which will be equivalent to the above 3 conditions.

Example explained:

Let's check for the first 3 elements of the array. i.e `[61, 8, 20]`

```compareFunction(61 ,8); // return 53, a > b
compareFunction(61 ,20); // return 41, a > b
compareFunction(8 ,20); // return -12, a < b```

# Compare function as function expression

You can also define function expression within the `sort` method.

# Compare function as arrow function

Or you can define compare function using an arrow function.

Or simply you can write. (arrow function as function expression)

## Sort Array In Descending Order

How do you think about sorting an array in descending order?

One way to do this is to sort the array in ascending order and then reverse the array using the `reverse()` method.

But we can do this with a simple modification in compare function.

Just change the `return a - b` to `return b - a`.

## Sort Array Of String

Sorting string of array is very simple using JavaScript, just apply `sort()` method on the array of string and by default, it will sort an array of a string in ascending order.

# Reverse sort

To compare strings in reverse order use compare function. You need to change the logic of compare function and pass it to the `sort` method as shown in the code below.

### Sorting non-ASCII characters

To sort strings with non-ASCII characters, i.e. String from other languages é, è, a, ä, etc. Use `String.localeCompare`.

This function can compare non-ASCII characters so they appear in the right order.

## Javascript sort array of objects

To sort an array of objects you can not directly use the `sort()` method. You will have to use compare function to decide the order of objects depending on different property values.

Create a compare function and compare the property values of two objects. This compare function will be passed to the `sort()` method.

Here to sort an array of objects according to the age of an employee you can use `a.age - b.age` to compare 2 objects. See the complete code below.

Output using console.table ### javascript sort array of objects by key (joining date)

Let's sort the object on the basis of the joining date property.

Since 'joining' in the object is a string value, first convert the value of the joining string value to a date object and then use this in compare function to return value.

Output using console.table ### Sorting objects by string property

To sort the employee array by their name convert employee name to lowercase and pass it in compare function.

## Conclusion

JavaScript sort() method can be used to sort an array of numbers, strings, or objects. It can also be used to sort an array of objects by a property value. The compare function is used to decide the order of objects depending on different property values.

We have seen lots of examples that clarify our understanding of the sort() method.