How to Sort Numeric Array using JavaScript ?

The JavaScript Array.sort() method is used to sort the array elements in place and returns the sorted array. This function sorts the elements in string format. It will work well for string arrays but not for numbers. For example: if numbers are sorted as strings then “75” is bigger than “200”.

Example 1: In this example, the Array sort() method is implemented. The array is sorted as a string.

Javascript

let arr = [12, 25, 31, 23, 75, 81, 100]
console.log(arr.sort())

Output

[
  100, 12, 23, 25,
   31, 75, 81
]

Example 2: This example sorts the array elements in string format. 

javascript

// Declare and initialize original array
let marks = [12, 25, 31, 23, 75, 81, 100];

// Print Before Sorting Array
console.log("Original Array");
console.log(marks);

// Call sort function
marks.sort();

console.log("After Sorting in Ascending Order");

// Print Sorted Numeric Array
console.log(marks);

Output

Original Array
[
  12, 25,  31, 23,
  75, 81, 100
]
After Sorting in Ascending Order
[
  100, 12, 23, 25,
   31, 75, 81
]

Then, how to sort number array elements?

There are two approaches to sorting the number array in ascending order:

Approach 1: Using Compare Function

We can create a Compare function that returns negative, zero, or positive values. 

Syntax:

function(a, b){return a - b}

• Negative Value ( a < b) => a will be placed before b
• zero value (a == b) => No Change
• Positive Value (a > b ) => a will be placed after b

Example: This example uses compare function to sort the array elements in ascending order. 

javascript

// Declare and initialize an Array
let marks = [12, 25, 31, 23, 75, 81, 100];

// Print Before sorting array
console.log("Original Array");
console.log(marks);

// Sort elements using compare method
marks.sort(function (a, b) { return a - b });

console.log("After sorting in Ascending order");

// Print sorted Numeric array
console.log(marks);

Output

Original Array
[
  12, 25,  31, 23,
  75, 81, 100
]
After sorting in Ascending order
[
  12, 23,  25, 31,
  75, 81, 100
]

Now, we would like to sort the array in Descending order then we have to change the compare function.

Syntax:

function(a, b){return b - a}

• Negative Value ( b < a) => a will be Placed after b
• zero value (a == b) => No Change
• Positive Value (b > a ) => a will be placed before b

Example: This example uses compare function to sort the array elements in descending order. 

javascript

// Declare and initialize an Array
let marks = [12, 25, 31, 23, 75, 81, 100];

// Print Before sorting array
console.log("Original Array");
console.log(marks);

// Sort elements using compare method
marks.sort(function (a, b) { return b - a });

console.log("After sorting in Descending order");

// Print sorted Numeric array
console.log(marks);

Output

Original Array
[
  12, 25,  31, 23,
  75, 81, 100
]
After sorting in Descending order
[
  100, 81, 75, 31,
   25, 23, 12
]

Approach 2: Creating Loops

We can also use loops to sort the array elements. Here, we will use bubble sort (a simple sorting technique) to sort the array elements in ascending order.

Example: In this example, we are creating loops

javascript

// Sorting function
function Numeric_sort(ar) {
    let i = 0, j;
    while (i < ar.length) {
        j = i + 1;
        while (j < ar.length) {

            if (ar[j] < ar[i]) {
                let temp = ar[i];
                ar[i] = ar[j];
                ar[j] = temp;
            }
            j++;
        }
        i++;
    }
}

// Original Array
let arr = [1, 15, 10, 45, 27, 100];

// Print Before sorting array
console.log("Original Array");
console.log(arr);

// Function call
Numeric_sort(arr);

console.log("Sorted Array");

// Print sorted Numeric array
console.log(arr);

Output

Original Array
[ 1, 15, 10, 45, 27, 100 ]
Sorted Array
[ 1, 10, 15, 27, 45, 100 ]