javascript
  1. javascript-sort

JavaScript sort()

JavaScript sort() method is used to sort an array in ascending or descending order. It takes either no argument or a comparison function as an argument. This method modifies the original array and returns it sorted.

Syntax

array.sort(compareFunction)
  • Parameter: Optional. A function that defines the sort order. If not specified, the array is sorted based on string Unicode point values, which means '9' is sorted before '80'.
  • Return value: The sorted array in ascending order.

Example

const arr = [5, 1, 3, 2, 4];

// sort in ascending order
arr.sort();
console.log(arr); // Output: [1, 2, 3, 4, 5]

// sort in descending order
arr.sort((a, b) => b - a);
console.log(arr); // Output: [5, 4, 3, 2, 1]

Output

The sort() method sorts the elements of the array in place. The original array is modified and the sorted array is returned as the result.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Sort Function Example</title>
</head>
<body>

<!-- Display the results in these elements -->
<div id="ascendingResult"></div>
<div id="descendingResult"></div>

<script>
  // Sample array
  const arr = [5, 1, 3, 2, 4];

  // Sort in ascending order
  const ascendingArr = [...arr].sort((a, b) => a - b);

  // Display the result in ascending order on the page
  const ascendingResultElement = document.getElementById('ascendingResult');
  ascendingResultElement.innerHTML = `<p>Sorted in ascending order: ${ascendingArr}</p>`;

  // Sort in descending order
  const descendingArr = [...arr].sort((a, b) => b - a);

  // Display the result in descending order on the page
  const descendingResultElement = document.getElementById('descendingResult');
  descendingResultElement.innerHTML = `<p>Sorted in descending order: ${descendingArr}</p>`;
</script>

</body>
</html>
Try Playground

Explanation

The sort() method can be called with or without a compareFunction. Without a compareFunction, the sort() method sorts the array elements in place based on their Unicode code points converted to strings. This means that the array is sorted by string values, which may not be the desired outcome when sorting numbers.

Using a compareFunction allows for custom sorting based on specific criteria. The compareFunction should return a negative value if a should be sorted before b, a positive value if a should be sorted after b, and zero if a and b are equal.

In the example above, the array is sorted in ascending order by default, and in descending order using a compareFunction.

Use

The sort() method is useful for sorting arrays of numbers or strings. It can also be used to sort arrays of objects by passing a compareFunction that compares object properties.

Important Points

  • The sort() method modifies the original array.
  • By default, it sorts elements based on Unicode code points converted to strings.
  • A compareFunction can be passed to the method to customize sorting order.
  • compareFunction should return negative, positive, or zero based on sorting criteria.

Summary

The sort() method is a powerful tool for sorting array elements in ascending or descending order. It can be used with or without a compareFunction, allowing for custom sorting based on specific criteria. It modifies the original array and returns the sorted array as the result.

Published on: