JavaScript - Multiplying Even Indexed Array Elements by 2 and Odd Indexed by 3

Question

I've been trying to write code that multiplies even indexed elements of an array by 2 and odd indexed elements by 3.

I have the following numbers stored in the variable number, which represents an array of numbers

numbers = [1,7,9,21,32,77];
Even Indexed Numbers - 1,9,32
Odd Indexed Numbers - 7, 21, 77

Please keep in mind that arrays are Zero Indexed, which means the numbering starts at 0. In which case, the 0-Indexed element is actually 1, and the 1-Indexed element is 7.

This is what I expected the output to be

[2,21,18,63,64,231]

Unfortunately, I got this output

[2,14,17,42,64,154]

Here is the code for my method

numbers = numbers.map(function(x) {
  n = 0;
  while (n < numbers.length) {
    if (n % 2 == 0) {
      return x * 2;
    }
    else {
     return x * 3;
    }
    n++;
  }});
return numbers;

Here I created a while loop, that executes code for every iteration of the variable n. For every value of the variable n, I'm checking if n is even, which is used by the code n % 2 == 0. While it's true that 0 % 2 == 0 it's not true that 1 % 2 == 0. I'm incrementing n at the end of the while loop, so I don't understand why I received the output I did.

Any help will be appreciated.

Answer 1

You created a global property called n, by doing

n = 0;

and then,

while (n < numbers.length) {
    if (n % 2 == 0) {
        return x * 2;
    } else {
        return x * 3;
    }
}
n++;    // Unreachable

you always return immediately. So the, n++ is never incremented. So, n remains 0 always and so all the elements are multiplied by 2 always.

The Array.prototype.map's callback function's, second parameter is the index itself. So, the correct way to use map is, like this

numbers.map(function(currentNumber, index) {
    if (index % 2 === 0) {
        return currentNumber * 2;
    } else {
        return currentNumber * 3;
    }
});

The same can be written succinctly, with the ternary operator, like this

numbers.map(function(currentNumber, index) {
    return currentNumber * (index % 2 === 0 ? 2 : 3);
});

Answer 2

To complement the other answer, the source of OP's confusion is on how "map" works. The map function is already called for each element - yet, OP attempted to use a while loop inside it, which is another way to iterate through each element. That is a double interaction, so, in essence, if OP's code worked, it would still be modifying each number n times! Usually, you just chose between a loop or map:

Using a loop:

var numbers = [1,7,9,21,32,77];
for (var i=0; i<numbers.length; ++i)
    numbers[i] = i % 2 === 0 ? numbers[i] * 2 : numbers[i] * 3;

Using map:

var numbers = [1,7,9,21,32,77];
numbers.map(function(number, index){
    return number * (index % 2 === 0 ? 2 : 3);
});

Or, very briefly:

[1,7,9,21,32,77].map(function(n,i){ return n * [2,3][i%2]; });