How can I reverse an array in JavaScript without using libraries?

Question

I am saving some data in order using arrays, and I want to add a function that the user can reverse the list. I can't think of any possible method, so if anybody knows how, please help.

Answer 1

const original = [1, 2, 3, 4];
const reversed = [...original].reverse(); // 4 3 2 1

Concise and leaves the original unchanged. Careful with object arrays, as the new array will still reference the same objects.

For object arrays or multi-dimensional arrays you can use lodash

const reversed = cloneDeep(original).reverse();

Answer 2

array.slice().reverse();

Leaves the original array unchanged. Works fine for primitive arrays. Careful with object arrays, as the new array will still reference the original objects.

Answer 3

ES2023 Array Method toReversed():

The toReversed() method of Array instances is the copying counterpart of the reverse() method. It returns a new array with the elements in reversed order.

const originalArray = [1, 2, 3];
const reversedArray  = originalArray.toReversed();
console.log(`Original Array ==> ${originalArray}`); //[1, 2, 3]
console.log(`Reversed Array ==> ${reversedArray}`); //[3, 2, 1]

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 4

Infact the reverse() may not work in some cases, so you have to make an affectation first as the following

let a = [1, 2, 3, 4];
console.log(a);  // [1,2,3,4]
a = a.reverse();
console.log(a); // [4,3,2,1]

or use concat

let a = [1, 2, 3, 4];
console.log(a, a.concat([]).reverse());  // [1,2,3,4], [4,3,2,1]

Answer 5

two ways:

1. counter loop

   function reverseArray(a) { 
        var rA = []
        for (var i = a.length; i > 0; i--) {
            rA.push(a[i - 1])
        } 
   
        return rA;
     }
   

2. Using .reverse()

    function reverseArray(a) {  
        return a.reverse()  
     }
   

Answer 6

I'm not sure what is meant by libraries, but here are the best ways I can think of:

// return a new array with .map()
const ReverseArray1 = (array) => {
    let len = array.length - 1;

    return array.map(() => array[len--]);
}

console.log(ReverseArray1([1,2,3,4,5])) //[5,4,3,2,1]

// initialize and return a new array
const ReverseArray2 = (array) => {
    const newArray = [];
    let len = array.length;

    while (len--) {
        newArray.push(array[len]);
    }

    return newArray;
}

console.log(ReverseArray2([1,2,3,4,5]))//[5,4,3,2,1]

// use swapping and return original array
const ReverseArray3 = (array) => {
    let i = 0;
    let j = array.length - 1;

    while (i < j) {
        const swap = array[i];
        array[i++] = array[j];
        array[j--] = swap;
    }

    return array;
}
console.log(ReverseArray3([1,2,3,4,5]))//[5,4,3,2,1]

// use .pop() and .length
const ReverseArray4 = (array) => {
    const newArray = [];

    while (array.length) {
        newArray.push(array.pop());
    }

    return newArray;
}
console.log(ReverseArray4([1,2,3,4,5]))//[5,4,3,2,1]

Answer 7

Use swapping and return the original array.

const reverseString = (s) => {
  let start = 0, end = s.length - 1;
  while (start < end) {
    [s[start], s[end]] = [s[end], s[start]]; // swap
    start++, end--;
  }
  return s;
};

console.log(reverseString(["s", "t", "r", "e", "s", "s", "e", "d"]));

Answer 8

This function will work with arrays that may have gaps between their indices.

function reverse( a ) {
    var b = [], c = [] ;
    a.forEach( function( v ) { b.push( v ) } ) ;
    a.forEach( function( v, i ) { c[i] = b.pop() } ) ;
    return c ;
}

var a= [] ; a[1] = 2 ; a[3] = 4 ; a[7] = 6 ; a[9] = 8 ;
a = reverse( a ) ;
var s = '' ;
a.forEach( function( v, i ) { s += 'a[' + i + '] = ' + v + '  ' } ) ;
console.log( s ) ;
// a[1] = 8  a[3] = 6  a[7] = 4  a[9] = 2

Answer 9

reveresed = [...array].reverse()

Answer 10

I also faced the same problem. Thank you for this question. I did the code like the below snippet. It works nicely. I used ES6.

const Array = ["a", "b", "c", "d"];
let revArray = [].concat(Array).reverse();

when I console.log it I got the output like below

console.log(revArray)
// output: ["d","c","b","a"]

Answer 11

We have reverse() function to reverse the given array in JS.

var a = [7,8,9];
a.reverse(); // 9 8 7

function reverseArr(input) 
{
var ret = new Array;
for(var i = input.length-1; i >= 0; i--) 
{
    ret.push(input[i]);
}
return ret;
}

Answer 12

reverse array and sub-array (in place) with ES6.

function reverse(array, i=0, j=array.length-1){
  while (i < j){
    [array[i], array[j]] = [array[j], array[i]];
    ++i;
    --j;
  }
}

Answer 13

reverse in place with variable swapping (mutative)

const myArr = ["a", "b", "c", "d"];
for (let i = 0; i < (myArr.length - 1) / 2; i++) {  
    const lastIndex = myArr.length - 1 - i; 
    [myArr[i], myArr[lastIndex]] = [myArr[lastIndex], myArr[i]] 
}

Answer 14

Array.prototype.reverse() is all you need to do this work. See compatibility table.

