About calling a function - Steamroller

Tell us what’s happening:

Your code so far


function steamrollArray(arr) {
  // I'm a steamroller, baby
 let newArray = [];
 function flatten (arr){
   arr.forEach(function(item){
    if (!Array.isArray(item)) {
      newArray.push(item)
    }
    else{
      flatten(item);
    }
    
    });//forEach
} //flatten()
flatten(arr);
return newArray;
}

steamrollArray([1, [2], [3, [[4]]]]);

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.87 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/steamroller

My question is why do we need to call flatten (arr) again before return newArray?
calling steamrollArray() itself will not trigger flatten()to run the following code ??

flatten() is a function that lives in steamrollArray(). When item isn’t array, it simply adds that to newArray.
However, when item is array, it calls itself again. What does this do? It repeats what I’ve just said. Based on your question, I think you understand this part.

So, why do we call it before we return? Because we never called it anywhere inside streamrollArray(). The line just before the return is the initial call to flatten().