Search Here

JavaScript Sorting Array | sort(), reverse() with examples

JavaScript Sorting Array | sort(), reverse() with examples

Let us consider a list of items such as [15,12,19,26,21] and we want to sort these items in ascending or descending order this can be achieved
using Array Sort Methods. These methods are created while creating an array object or on the declaration.

Let us look at some of the Array Sorting Methods.

array.sort() Method

Let a look at simple sort method.

    var num = [6,2,1,5,8];
    num.sort();

    //Console Output
    (5) [1, 2, 5, 6, 8]

In array num by default sort() sorts items into ascending order.

Let us look at another example by sorting student names in ascending order.

    var students = ["Yashwant", "Ramesh", "Abhishek", "Abhilash", "Lokesh"];
    students.sort();

    //Console Output
    (5) ["Abhilash", "Abhishek", "Lokesh", "Ramesh", "Yashwant"]

As you can see name initialization we have specified “Abhilash” after “Abhishek” but in output, we get “Abhilash” because of letter order.
The sort method also checks by letter ordering.
We can take the same above example and represent it in if-else a statement.

    var students = ["Yashwant", "Ramesh", "Abhishek", "Abhilash", "Lokesh"];
    if(students[0]>students[2]){ //ie Yashwant > Abhishek
        console.log("Yes name Yashwant greater than Abhishek");
    }else{
        console.log("No name Yashwant not greater than Abhishek");
    }

JavaScript Array Sort | conditional checking of alphabets in array by specifying its index number

array.reverse() Method

This method reverses the array.As sort() method sorts array items to ascending order calling reverse() method on sort() like sort().reverse() does the opposite of that it orders items in descending order.

Let us look at a simple example

    var salary = [5025.23, 4269.65, 8965.6, 2569.12];
    salary.sort().reverse();

    //Console Output
    (4) [8965.6, 5025.23, 4269.65, 2569.12]

Sorting Array Items using Functions

Till now you have learnt about sorting items in the order. But there could be a scenario where you would want to specify a custom function for sorting in such case we must call the function with arguments inside the sort() method.
Few such examples are given below

    var num = [6,2,1,5,8];
    num.sort(function(a,b){
        if(a<b){ return -1; // -1 means don't change let it be the same }else if(a>b){
            return 1;
        }else {
            return 0;
        }
    });
    console.log(num);

    //Console Output
    (5) [1, 2, 5, 6, 8]

The above example there is an anonymous function inside sort() method which has two arguments.
In the function, we check if the value of a lesser than that of b if the condition is true we return -1. -1 means do nothing it will not make changes in item order.
Next, we check if a greater than b if the condition is true we return 1 which means that this item must be reordered. Lastly, it does not match with any above conditions than we return 0.

Some more example related to sorting using functions

Sorting in descending order

    var num = [6,2,1,5,8];
    num.sort(function(a,b){
        if(a<b){ return 1; }else if(a>b){
            return -1;
        }else {
            return 0;
        }
    });
    console.log(num);

    //Console Output
    (5) [8, 6, 5, 2, 1]

Sorting Student names in ascending order

    var students = ["Yashwant", "Ramesh", "Abhishek", "Abhilash", "Lokesh"];
    students.sort(function(x,y){
        if(x>y){
            return 1;
        }else if(x<y){
            return -1;
        }else {
            return 0;
        }
    });
    console.log(students);

    //Console Output
    (5) ["Abhilash", "Abhishek", "Lokesh", "Ramesh", "Yashwant"]

Sorting Student names in descending order

    var students = ["Yashwant", "Ramesh", "Abhishek", "Abhilash", "Lokesh"];
    students.sort(function(x,y){
        if(x>y){
            return -1;
        }else if(x<y){
            return 1;
        }else {
            return 0;
        }
    });
    console.log(students);

    //Console Output
    (5) ["Yashwant", "Ramesh", "Lokesh", "Abhishek", "Abhilash"]