# Why is this result \[undefined, undefined, undefined\] and not \[ \]?

**URL:** <https://es.discourse.group/t/why-is-this-result-undefined-undefined-undefined-and-not/1609>\
**Category:** I have questions\
**Created:** [February 6, 2023, 3:45pm UTC](https://es.discourse.group/t/why-is-this-result-undefined-undefined-undefined-and-not/1609 "2023-02-06T15:45:01Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![popocreator](https://yyz2.discourse-cdn.com/free1/user_avatar/es.discourse.group/popocreator/32/1635_2.png) [@popocreator](https://es.discourse.group/u/popocreator)\
**Post date:** [February 6, 2023, 3:45pm UTC](https://es.discourse.group/t/why-is-this-result-undefined-undefined-undefined-and-not/1609/1 "2023-02-06T15:45:01Z")

</div>

```javascript
const result = [1,2,3].map(n => {
  if(n === 0) {
     return 'hi'
  }
})

console.log(result) // [undefined, undefined, undefined]

```

---

<div class="post-metadata">

**Author:** ![theScottyJam](https://yyz2.discourse-cdn.com/free1/user_avatar/es.discourse.group/thescottyjam/32/616_2.png) [@theScottyJam](https://es.discourse.group/u/theScottyJam)\
**Post date:** [February 6, 2023, 3:54pm UTC](https://es.discourse.group/t/why-is-this-result-undefined-undefined-undefined-and-not/1609/2 "2023-02-06T15:54:51Z")

</div>

When a function exits without using a return, by default, it'll return `undefined`.

```javascript
const fn = () => {};
console.log(fn()); // undefined

```

So, your code is the same as this:

```javascript
const result = [1,2,3].map(n => {
  if(n === 0) {
     return 'hi'
  } else {
    return undefined
  }
})

console.log(result) // [undefined, undefined, undefined]

```

And, `.map()` doesn't give any special treatment to the `undefined` value - if that gets returned, it'll stick it in the array as normal.

If you're wanting to also filter values out as you map, you'd either use a separate `.filter(...)` first, or you use `.flatMap()` like this:

```javascript
const result = [1,2,3].flatMap(n => {
  if(n === 0) {
     return ['hi']
  } else {
    return []
  }
})

console.log(result) // []

```

---

<div class="post-metadata">

**Author:** ![ljharb](https://yyz2.discourse-cdn.com/free1/user_avatar/es.discourse.group/ljharb/32/8_2.png) [@ljharb](https://es.discourse.group/u/ljharb)\
**Post date:** [February 6, 2023, 4:01pm UTC](https://es.discourse.group/t/why-is-this-result-undefined-undefined-undefined-and-not/1609/3 "2023-02-06T16:01:03Z")

</div>

Because the array doesn't contain 0, it only contains 1, 2, and 3.

Array iteration callbacks take the _value_ as the first parameter, and the index as the second.

---

<div class="post-metadata">

**Author:** ![popocreator](https://yyz2.discourse-cdn.com/free1/user_avatar/es.discourse.group/popocreator/32/1635_2.png) [@popocreator](https://es.discourse.group/u/popocreator)\
**Post date:** [February 6, 2023, 4:08pm UTC](https://es.discourse.group/t/why-is-this-result-undefined-undefined-undefined-and-not/1609/4 "2023-02-06T16:08:35Z")

</div>

Wow ... ! Perfect solution!

```javascript
const objectArray = [{id: 1, title: 'Hello'}, {id: 2, title: 'Hello'}, {id: 3, title: 'Hello'}];

// Before
const result = objectArray.flatMap(n => {
  if (n.id > 3) {
     return n.id
  }
})
console.log(result); // [undefined, undefined, undefined]

// After
const result = objectArray.flatMap(n => {
  if (n.id > 3) {
     return [n.id]
  } else {
     return []
  }
})
console.log(result); // []

```