Flexiple Logo
  1. Home
  2. Blogs
  3. JavaScript
  4. How to Reverse an Array In JavaScript – JS .reverse() Function

How to Reverse an Array In JavaScript – JS .reverse() Function

Author image

Siddharth Khuntwal

Software Developer

Published on Thu Jun 06 2024

Reversing an array in JavaScript is a straightforward task using the reverse() function. This function directly modifies the original array by inverting the order of its elements. JavaScript developers often use reverse() to handle data in scenarios where the sequence needs to be reversed for processing or display purposes. The array reverses its elements when reverse() is called on it. The operation occurs in place, and the array returns its elements in the new order. This method proves useful in various applications, including sorting algorithms where elements require reversing post-sort for descending order display.

How to Reverse an Array Using a for Loop

To reverse an array using a for loop in JavaScript. Begin by declaring an empty array that will hold the reversed elements. This new array is essential for storing elements in reverse order. Next, initiate a for loop that starts at the last index of the original array. This index is calculated by subtracting one from the array's length. Inside the loop, push the current element from the original array into the new array. Continue this process until the loop reaches the first element of the original array.

JavaScript's loop iteration decrements the index after each iteration, ensuring that each element from the original array is considered in reverse order. After the loop completes, the new array contains all elements of the original array but in reversed sequence. Assign the new array to another variable if needed or return it from a function. This method ensures that the original array remains unmodified, preserving data integrity.

Here is an example of how this can be implemented in JavaScript:

function reverseArray(originalArray) {

    var reversedArray = [];

    for (var i = originalArray.length - 1; i >= 0; i--) {

        reversedArray.push(originalArray[i]);

    }

    return reversedArray;

}

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

var myReversedArray = reverseArray(myArray);

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

This code snippet clearly illustrates the process: the function reverseArray takes an originalArray as its parameter and uses a for loop to iterate over originalArray from the last element to the first. Each element is then added to reversedArray using the push method. The function finally returns reversedArray, which is logged to the console to verify the reversal. This method is straightforward and effective for reversing arrays in JavaScript without using the built-in reverse() method.

How to Use Array.reverse to Reverse an Array

To reverse an array in JavaScript, use the Array.reverse method. The Array.reverse method modifies the original array by reversing the order of its elements. This method does not require any arguments and can be applied directly to any array. After execution, the first array element becomes the last, and the last array element becomes the first.

Example of using Array.reverse:

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

numbers.reverse();

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

In the context of a more complex data structure, such as an array of objects, Array.reverse still performs effectively. Consider an array containing objects representing people with a name and age. Array.reverse will rearrange the objects in reverse order, but the objects themselves remain unchanged.

Conclusion

Reversing an array in JavaScript effectively utilizes the .reverse() method. This function modifies the original array by reversing the order of its elements. Developers use this method to handle arrays where the sequence of elements needs to be inverted. Remember, JavaScript modifies the array in place, which means the original array changes when .reverse() is applied. For operations that require the original array to remain unchanged, developers should first copy the array before applying .reverse(). This ensures that the original data structure is preserved. Always make a copy of the array if maintaining the original order is necessary. This approach enhances the functionality and flexibility of data manipulation in JavaScript applications.

 

Browse Flexiple's talent pool

Explore our network of top tech talent. Find the perfect match for your dream team.