JavaScript Array sort() and reverse()

In this post, we will discuss sort() and reverse() methods available in sort Array.

sort()

The sort() method is used to sort the values in an ascending order.

Syntax:

array_name.sort()

Here, 'array_name' is the name of the array.

Example 1:-

Let's create an array that hold 10 subjects and sort them.

CopiedCopy Code
<html>
<body>
<script>
// Create an array that hold 10 strings
const subjects1 =["php","html","node.js","java","jsp","jsp","php","php","java","php"];
document.writeln("Subjects: <br>");
document.writeln(subjects1);
document.writeln("<br>");
document.writeln("<br>");
// Sort the elements in the array.
subjects1.sort();
document.writeln("After Sorting: <br>");
document.writeln(subjects1);
</script>
</body>
</html>

Output:

Subjects:
php,html,node.js,java,jsp,jsp,php,php,java,php
After Sorting:
html,java,java,jsp,jsp,node.js,php,php,php,php

We can see that elements in the array were sorted in alphabetical order.

Example 2:-

Let's create an array that hold 10 integers and sort them.

CopiedCopy Code
<html>
<body>
<script>
// Create an array that hold 10 integers
const subjects1 =[12,34,56,76,56,43,67,89,90,89];
document.writeln("Marks: <br>");
document.writeln(subjects1);
document.writeln("<br>");
document.writeln("<br>");
// Sort the elements in the array.
subjects1.sort();
document.writeln("After Sorting: <br>");
document.writeln(subjects1);
</script>
</body>
</html>

Output:

Marks:
12,34,56,76,56,43,67,89,90,89
After Sorting:
12,34,43,56,56,67,76,89,89,90

We can see that numbers in the array were sorted.

reverse()

The reverse() method is used to reverse the values in an array.

Syntax:

array_name.reverse()

Here, 'array_name' is the name of the array.

Example 1:-

Let's create an array that hold 10 subject elements and reverse them.

CopiedCopy Code
<html>
<body>
<script>
// Create an array that hold 10 strings
const subjects1 =["php","html","node.js","java","jsp","jsp","php","php","java","php"];
document.writeln("Subjects: <br>");
document.writeln(subjects1);
document.writeln("<br>");
document.writeln("<br>");
// reverse the elements in the array.
subjects1.reverse();
document.writeln("After Reverse: <br>");
document.writeln(subjects1);
</script>
</body>
</html>

Output:

Subjects:
php,html,node.js,java,jsp,jsp,php,php,java,php
After Reverse:
php,java,php,php,jsp,jsp,java,node.js,html,php

We can see that elements in the array were displayed in the reverse order.

Example 2:-

Let's create an array that hold 10 integers and reverse them.

CopiedCopy Code
<html>
<body>
<script>
// Create an array that hold 10 integers
const subjects1 =[12,34,56,76,56,43,67,89,90,89];
document.writeln("Marks: <br>");
document.writeln(subjects1);
document.writeln("<br>");
document.writeln("<br>");
// reverse the elements in the array.
subjects1.reverse();
document.writeln("After Reverse: <br>");
document.writeln(subjects1);
</script>
</body>
</html>

Output:

Marks:
12,34,56,76,56,43,67,89,90,89
After Reverse:
89,90,89,67,43,56,76,56,34,12

We can see that numbers in the array were displayed in the reverse order.