JavaScript provides several methods to sort arrays.
In this tutorial, you will learn about JavaScript Sorting Arrays using our interactive Code Editor.
Let's dive in 🏊
Sorting an Array
sort(): This method sorts the elements of an array in place and returns the sorted array. By default, it sorts the array in ascending order.
Example:
const fruits = ["apple", "banana", "cherry", "date"];
fruits.sort();
console.log(fruits);
To sort the array in descending order, you can provide a compare function as follows:
const numbers = [4, 2, 1, 3];
numbers.sort((a, b) => b - a);
console.log(numbers);
Reversing an Array
reverse(): This method reverses the order of the elements in an array in place.
Example:
const numbers = [1, 2, 3, 4];
numbers.reverse();
console.log(numbers);
Concating an Array
concat(): This method joins two or more arrays and returns a new array.
Example:
const fruits1 = ["apple", "banana"];
const fruits2 = ["cherry", "date"];
const fruits3 = ["elderberry"];
const allFruits = fruits1.concat(fruits2, fruits3);
console.log(allFruits);
concat() does not sort the resulting array.
Slicing an Array
slice(): This method returns a portion of an array as a new array.
Example:
const numbers = [1, 2, 3, 4];
const slicedNumbers = numbers.slice(1, 3);
console.log(slicedNumbers);
slice() does not sort the resulting array.
indexOf() an Array
indexOf(): This method returns the index of the first occurrence of a specified element in an array. If the element is not found, it returns -1.
Example:
const fruits = ["apple", "banana", "cherry", "date"];
const index = fruits.indexOf("banana");
console.log(index);
lastIndexOf() of an Array
lastIndexOf(): This method returns the index of the last occurrence of a specified element in an array. If the element is not found, it returns -1.
Example:
const fruits = ["apple", "banana", "cherry", "date", "banana"];
const index = fruits.lastIndexOf("banana");
console.log(index);
Sorting an Array in Random Order
To sort an array in a random order, you can use the sort() method with a compare function that returns a random value of -1, 0, or 1.
This will cause the elements of the array to be rearranged in a random order.
Example:
const numbers = [1, 2, 3, 4, 5];
numbers.sort(() => Math.random() - 0.5);
console.log(numbers);
In this example:
- The compare function returns a random value between -0.5 and 0.5 for each pair of elements being compared.
- This causes the
sort() method to rearrange the elements of the array in a random order.
Note that randomly sorting an array using the method described may not produce a perfectly uniform distribution of permutations. For a more rigorous and uniform way of shuffling an array, consider using a library like Lodash, which offers a shuffle() method.
Using Math.max() on an Array
The Math.max() method is used to find the maximum value of a set of numbers. However, it cannot be used directly on an array.
To find the maximum value of an array, you need to use the apply() method to pass the array as the this value, and as an argument to the Math.max() method.
Example:
const numbers = [10, 5, 8, 3, 9];
const maxNumber = Math.max.apply(null, numbers);
console.log(maxNumber);
In this example:
- The
apply() method is used to call the Math.max() method with the this value set to null (since Math.max() does not use this), and the numbers array as the arguments. - This causes the
Math.max() method to return the maximum value of the array.
Alternatively, in ES6 you can use the spread operator to pass the array as separate arguments to the Math.max() method:
const numbers = [10, 5, 8, 3, 9];
const maxNumber = Math.max(...numbers);
console.log(maxNumber);
This achieves the same result as using apply() with the spread operator ... to pass the array as arguments to the Math.max() method.
Using Math.min() on an Array
Similar to Math.max(), the Math.min() method is used to find the minimum value of a set of numbers, and cannot be used directly on an array. To find the minimum value of an array, you can use the apply() method to pass the array as the this value, and as an argument to the Math.min() method.
As an example:
const numbers = [10, 5, 8, 3, 9];
const minNumber = Math.min.apply(null, numbers);
console.log(minNumber);
In this example:
- The
apply() method is used to call the Math.min() method with the this value set to null (since Math.min() does not use this), and the numbers array as the arguments. - This causes the
Math.min() method to return the minimum value of the array.
Alternatively, in ES6 you can use the spread operator to pass the array as separate arguments to the Math.min() method:
const numbers = [10, 5, 8, 3, 9];
const minNumber = Math.min(...numbers);
console.log(minNumber);
This achieves the same result as using apply() with the spread operator ... to pass the array as arguments to the Math.min() method.
Sorting Object Arrays
Sorting an array of objects in JavaScript requires defining a compare function that specifies how the objects should be compared.
The sort() method can then be called on the array and passed the compare function as an argument.
Example:
const people = [
{name: "John", age: 35},
{name: "Mary", age: 28},
{name: "Bob", age: 45},
{name: "Alice", age: 30},
];
people.sort((a, b) => a.age - b.age);
console.log(people);
In this example:
- The
people array contains objects with name and age properties. The sort() method is called on the array with a compare function that compares the age property of each object. - The function returns a negative value if
a should come before b, zero if they are equal, and a positive value if b should come before a. - This causes the
sort() method to rearrange the objects in the array in ascending order of age.
To sort in descending order, you can simply reverse the order of the comparison:
people.sort((a, b) => b.age - a.age);
console.log(people);
This causes the sort() method to rearrange the objects in the array in descending order of age.