Flatten at array using Javascript

Question

The problem is to try and remove nested arrays:

steamrollArray([1, [2], [3, [[4]]]]); // should return [1, 2, 3, 4]

I have tried this but the recursion is failing when a nested array appears.

function checkElement(el) {
    if (Array.isArray(el)) {
        if (el.length === 1) {
            return checkElement(el[0]); 
        } else {
            for (var i=0; i < el.length; i++){
                checkElement(el[i]); 
            }  
        }

    } else {
        return (el);    
    }   
}

function steamrollArray(arr) {
  var finalArr = [];
    for (var i=0; i < arr.length; i++){
        finalArr.push(checkElement(arr[i])); 
    }  


  return (finalArr);

}

Not a duplicate: this specific question is about an unspecified depth, not about flattening an array of arrays. — Denys Séguret
– Denys Séguret, Commented Jul 13, 2016 at 11:03

Nina Scholz · Accepted Answer · 2016-07-13 12:47:31Z

3

A proposal for the first part:

You could change the return value to array and use concat instead of push.

function checkElement(el) {
    // collect the values of the checked array
    var temp = [];
    if (Array.isArray(el)) {
        if (el.length === 1) {
            return checkElement(el[0]);
        } else {
            for (var i = 0; i < el.length; i++) {
                // collect the values
                temp = temp.concat(checkElement(el[i]));
            }
            // return flat values
            return temp;
        }
    } else {
        return el;
    }
}

// this can be shorten to
function steamrollArray(arr) {
    return checkElement(arr);
}

console.log(steamrollArray([1, [2], [3, [[4]]]]));

Part two, a bit shorter:

function steamrollArray(arr) {
    return arr.reduce(function flat(r, a) {
        return Array.isArray(a) && a.reduce(flat, r) || r.concat(a);
    }, []);
}

console.log(steamrollArray([1, [2], [3, [[4]]]]));

edited Jul 13, 2016 at 12:47

answered Jul 13, 2016 at 11:11

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

JohnnyBizzle Over a year ago

Thanks I understand the first solution and it passed the tests. The second one I don't follow though I'm sure it also works. If you add comments I might be able to follow it.

Nina Scholz Over a year ago

it simply uses Array#reduce with an empty array as start value and a callback which returns either if the element is an array, the values from the call on every element or the value itself.

pishpish · Accepted Answer · 2016-07-13 12:05:22Z

2

You could use reduce:

function flatten( array ){
  return array.reduce( function (a, b){
    return a.concat( Array.isArray(b) ? flatten(b) : b );
  }, [] );
}

answered Jul 13, 2016 at 12:05

pishpish

2,62418 silver badges23 bronze badges

1 Comment

pishpish Over a year ago

I see from your comment on another answer that flatten should accept non-array values. I modified the code here to return [] if the argument is not an array.

Morteza Tourani · Accepted Answer · 2016-07-13 23:11:44Z

2

I think this would be the funniest way to do this and also it's one line no more. Also it leaves extraction to native code which is much faster than Scripting.

var nestedArray = [1, [2], [3, [[4]]]];
var flatten = nestedArray.toString().split(',').map(Number);

console.log(flatten);

answered Jul 13, 2016 at 23:11

Morteza Tourani

3,5665 gold badges44 silver badges48 bronze badges

1 Comment

AmerllicA Over a year ago

You are the khallaghest developer I ever seeen. pashmaaam.

Ismail RBOUH · Accepted Answer · 2016-07-13 11:46:45Z

1

You can use recursion like this:

function flatten(array) {
    var flat = []; //The result array
    //An IIFE that will perform the recursion,
    //is equivalent to: function rec(param) {.....}; rec(param);
    (function rec(a) {
        //For each element in the array:
        //If the element is an array then call the 'rec' function.
        //Else, push it to the result array.
        //I used the conditional (ternary) operator (condition ? expr1 : expr2 )
        for(var i in a) Array.isArray(a[i]) ? rec(a[i]) : flat.push(a[i]);
    })(array);//Initiate the recursion with the main array 
    return flat;//Return the final result
};

var a = [1, [2], [3, [[4]]]];


function flatten(array) {
    var flat = [];      
    (function rec(a) {
        for(var i in a) Array.isArray(a[i]) ? rec(a[i]) : flat.push(a[i]);
    })(array);        
    return flat;
};

