JavaScript

[Abdumajidov2005]

Body

Body (Text):
“Hello developers! 👋
Today I’m playing around with JS arrays and ran into a small puzzle.

let arr = [1, 2, 3, 4];
let result = arr.map(num => {
  if (num % 2 === 0) return num * 2;
});
console.log(result);

Question:

What do you think console.log(result) will output?

Why does it behave that way?

How can we fix it so the result becomes something closer to [1, 2, 3, 4]?

That’s what makes JavaScript interesting — small code, big puzzles! 🧩

Guidelines

• I have read and understood this category's guidelines before making this post.

[Thiago-code-lab]

Hello! This is a great puzzle to understand how map works under the hood in JavaScript. Here are the answers to your questions:

1. What will console.log(result) output?
   The output will be:

JavaScript
[undefined, 4, undefined, 8]
2. Why does it behave that way?
The Array.prototype.map() method always creates a new array with the exact same length as the original array. It does this by executing the callback function for every element.

In your code, the if (num % 2 === 0) condition only returns a value for even numbers. When the iteration hits an odd number (like 1 and 3), the condition is not met, and the function reaches the end without a return statement. In JavaScript, when a function doesn't explicitly return anything, it returns undefined by default.

3. How can we fix it?
   It depends on the exact output you are aiming for, but here are the two most common approaches:

Solution A: If you want to keep the original odd numbers ([1, 4, 3, 8])
You just need to ensure the function always returns something. Add a fallback return for when the condition is false:

JavaScript
let result = arr.map(num => {
if (num % 2 === 0) return num * 2;
return num; // Returns the number itself if it's odd
});

// A cleaner way using the ternary operator:
// let result = arr.map(num => num % 2 === 0 ? num * 2 : num);
Solution B: If you only wanted the multiplied even numbers ([4, 8])
Because map cannot change the size of the array, you can't use it to "skip" elements. To achieve that, you should combine filter with map:

JavaScript
let result = arr
.filter(num => num % 2 === 0) // Filters only the evens [2, 4]
.map(num => num * 2); // Multiplies them by two [4, 8]

Happy coding! 🚀

[Lumb3]

console.log(result) will print:

[undefined, 4, undefined, 8]

Why:

• map() always returns an array of the same length.
• Your callback only returns for even numbers.
• For odd numbers, there’s no return, so JavaScript inserts undefined.

Fix (keep odd numbers, double evens):

let arr = [1, 2, 3, 4];
let result = arr.map(num => (num % 2 === 0 ? num * 2 : num));
console.log(result); // [1, 4, 3, 8]

If you wanted only doubled evens ([4, 8]), use filter(...).map(...) instead.

[Abdumajidov2005]

nice bro

[edtk]

Output: [undefined, 4, undefined, 8]

.map() calls your callback for every element and uses the return value to build the new array. For odd numbers (1, 3), the if block doesn't execute, so the function implicitly returns undefined.

Fix — return the number as-is for odds:

let result = arr.map(num => num % 2 === 0 ? num * 2 : num);
// [1, 4, 3, 8]

Or if you only want the even doubles and want to discard odds, .filter() + .map() is the right combo:

let result = arr.filter(num => num % 2 === 0).map(num => num * 2);
// [4, 8]

The key takeaway: .map() always returns an array of the same length as the input. If you don't explicitly return something, JavaScript returns undefined for you.

[Abdumajidov2005]

follow me

[alpha37283]

1. What happens

Array.map() always returns a new array of the same length as the original array.

For num = 1 → 1 % 2 === 0 is false → callback returns nothing → undefined

For num = 2 → true → returns 4

For num = 3 → false → undefined

For num = 4 → true → returns 8

So the output will be:

[undefined, 4, undefined, 8]
2. Why it behaves this way

map does not skip elements; it always fills the new array with whatever the callback returns.
If nothing is returned explicitly, undefined is placed in that position.

3. How to fix it

If the goal is to double even numbers but leave odd numbers unchanged, you can do:

let arr = [1, 2, 3, 4];
let result = arr.map(num => (num % 2 === 0 ? num * 2 : num));
console.log(result); // [1, 4, 3, 8]

Use a ternary operator (or an else clause) to ensure every element has a value in the new array.

4. Alternative: Only keep modified values

If instead you only want the doubled numbers and skip the rest:

let arr = [1, 2, 3, 4];
let result = arr.filter(num => num % 2 === 0).map(num => num * 2);
console.log(result); // [4, 8]

filter removes the odd numbers first.

map then transforms only the even numbers.

[danicoder13]

[undefined, 4, undefined, 8]

[Abdumajidov2005]

follow me

[notcoderhuman]

The code outputs [undefined, 4, undefined, 8] because .map() expects a return value for every item. When num is odd (1 and 3), if condition is false, so no return happens — which defaults to undefined in JS arrow functions without explicit return.

That's classic JS quirk: implicit return only if single expression, but with if/else blocks, you need explicit returns everywhere, or it falls through to undefined.

To fix it for something closer to [1, 4, 3, 8] (keep odds same, double evens):

let arr = [1, 2, 3, 4];
let result = arr.map(num => {
  if (num % 2 === 0) {
    return num * 2;
  } else {
    return num;
  }
});
console.log(result);  // [1, 4, 3, 8]

[Abdumajidov2005]

very right

[Abdumajidov2005]

follow me

[Zaidx-me]

Very useful Man

[Abdumajidov2005]

follow me

[Zaidx-me]

I like it

[ludev0]

The thing is, .map() expects a return value for every single element in the array. Since your if block only covers even numbers, the function doesn't find a return for the odd ones (1 and 3), so it defaults to undefined.

To fix this and keep the array complete, you just need to return the number when it's not even:

let result = arr.map(num => {
  if (num % 2 === 0) return num * 2;
  return num;
});