JavaScript: Five ways how to Reverse an Array

In this article, we'll delve into a topic of great importance, especially in the context of interviews. There are occasions when it appears straightforward, but there are also instances where it can pose a formidable challenge. You can reverse an array in JavaScript by using:-

1.Reverse() -

The reverse() method modifies the original array in place, so it doesn't create a new reversed array. Instead, it reverses the order of the elements in the existing array.

let myArray = [1, 2, 3, 4, 5];

myArray.reverse();

console.log(myArray); // Output: [5, 4, 3, 2, 1]

2.Slice()-

If you want to create a new array with the reversed elements without modifying the original array, you can use the slice() method in combination with reverse(), like this.

let originalArray = [1, 2, 3, 4, 5];
let reversedArray = originalArray.slice().reverse();

console.log(originalArray); // Output: [1, 2, 3, 4, 5]
console.log(reversedArray); // Output: [5, 4, 3, 2, 1]

In this example, slice() creates a shallow copy of the original array, and then reverse() is applied to the copy, leaving the original array unchanged.

3.Map() and Array.from()-

we use Array.from() to create a shallow copy of the original array, and then we use the map() method to iterate over the indices of the copied array. For each index, we access the corresponding element from the end of the original array, effectively reversing the order of the elements.

This method creates a new reversed array without modifying the original array.

let originalArray = [1, 2, 3, 4, 5];

let reversedArray = Array.from(originalArray).map((_, index, array) => array[array.length - 1 - index]);

console.log(originalArray); // Output: [1, 2, 3, 4, 5]
console.log(reversedArray); // Output: [5, 4, 3, 2, 1]

4.Reduce()-

we use the reduce() method to build a new array in reverse order. The unshift() method is used to add each element at the beginning of the accumulator array, effectively reversing the order of the elements.

This method also creates a new reversed array without modifying the original array.

let originalArray = [1, 2, 3, 4, 5];

let reversedArray = originalArray.reduce((acc, currentElement) => {
  acc.unshift(currentElement);
  return acc;
}, []);

console.log(originalArray); // Output: [1, 2, 3, 4, 5]
console.log(reversedArray); // Output: [5, 4, 3, 2, 1]

5.Array.reduceRight()-

we use the reduceRight() method, which is similar to reduce(), but it processes the array from right to left. We start with an empty array [] as the initial accumulator (acc) and push each element from the original array onto it in reverse order.

This method also creates a new reversed array without modifying the original array.

let originalArray = [1, 2, 3, 4, 5];

let reversedArray = originalArray.reduceRight((acc, currentElement) => {
  acc.push(currentElement);
  return acc;
}, []);

console.log(originalArray); // Output: [1, 2, 3, 4, 5]
console.log(reversedArray); // Output: [5, 4, 3, 2, 1]

i hope you love it. Happy coding..........

JavaScriptInterviewFrontend Developer
Avatar for Anjali saini

Written by Anjali saini

Hi, my name is Anjali Saini and I'm a creative front-end web developer. I have a passion for creating beautiful, user-friendly websites and applications that are both functional and visually appealing

Loading

Fetching comments

Hey! 👋

Got something to say?

or to leave a comment.