Sorting a JavaScript array using array.sort()
Last Updated: Aug 17th, 2016
Sorting arrays in JavaScript is done via the method
array.sort()
, a method that's probably as much misunderstood as it is
underestimated. While calling sort()
by itself simply sorts the
array in lexicographical (aka alphabetical) order, the sky's really the
limit once you go beyond the surface.
Sorting an array in lexicographical order
Sorting an array lexicographically (aka "alphabetically" or
in dictionary order) is easy to do. Just call array.sort()
without any parameters passed in:
//Sort alphabetically and ascending: var myarray=["Bob", "Bully", "Amy"] myarray.sort() // Array now becomes ["Amy", "Bob", "Bully"]
Notice that the order is ascending. To make it descending
instead, the simplest way is to enlist the help of another Array method in
combination, array.reverse()
:
//Sort alphabetically and descending: var myarray=["Bob", "Bully", "Amy"] myarray.sort() myarray.reverse() //Array now becomes ["Bully", "Bob", "Amy"]
Now, before you start feeling comfortable, consider what
happens if we call array.sort()
on an array consisting of
numbers:
var myarray=[7, 40, 300] myarray.sort() //Array now becomes [300,40,7]
Although 7 is numerically smaller than 40 or 300,
lexicographically, it is larger, so 7 appears at the very right of the
sorted array. Remember, by default array.sort()
sorts its
elements in lexicographical order.
And there you have it with array.sort()
in
terms of its basic usage. But there's a lot more to this method than meets
the eye. Array.sort()
accepts an optional parameter in the form
of a function reference that pretty much lets you sort an array based on any
custom criteria, such as sort an array numerically or shuffle it (randomize
the order of its elements).
Passing in a function reference into array.sort()
As touched on already,
array.sort()
accepts an optional parameter in the form of a function
reference (lets call it sortfunction
). The format of this
function looks like this:function sortfunction(a, b){ //Compare "a" and "b" in some fashion, and return -1, 0, or 1 } array.sort(sortfunction)
When such a function is passed into array.sort()
, the array
elements are sorted based on the relationship between each pair of elements
"a
" and "b
" and the function's return value. The
three possible return numbers are: <0
(less than 0), 0
,
or >0
(greater than 0):
- Less than 0: Sort "
a
" to be a lower index than "b
" - Zero: "
a
" and "b
" should be considered equal, and no sorting performed. - Greater than 0: Sort "
b
" to be a lower index than "a
".
To sort an array numerically and ascending for example, the body of your function would look like this:
function sortfunction(a, b){ //causes an array to be sorted numerically and ascending return (a - b) }
Sorting an array in numerical order
To sort an array in numerical order, simply pass a custom
sortfunction
into array.sort()
that returns the
difference between "a
" and "b
", the two parameters
indirectly/ automatically fed into the function:
//Sort numerically and ascending: var myarray=[25, 8, 7, 41] myarray.sort(function(a,b){ //Array now becomes [7, 8, 25, 41] return a - b })
This works the way it does because whenever "a
"
is less than "b
", a negative value is returned, which results
in the smaller elements always appearing to the left of the larger ones, in
other words, ascending. Note that we defined our sort function in this case
directly inside the sort()
method as an anonymous function,
instead of creating an explicit function and passing it into sort()
-
both accomplish the same thing.
Sort an array numerically but descending isn't much
different, and just requires reversing the two operands "a
" and
"b
":
//Sort numerically and descending: var myarray=[25, 8, 7, 41] myarray.sort(function(a,b){ //Array now becomes [41, 25, 8, 7] return b - a })
Shuffling (randomizing) the order of an array
To randomize the order of the elements within an array, what
we need is the body of our sortfunction
to return a number that
is randomly <0
, 0
, or >0
,
irrespective to the relationship between "a
" and "b
".
The below will do the trick:
//Randomize the order of the array: var myarray=[25, 8, "George", "John"] myarray.sort(function(){ //Array elements now scrambled return 0.5 - Math.random() })
Interactive Demo: Sorting or randomizing the elements of an array.
As you can see, there is a lot more to array.sort()
than many may think. In fact, you can even sort arrays that contain more
than just primitive values, but objects with properties. Lets see that next.
- Tutorial introduction
- Sorting an Array of Objects
- Example- Numbers and Words Sorter