Arrow function with conditionals not returning all elements of array

Question

I have an array like the following: var arr = ['one', 'two', ['three', 'four']];

While trying to return each element by using the arrow function, it returns undefined as the third element, instead of the elements values. I've attempted to restructure it, but none of then return all the elements of both arrays. I could use a for loop, do the logic to push each element, but I want to understand and learn how to use arrow functions for cases like this.

arr.map(e => {
 if(typeof(e) == "object"){
    e.map(t => t)
  } else{ return e; }
})

Will really appreciate some clarification in this matter. The expected result is an array like the following: ['one', 'two', 'three', 'four'].

`e.map()` is not `return`ed from `.map()`. `two'` is not a valid string. — guest271314, Feb 24 '19 at 23:12
it returns another array, if it is "object" , so there should be return - https://codepen.io/nagasai/pen/ZPzBZR?editors=1010 — Naga Sai A, Feb 24 '19 at 23:18
To make the question a bit more clear. What I want to achieve is to obtain an array like ['one', 'two', 'three', 'four']. — Joel, Feb 24 '19 at 23:43
Look at [Array.prototype.flat](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/flat) — Mulan, Feb 24 '19 at 23:47
flat does the job nicely, although I still want to understand where is the error in the code. — Joel, Feb 24 '19 at 23:54
@Joel Have your read the above comments? https://stackoverflow.com/questions/54857462/arrow-function-with-conditionals-not-returning-all-elements-of-array/54857587?noredirect=1#comment96486462_54857462 `e.map()` will return an `Array`, not flatten the array. Can you update the question to include the expected output? See https://stackoverflow.com/help/how-to-ask — guest271314, Feb 24 '19 at 23:58

score 1 · Accepted Answer · answered Feb 25 '19 at 00:09

Array.prototype.map() is not designed and implemented to flatten an array. Even if .map() did flatten an array e.map(t => t) is not returned from .map() callback function at the code at the question.

arr.map(e => {
 if(typeof(e) == "object"){
    e.map(t => t) // no value is `return`ed here
  } else{ return e; }
})

There are a variety of approaches and Array methods that can be used to flatten an Array, including .flat(), .flatMap() and .concat(), e.g., see Merge/flatten an array of arrays in JavaScript?

score 0 · Answer 2 · answered Feb 24 '19 at 23:27

0

To achieve expected result, use below option of using reduce to return all elements of array within array

var arr = ['one', 'two', ['three', 'four']];

console.log(arr.reduce((acc, v) => {
  typeof(v) == 'object' ? acc.push(...v) : acc.push(v)
  return acc
}, []))

codepen - https://codepen.io/nagasai/pen/NJKdKv

answered Feb 24 '19 at 23:27

Naga Sai A

10,771
1
21
40

What is the issue with the code at the question? What is the expected result? – guest271314 Feb 24 '19 at 23:36
as OP mentioned "I've attempted to restructure it, but none of then return all the elements of both arrays." , displaying all elements to one array instead of arrays with in array – Naga Sai A Feb 24 '19 at 23:38
Did not read that as the clear requirement. The two issues with the code at the question are the syntax error in the input array, and `e.map()` is not `return`ed from the function passed to `.map()` – guest271314 Feb 24 '19 at 23:40
@guest271314, OP has commented the expected output to single array – Naga Sai A Feb 24 '19 at 23:47
If that is the case `let res = arr.flat()` – guest271314 Feb 24 '19 at 23:57
flat() not supported in IE, yes for modern browsers, my solution works for IE and modern browsers – Naga Sai A Feb 25 '19 at 00:00
Why would an individual still be using ie when FOSS browsers are available for free as in beer? `let res = [].concat(...arr)` – guest271314 Feb 25 '19 at 00:01

Arrow function with conditionals not returning all elements of array

2 Answers2