3

I am learning Javascript on a book and have to practice reversing an array by creating my own reverse function. The array must be reversed without creating a new variable to hold the reversed array. I thought I found a solution, but when I try to output my answer in 2 different ways (see below), I get different outputs:

function reverseArrayInPlace(array) {
  for (var i = 0; i < array.length; i += 1) {
    array = array.slice(0, i).concat(array.pop()).concat(array.slice(i));
  }
  console.log(array);
}

var array = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

Here are the outputs:

reverseArrayInPlace(array);
console.log(array);
> [ 10, 9, 8, 7, 6, 5, 4, 3, 2, 1 ]
> [ 1, 2, 3, 4, 5, 6, 7, 8, 9 ]

When console.log() is used within the function, I get my desired answer.

When console.log() is used outside the function, I get the original array with the last element missing. I would like an explanation to this phenomenon.

Improve this question
1
  • I re-upvoted this to counteract the -1. Not that I think this is a great question, but we are gonna discourage new users like Kevin if we just go around downvoting without providing any explanation. Commented Aug 7, 2018 at 20:09

4 Answers 4

Reset to default
2

The array in the function is on a different scope than that at the global / window level -- the global array is never touched; the function changes a local copy of it instead.

If you didn't pass array as a parameter to the function, then it would act on the now unmasked global array variable:

function reverseArrayInPlace() { // <-- no parameter
  for (var i = 0; i < array.length; i += 1) {
    array = array.slice(0, i).concat(array.pop()).concat(array.slice(i));
  }
  console.log(array);
}

var array = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
reverseArrayInPlace();
console.log(array);

(...although it is generally bad practice to use globals like that, partly because it's easy to accidentally mask them with local variables just as you did here. A better pattern would be for functions to receive their data as params and return a value, so you can decide, when you call the function, what to assign that returned value to.)

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

1

Inside reverseArrayInPlace you are reassigning the array variable, not changing (mutating) it. The array you pass in, therefore, is not changed. The inside console.log sees the new array while the one outside sees the original.

Perhaps you want something like this instead

function reverseArrayInPlace(array) {
  for (var i = 0; i < array.length; i += 1) {
    array = array.slice(0, i).concat(array.pop()).concat(array.slice(i));
  }
  return array;
}

var array = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

var newArray = reverseArrayInPlace(array)

console.log(newArray)
Improve this answer

1 Comment

Hello Zach, thanks for your answer! I guess the mutation concept was the primary issue here. I'm glad that you have brought this up! I understand my problem in depth now. As for the proposed solution, I do not think it would be appropriate for my case even though it works because the book specifically stated that I change the original array instead of creating a new variable for it.
1

Just a different approach by using the function stack for storing an item of the array by popping the value, check the length of the array and call the function again with the same object reference and then unshift the temporary stored value.

While working for a small amount of values and because of the limited stack, it is not advisable to use this beside of educational purpose.

function reverseArrayInPlace(array) {
    var temp = array.pop();
    if (array.length) {
        reverseArrayInPlace(array);
    }
    array.unshift(temp);
}

var array = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

reverseArrayInPlace(array);

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

Improve this answer

2 Comments

Hello Nina, thanks for providing an alternate and unique solution! Would it be possible to clarify what the line array.length && reverseArrayInPlace(array); does? I mainly do not understand the purpose of using the && operator in this case.
it is a logical AND &&, which checks the left side for a truthy value and if not (a falsy value) it checks the other side by calling the function. i changed the code to a user friendly if statement.
1

In the first loop of your for you are calling array.pop() which modifies the array passed as argument, but then you are creating a new array storing it in the same variable, so the reference to the original array is lost, and then in the subsequent loops the modified array is the one being generated inside your function.

Look at this code, I added a line to copy the original array, thus not modificating the original passed as argument.

function reverseArrayInPlace(array) {
	array = array.slice(); //copying the passed array to not change the original
	for (var i = 0; i < array.length; i += 1) {
		array = array.slice(0, i).concat(array.pop()).concat(array.slice(i));
	}
	console.log(array);
}

var array = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

reverseArrayInPlace(array);
console.log(array);

Improve this answer

3 Comments

Hey thanks for addressing the issue with the '10' missing from the original array. So basically, when I create a new reference, let's say var a = b, then the expressing in b is read first, then assigned to the variable a, correct?
@KevinBie Not sure if I understood correctly, in JS when you store an array (or an object) in a variable, what you are actually doing is storing its memory address in the variable and not the array itself. So if you do var a = [1, 2];, a internally will be an address pointing to the [1, 2] array, then if you do var b = a; what you are doing is storing the same address from a into b, so now a and b will be pointing to the same location in memory, if you modify the array in b, the array in a will be changed. Hope this clarifies your issue.
@KevinBie What you are trying to do is some book/guide exercise? I might be wrong but you can try the built-in array.reverse() to flip the array.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.