var myArray = [20, 40, 80, 100];
var revMyArr = [].concat(myArray).reverse();
console.log(revMyArr);
// [100, 80, 40, 20]

Answer 15

Using .pop() method and while loop.

var original = [1,2,3,4];
var reverse = [];
while(original.length){
    reverse.push(original.pop());
}

Output: [4,3,2,1]

Answer 16

It can also be achieved using map method.

[1, 2, 3].map((value, index, arr) => arr[arr.length - index - 1])); // [3, 2, 1]

Or using reduce (little longer approach)

[1, 2, 3].reduce((acc, curr, index, arr) => {
    acc[arr.length - index - 1] = curr;
    return acc;
}, []);

Answer 17

Below is a solution with best space and time complexity

function reverse(arr){
let i = 0;
let j = arr.length-1; 
while(i<j){
arr[j] = arr[j]+arr[i];
arr[i] = arr[j] - arr[i];
arr[j] = arr[j] - arr[i];
i++;
j--;
}
return arr;
}
var arr = [1,2,3,4,5,6,7,8,9]
reverse(arr);

output => [9,8,7,6,5,4,3,2,1]

Answer 18

**

Shortest reverse array method without using reverse method:

**

 var a = [0, 1, 4, 1, 3, 9, 3, 7, 8544, 4, 2, 1, 2, 3];

 a.map(a.pop,[...a]); 
// returns [3, 2, 1, 2, 4, 8544, 7, 3, 9, 3, 1, 4, 1, 0]

a.pop method takes an last element off and puts upfront with spread operator ()

MDN links for reference:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/pop

Answer 19

Pure functions to reverse an array using functional programming:

var a = [3,5,7,8];

// ES2015
function immutableReverse(arr) {
  return [ ...a ].reverse();
}

// ES5
function immutableReverse(arr) {
  return a.concat().reverse()
}

Answer 20

Using ES6 rest operator and arrow function.

const reverse = ([x, ...s]) => x ? [...reverse(s), x] : [];
reverse([1,2,3,4,5]) //[5, 4, 3, 2, 1]

Answer 21

As others mentioned, you can use .reverse() on the array object.

However if you care about preserving the original object, you may use reduce instead:

const original = ['a', 'b', 'c'];
const reversed = original.reduce( (a, b) => [b].concat(a) );
//                                           ^
//                                           |
//                                           +-- prepend b to previous accumulation

// original: ['a', 'b', 'c'];
// reversed: ['c', 'b', 'a'];

Answer 22

How about this?:

  function reverse(arr) {
    function doReverse(a, left, right) {
      if (left >= right) {
        return a;
      }
      const temp = a[left];
      a[left] = a[right];
      a[right] = temp;
      left++;
      right--;
      return doReverse(a, left, right);
    }

    return doReverse(arr, 0, arr.length - 1);
  }

  console.log(reverse([1,2,3,4]));

https://jsfiddle.net/ygpnt593/8/

Answer 23

The shortest reverse method I've seen is this one:

let reverse = a=>a.sort(a=>1)

Answer 24

I just rewrote the haskell implementation to js.

const rev = (list, reversed) => {
    if (list.length == 0) return reversed

    reversed.unshift(list[0])
    return rev(list.slice(1), reversed)
}

const reverse = (list) => rev(list, [])

Answer 25

Reverse by using the sort method

• This is a much more succinct method.

const resultN = document.querySelector('.resultN');
const resultL = document.querySelector('.resultL');

const dataNum = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
const dataLetters = ['a', 'b', 'c', 'd', 'e'];

const revBySort = (array) => array.sort((a, b) => a < b);

resultN.innerHTML = revBySort(dataNum);
resultL.innerHTML = revBySort(dataLetters);

<div class="resultN"></div>
<div class="resultL"></div>

Answer 26

You can do

var yourArray = ["first", "second", "third", "...", "etc"]
var reverseArray = yourArray.slice().reverse()

console.log(reverseArray)

You will get

["etc", "...", "third", "second", "first"]

Answer 27

20 bytes

let reverse=a=>[...a].map(a.pop,a)

Answer 28

function reverseArray(arr) {
    let reversed = [];
    for (i = 0; i < arr.length; i++) { 
    reversed.push((arr[arr.length-1-i]))
    }
  return reversed;
}

Answer 29

53 bytes

function reverse(a){
    for(i=0,j=a.length-1;i<j;)a[i]=a[j]+(a[j--]=a[i++],0)
}

Just for fun, here's an alternative implementation that is faster than the native .reverse method.

Answer 30

JavaScript already has reverse() method on Array, so you don't need to do that much!

Imagine you have the array below:

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

Now simply just do this:

arr.reverse();

and you get this as the result:

[5, 4, 3, 2, 1];

But this basically change the original array, you can write a function and use it to return a new array instead, something like this:

function reverse(arr) {
  var i = arr.length, reversed = [];
  while(i) {
    i--;
    reversed.push(arr[i]);
  }
  return reversed;
}

Or simply chaning JavaScript built-in methods for Array like this:

function reverse(arr) {
  return arr.slice().reverse();
}

and you can call it like this:

reverse(arr); //return [5, 4, 3, 2, 1];

Just as mentioned, the main difference is in the second way, you don't touch the original array...