console.log(flatten(a));

edited Jul 13, 2016 at 11:46

answered Jul 13, 2016 at 11:10

Ismail RBOUH

10.5k2 gold badges26 silver badges37 bronze badges

2 Comments

JohnnyBizzle Over a year ago

Brilliant, but I just don't understand what you have written.

Ismail RBOUH Over a year ago

I've commented the code. I hope that will help you and I'm always available for further explanations ;)

le_m · Accepted Answer · 2016-07-13 13:16:35Z

1

Using a generator function allows you to efficiently iterate through nested array elements without allocating unnecessary memory. If you really need the flattened array itself, use [...iterable] or Array.from(iterable):

function* deepIterate(array) {
  for (a of array) Array.isArray(a) ? yield* deepIterate(a) : yield a;
}

// Iterate through flattened array:
for (a of deepIterate([1,[2,[3]]])) console.log(a);

// Flatten array:
var flat = Array.from(deepIterate([1,[2,[3]]]));
console.log(flat);

edited Jul 13, 2016 at 13:16

answered Jul 13, 2016 at 13:07

le_m

20.4k10 gold badges70 silver badges78 bronze badges

Comments

Denys Séguret · Accepted Answer · 2016-07-13 11:07:18Z

0

You can't just return the values, or it wouldn't work when you have arrays of length > 1.

Here's a solution:

function steamrollArray(arr, flattened) {
    if (!flattened) flattened = [];
    for (var i=0; i < arr.length; i++){
         if (Array.isArray(arr[i])) {
             steamrollArray(arr[i], flattened);
         } else {
             flattened.push(arr[i]);
         }
    }  
    return flattened;
}

console.log(steamrollArray([1, [2], [3, [[4]]]])); // should return [1, 2, 3, 4]

answered Jul 13, 2016 at 11:07

Denys Séguret

384k90 gold badges813 silver badges779 bronze badges

Comments

Nitesh Shaw · Accepted Answer · 2016-07-13 12:09:49Z

0

Try This if it work for you

function steamrollArray(unflatenArr) {
    var flatenArr = [];
    if (Array.isArray(unflatenArr)) {
        for (var i = 0; i < unflatenArr.length; i++)
            arrFlat(unflatenArr[i], flatenArr);
    }
    return flatenArr;
}
function arrFlat(arr, refArr) {
    if (Array.isArray(arr)) {
        for (var i = 0; i < arr.length; i++) {
            arrFlat(arr[i], refArr);
        }
    }
    else {
        refArr.push(arr);
    }
}

answered Jul 13, 2016 at 12:09

Nitesh Shaw

2162 silver badges17 bronze badges

Comments

Pratik Barasia · Accepted Answer · 2017-06-20 22:48:03Z

0

A simpler solution without using any recursion is by using splice method of Arrays. It works for any level of nesting.

function flattenArray(arr){

  for(var i=0;i<arr.length;i++){

    if(arr[i] instanceof Array){

      Array.prototype.splice.apply(arr,[i,1].concat(arr[i]))
       i--;
    }

  }

  return arr;
}

answered Jun 20, 2017 at 22:48

Pratik Barasia

5611 gold badge3 silver badges14 bronze badges

Comments

Ismail RBOUH · Accepted Answer · 2016-07-13 11:24:05Z

-1

Try this:

function steamrollArray(unflatenArr){
    return eval("["+(JSON.stringify(unflatenArr).replace(/\[/g,'').replace(/\]/g,''))+"]")
}

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

edited Jul 13, 2016 at 11:24

Ismail RBOUH

10.5k2 gold badges26 silver badges37 bronze badges

answered Jul 13, 2016 at 11:22

Nitesh Shaw

2162 silver badges17 bronze badges

3 Comments

JohnnyBizzle Over a year ago

I was thinking that but the solution has to accept the empty object {} also :/

Nina Scholz Over a year ago

that is really a no go solution. because of the replace and finally with eval without emergency.

Deepak Puthraya Over a year ago

If the input is a string this would cause issues. say for example : [1, [2], 3, "[4]"]

Collectives™ on Stack Overflow

Flatten at array using Javascript

9 Answers 9

2 Comments

1 Comment

1 Comment

2 Comments

Comments

Comments

Comments

Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

9 Answers 9

2 Comments

1 Comment

1 Comment

2 Comments

Comments

Comments

Comments

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related