JavaScript Sort – How To Use Sort Method in JavaScript
Author: Ihechikara Abba
You can use the sort()
method in JavaScript to sort the elements of an array in ascending order.
In this article, you’ll learn how to sort strings and numbers in JavaScript using the sort()
method.
sort()
Method Syntax in JavaScript
You can simply use dot notation to attach the sort()
method to a collection in order to sort it. Here’s what the syntax looks like:
array.sort(compareFunction)
In the syntax above, array
denotes the array to be sorted which is followed by the sort
method with a compareFunction
parameter. The compareFunction
is an optional parameter that is mostly used when sorting numbers.
Let’s take a look at some examples to help you understand the syntax.
Example #1 - How to Sort an Array of Strings in JavaScript
You can sort an array of strings in JavaScript using the sort()
method. Here’s how:
const users = ["John", "Doe", "Ihechikara", "Peter"]
users.sort()
console.log(users)
// [ "Doe", "Ihechikara", "John", "Peter" ]
In the code above, we created an array of strings called users
with four elements: “John”, “Doe”, “Ihechikara”, “Peter”. We then sorted the array using the sort()
method: users.sort()
.
The result was an array with its elements sorted in alphabetical and ascending order: “Doe”, “Ihechikara”, “John”, “Peter”.
Sorting strings is pretty straightforward. All you have to do is attach the sort()
method to the array name. As you’ll see in the next example, thing are a bit different with numbers.
Example #2 - How to Sort an Array of Numbers in JavaScript
In general, the sort()
method compares each value based on their Unicode value, and this applies to number too.
Consider the example below:
const numArr = [40, 6]
numArr.sort()
console.log(numArr)
// [ 40, 6 ]
In the code above, we have an array with three numbers — 2, 40, and 6. After sorting the array, the numbers remain the same and unsorted. Based on how the sort()
method works, the array has been sorted.
40 is placed before 6 in the sorted array because when their Unicode values are compared, the 4 in 40 comes before 6.
We can fix this using a compare function which evaluates the values of elements before placing them in specific positions.
How to Use the Compare Function to Sort an Array in JavaScript
Here’s what a compare function looks like:
function (a, b) {
return a - b
}
The two parameters in the function above — a
and b
— represents two elements being compared in the array.
- If
a - b
returns a value less than 0, thena
comes beforeb
. - If
a - b
returns a value greater than 0, thenb
comes beforea
. - If
a - b
returns a value 0, then the order ofa
andb
remains the same.
Now let’s use the compare function with an array of numbers:
const numArr = [40, 6, 2]
numArr.sort(function(a, b){ return a - b })
console.log(numArr)
// [ 2, 6, 40 ]
Passing the compare function as a parameter to the sort()
, we got a sorted array of numbers in ascending order. If you change the return statement of the compare function to b - a
then the sorted array will be in descending order.
Summary
In this article, we talked about the sort()
method in JavaScript. You can use it to sort an array in asceneding order.
The first example showed how to sort an array of strings in ascending order using the sort()
method.
We then saw another example that uses a compare function to sort an array of numbers in either ascending or descending order.
Happy coding! Check out my YouTube channel for tutorials about embedded systems, IoT, and web development.
You can find me on Twitter @Ihechikara2
Tag(s):