展平JavaScript数组 - 为什么这不起作用？

Question

I'm trying to flatten an array with randomly nested arrays inside. I'm not sure why the function I wrote ends up in an infinite loop:

let array = [1, 2, [3]]
var final_array = [] 

function flattener(array){
  for(i = 0; i < array.length; i++){
    if(array[i] instanceof Array){
      flattener(array[i])
    }else{
      final_array.push(array[i])
    }
  }
}

flattener(array)

What I think SHOULD happen is:

When I'm in the for loop checking for [3] , it goes into the if statement, flattener gets called again, it resolves, and then I exit the if statement.

Instead, the if statement keeps calling to check [3] infinitely, and I'm not sure why this happens.

Answer 1

The problem is you didn't declare the i variable, so it's leaking into the global space and being reset when it recurses.

Change:

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

To:

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

Answer 2

This is another approach using Array.reduce and Array.concat .

/**
 * Flattens an array of arrays into one-dimensional array
 * @param  {Array} arr: the array to be flattened
 * @return {Array}
 */
function flatten(arr) {
  return arr.reduce(function (flattened, cvalue) {
    return flattened.concat(Array.isArray(cvalue) ? flatten(cvalue) : cvalue);
  }, []); // initial value of flattened array []
}

Testing it...

let array = [1, 2, [3]]
var falttened = flatten(array)

Take a look at his gist: Array flatten

Answer 3

Array#concat plus Array#map is yet another way you can achieve this

var flattener = arr => [].concat.apply([], arr.map(item=>Array.isArray(item) ? flattener(item) : item));

or the ES5 version

var flattener = function flattener(arr) {
  return [].concat.apply([], arr.map(function (item) {
    return Array.isArray(item) ? flattener(item) : item;
  }));
};

Answer 4

Change

 for(i = 0; i < array.length; i++)

to

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