JavaScript Array Methods: Array.sort() Method

The Array.sort() methods sorts the array in alphabetical order by default, or you can pass in a custom sort function.

So let's say you have an array of names that's our of order that you want to sort.

    <script>
        var names = ["zack", "jim", "bob", "adam", "jason"];
    </script>

If we call the names.sort() method we would get resulting array in Alphabetical order












This is fine since all the names are in lowercase letters, so what if some of the names are capitalized? What do you think will happen if you have the following array defined instead?

 
    <script>
        var names = ["Zack", "jim", "bob", "adam", "Jason"];
    </script>

If we call the names.sort() method again the capitalized names will get sorted first because of precedence.  Capitalize strings  get sorted before lowercase strings and the resulting array will be the following.







It's not what you were expecting was it?  So how would we sort the above array in the order that is alphabetical?  We can do it by passing in a function that would first convert the array values into lowercase names first.  Don't worry it would not change the values in the array to lowercase names, it just converts it to lowercase value in the function so that it could do the sort.  So you write the sort function as the following.

names.sort(function (n1, n2) { 
            var a = n1.toLowerCase();
            var b = n2.toLowerCase();
            if (a < b) return -1;
            if (a > b) return 1;
            return 0;
        });

The resulting sort will output the following in the console












The code above returns a negative value if the first argument is less than the second argument, which equates to false, and returns a positive value if the first argument is greater than the second, which equates to true.

So "jason" is greater than "zack", and "adam" is greater than "zack" and so on until all the elements are sorted correctly.

Finally, when it comes to sorting numbers things can get a little confusing.  Let's say you have an array of small numbers from 5 to 1

var numbers = [5,4,3,2,1];

If you call the numbers.sort() method you will get the expected result of 1 to 5.








However, in JavaScript alphabetical order means that the larger numbers gets sorted first if it's 100 or larger.  So if you have the numbers array of

var numbers = [5,4,3,200,1000];

If you call the numbers.sort() method now, the number 1000 will be sorted first.








I am pretty sure that was not the result that you wanted.  So how do we get the sort that we want from the smallest value to the biggest?  By passing in a function into the sort() method.  In the following function compares the first argument to the second argument.  If it first argument should appear then return value should return a number that is negative.  If the second argument should appear then the return value should be a positive number.









Or you can do the reverse with the following