22 Votes

JavaScript: Sort Array of Numbers

Tutorial by Stefan Trost | Last update on 2023-11-23 | Created on 2012-06-08

JavaScript makes it easy for us, to sort an array. If we have an arbitrary array, it is enough to use the function sort() in the following way to sort the array:

var ArrA = ['D','A','C','B'];
ArrA.sort();
alert(ArrA);
// output: 'A,B,C,D'

However, there may occur problems, if we have an array of numbers. What happens if we apply the function from above to an array of numbers?

var ArrB = [120,30,22,4,60];
ArrB.sort();
alert(ArrB);
// output: '120,22,30,4,60'

It seems that the numbers are not sorted correctly. The problem lies in the lexical sort algorithm of the sort() function. Sort() first looks at the first letter of the string that is passed to it and then arranges the strings corresponding to the next letters.

Accordingly, in the example with array ArrB, first comes the element 120, then 22 and then 30, because the first characters of these strings are 1, 2 and 3.

Sort array numerically

You can pass a function as a parameter to sort(), which specifies how elements will be sorted. That is exactly what we need now, to define ourself how two items of the array should be sorted. We take a look at the following examples:

var ArrC = [120,30,22,4,60];

//Example 1
ArrC.sort(function(a,b){return a-b});
alert(ArrC); // output: 4,22,30,60,120 

//Example 2
ArrC.sort(function(a,b){return b-a});
alert(ArrC); // output: 120,60,30,22,4

//Example 3
function SortNum (a,b) { return a-b; }

ArrC.sort(SortNum);
alert(ArrC); // output: 4,22,30,60,120

ArrC.reverse();
alert(ArrC); // output: 120,60,30,22,4

In the first example, we pass a function as a parameter to sort(). The passed function must be able to accept two parameters. During the sorting process, this function will always be called with the two values that are being compared. The function can now return 0 or positive or negative values. If the returned value is greater than 0, then a should be higher sorted than b. If the returned value is less than 0, then b should be higher sorted than a. If the return value is 0, a is equal to b. And that is exactly what our function "return a-b" performs. So, we get back a sorted array in ascending order.

In the second example, we habe written "a-b" instead of "b-a". With this, the array turns around and we get back a descending sorted array

Example 3 shows an alternative way to accomplish the same thing: We have first defined the function "NumSort" and later on we are passing it. So, we do not have to write the function into the brackets and we can define it outside. Here is the advantage for very long functions, we are also calling for several times. The function reverse() can mirror an array completely. That is what we do after we have sorted the array with our NumSort() function to achieve our descending order in this example. So, we do not need to define a separate opposite function.

Arbitrary sort functions

The example shows: As a sort function, we can not only use simple functions like "a-b". Also, arbitrary other functions are possible, they only have to return 0 or a positive or negative value depending on whether the passed two values are equal, greater or less.

Let your imagination run wild and create the sorting function you need, for example also with if-nesting or any other code you need.

ReplyPositiveNegative

About the Author

AvatarYou can find Software by Stefan Trost on sttmedia.com. Do you need an individual software solution according to your needs? - sttmedia.com/contact
Show Profile

 

Related Topics

Important Note

Please note: The contributions published on askingbox.com are contributions of users and should not substitute professional advice. They are not verified by independents and do not necessarily reflect the opinion of askingbox.com. Learn more.

Participate

Ask your own question or write your own article on askingbox.com. That’s how it’s done.