4.2 Reversing an Array (Eloquent JavaScript Solutions)

4-2 Eloquent Javascript Solutions.js

function reverseArray(array) {
  result = [];
  for (let item of array) {
    result.unshift(item);
  }
  return result;
}

function reverseArrayInPlace(array) {
  let len = array.length;
  for (let i = 0; i < Math.floor(len/2); i++) {
    console.log(i, len-i-1, array[i], array[len-i-1], array);
    let swap = array[i];
    array[i] = array[len-i-1];
    array[len-i-1] = swap;
  }
  return array;
}

console.log(reverseArray(["A", "B", "C"]));
// → ["C", "B", "A"];
let arrayValue = [1, 2, 3, 4, 5];
reverseArrayInPlace(arrayValue);
console.log(arrayValue);
// → [5, 4, 3, 2, 1]
let arrayValue2 = [1, 2, 3, 4];
reverseArrayInPlace(arrayValue2);
console.log(arrayValue2);
// → [4, 3, 2, 1]

4.2 Reversing an array

Arrays have a method reverse, which changes the array by inverting the order in which its elements appear. For this exercise, write two functions, reverseArray and reverseArrayInPlace. The first, reverseArray, takes an array as the argument and produces a new array that has the same elements in the inverse order. The second, reverseArrayInPlace, does what the reverse method does: it modifies the array given as argument by reversing its elements. Neither may use the standard reverse method.

Thinking back to the notes about side effects and pure functions in the previous chapter, which variant do you expect to be useful in more situations? Which one is more efficient?

Hints

There are two obvious ways to implement reverseArray. The first is to simply go over the input array from front to back and use the unshift method on the new array to insert each element at its start. The second is to loop over the input array backwards and use the push method. Iterating over an array backward requires a (somewhat awkward) for specification like (let i = array.length - 1; i >= 0; i--).

Reversing the array in place is harder. You have to be careful not to overwrite elements that you will later need. Using reverseArray or otherwise copying the whole array (array.slice(0) is a good way to copy an array) works but is cheating.

The trick is to swap the first and last elements, then the second and second-to-last, and so on. You can do this by looping over half the length of the array (use Math.floor to round down - you don’t need to touch the middle element in an array with an odd number of elements) and swapping the element at position i with the one at position array.length - 1 - i. You can use a local binding to briefly hold on to one of the elements, overwrite that one with its mirror image, and then put the value from the local binding in the place where the mirror image used to be.

Or you can just do this

function reverseArrayInPlace(arr){
  for(let i of [...arr]) {
    arr.unshift(i) 
    arr.pop()
 }
}

I want to know how are these two let i of [...arr] and let i of arr operate, for example:

let arr = [1, 2, 3, 4, 5];
function reverseArrayInPlace(arr) {
  for (let i of [...arr]) {
    arr.unshift(i);
    arr.pop();
  }
  return arr;
}
reverseArrayInPlace(arr);
console.log(arr);
//result=>  [5, 4, 3, 2, 1]

and this one :

let arr = [1, 2, 3, 4, 5];
function reverseArrayInPlace(arr) {
  for (let i of arr) {
    arr.unshift(i);
    arr.pop();
  }
  return arr;
}
reverseArrayInPlace(arr);
console.log(arr);
//result=> [1, 1, 1, 1, 1]

I tried to console.log both of them (i) to see the difference, but I can't see none:

let arr = [1, 2, 3, 4, 5];
function reverseArrayInPlace(arr) {
  for (let i of arr) {
    console.log(i);
  }

  return arr;
}
reverseArrayInPlace(arr);
//result=> 1 2 3 4 5

let arr = [1, 2, 3, 4, 5];
function reverseArrayInPlace(arr) {
  for (let i of [...arr]) {
    console.log(i);
  }

  return arr;
}
reverseArrayInPlace(arr);
//result=> 1 2 3 4 5

function reverseArray(arr){
arr.reverse();
return arr;
}
function reverseArrayInPlace(a){
return reverseArray(a);
}
console.log(reverseArray(["A", "B", "C"]));
// → ["C", "B", "A"];
let arrayValue = [1, 2, 3, 4, 5];
reverseArrayInPlace(arrayValue);
console.log(arrayValue);
// → [5, 4, 3, 2, 1]

The answer to my previous question is simple:
let arr = [1, 2, 3, 4, 5]; function reverseArrayInPlace(arr) { for (let i of [...arr]) { arr.unshift(i); arr.pop(); } return arr; } reverseArrayInPlace(arr); console.log(arr); //result=> [5, 4, 3, 2, 1]

In this snippet, the reverseArrayInPlace function attempts to reverse the elements of the array by iteratively removing the last element of the array and inserting it at the beginning using unshift and pop operations. However, the loop for (let i of [...arr]) creates a new array arr using the spread operator [...arr], which effectively creates a shallow copy of the original array arr. Therefore, the loop iterates over the shallow copy of the original array in its original order and reverses the original array. Consequently, the output will be [5, 4, 3, 2, 1].

let arr = [1, 2, 3, 4, 5]; function reverseArrayInPlace(arr) { for (let i of arr) { arr.unshift(i); arr.pop(); } return arr; } reverseArrayInPlace(arr); console.log(arr); //result=> [1, 1, 1, 1, 1]

In this snippet, the reverseArrayInPlace function also attempts to reverse the elements of the array using the same approach. However, in this case, the loop for (let i of arr) directly iterates over the original array arr. The issue with this code is that modifying an array while iterating over it.