10

Estou tentando criar uma função que mapeie um array para outro newArray. Se um dos elementos do array for um array, quero mapear todos os seus subElementos para o newArray.

Portanto:

var array = [1,2,3,4,5, [1,3,2,4,1]]

Deveria retornar

[1,2,3,4,5,1,3,2,4,1]

Meu código está assim:

var array = [1,2,3,4,5, [1,3,2,4,1]]

var newArray = array.map(function(element){

    if (typeof(element) === "object"){
        element.forEach(function(subElement){
            return(subElement);
        })
    } else {
        return(element);
    }

})

newArray;

Mas newArray retorna:

[ 1, 2, 3, 4, 5, undefined ]

8 Respostas 8

10

No teu código estás a usar o .map(), mas esse método retorna um array com o mesmo numero de elementos, por isso não vai funcionar pois o array final que queres terá mais elementos que o primeiro.

Podes usar o "novo" .reduce() para fazer isso.

Seria assim:

var array = [1, 2, 3, 4, 5, [1, 3, 2, 4, 1]];
var novoArray = array.reduce(function (a, b) {
    return a.concat(b);
}, []);
console.log(novoArray); // dá [1, 2, 3, 4, 5, 1, 3, 2, 4, 1]

jsFiddle: http://jsfiddle.net/9zacjndf/

Outra maneira mais "gambiarra" podia ser assim:

var array = [1, 2, 3, 4, 5, [1, 3, 2, 4, 1]];
var novoArray = [].concat.apply([], array)
console.log(novoArray); // [1, 2, 3, 4, 5, 1, 3, 2, 4, 1]

jsFiddle: http://jsfiddle.net/9zacjndf/1/

Recursivamente:

Se precisares de usar arrays com N niveis de profundidade precisas de uma função recursiva. Aqui fica uma sugestão que aparenta ser a mais rápida:

function alisar(arr) {
    var novo = [];
    function redutor(arr, el) {
        if (Array.isArray(arr)) {
            while ((el = arr.pop()) || arr.length) redutor(el);
        } else {
            novo.push(arr);
        }
    }
    redutor(arr);
    return novo.reverse();
}

jsFiddle: http://jsfiddle.net/nmou4yvz/1

0
6

O nome mais comum para essa função que você quer é "flatten". Pra mim, a maneira mais fácil de implementar essa função é com recursão.

function flatten(inputArray){
    var out = [];
    function go(x){
       if(Array.isArray(x)){
           for(var i=0; i<x.length; i++){
               go(x[i]);
           }
       }else{
           out.push(x);
       }
    }
    go(inputArray);
    return out;
}
4
  • Hugo, você consegue me dizer o que está errado com o meu algoritmo?
    – Kvera
    Commented 18/06/2015 às 18:27
  • 2
    Quando typeof(element) === "object" a callback do map retorna undefined porque não tem return. O return dentro do forEach não conta - ele faz a callback do foreach retornar, não a callback do map. Resumindo: não dá pra resolver esse problema com mágica, tem que fazer a recursão mesmo.
    – hugomg
    Commented 18/06/2015 às 18:37
  • Sua resposta tem a melhor performance entre as recursivas: jsperf.com/flatten-de-array-em-javascript
    – bfavaretto
    Commented 18/06/2015 às 18:54
  • 1
    @bfavaretto juntei também uma função recursiva: jsperf.com/flatten-de-array-em-javascript/2 Hugo: +1 por me teres feito perder tempo a melhorar a minha resposta :)
    – Sergio
    Commented 18/06/2015 às 22:30
6

Você já tem várias soluções nas outras respostas, então vou apenas explicar o problema do seu código. O problema está neste trecho:

element.forEach(function(subElement){
    return(subElement);
})

Você tem um retorno dentro do callback do forEach, mas esse retorno não se aplica ao callback do map como você parece esperar. Dessa maneira, quando o seu código segue o caminho do typeof(element) === "object", o callback do map não tem nenhum retorno definido. E em JS funções sem return retornam implicitamente undefined, que é o que está indo parar no seu resultado.

Como não tenho uma solução a acrescentar, aproveito o espaço para dizer que entre as respostas com recursão apresentadas até agora, a do @hugomg é a que tem melhor performance.

3
  • Eu só adicionaria que o forEach vai retornar um Array da mesma forma, o que não dá o efeito que ele deseja... Commented 18/06/2015 às 18:38
  • 1
    Como assim? O forEach retorna undefined (se o código fosse return element.forEach...).
    – bfavaretto
    Commented 18/06/2015 às 18:40
  • você está certo, me confundi porque eu dei o return no element... :/ Commented 18/06/2015 às 18:44
4

Transforme o array multidimensional em string, depois transforme em array:

var array = [1,2,3,4,5, [1,3,2,4,1]];
console.log(array.join().split(",")); // ["1", "2", "3", "4", "5", "1", "3", "2", "4", "1"]

Caso seja necessário apenas números:

var array = [1,2,3,4,5, [1,3,2,4,1]];
var novoArray = array.join().split(",").map(function(item) {
    return parseInt(item);
});
console.log(novoArray); // [1, 2, 3, 4, 5, 1, 3, 2, 4, 1]
2
  • 4
    Essa abordagem não funciona se os elementos contém strings com vírgulas: flatten("a,b") --> ["a", "b"]
    – hugomg
    Commented 18/06/2015 às 18:43
  • Solução simples para o problema à mão.
    – Kvera
    Commented 19/06/2015 às 13:58
4

O que você quer fazer parece ser um flat. Para isso basta fazer o seguinte:

function flat(arr){
    var ret = [];
    for(var i = 0; i < arr.length; i++){
        if(arr[i] instanceof Array){
            ret = ret.concat(flat(arr[i]));
        }else{
            ret.push(arr[i]);
        }
    }
    return ret;
}

Isso deve resolver isso seu problema.

2
  • 1
    Felipe, você sabe me dizer o que há de errado com o meu algoritmo?
    – Kvera
    Commented 18/06/2015 às 18:28
  • 1
    o @bfavaretto já respondeu aqui Commented 18/06/2015 às 18:53
4

já tem algumas respostas aqui, mas eu acho que tem uma forma mais "limpa":

function flatten (elemento){
  if(Array.isArray(elemento))
    return elemento.reduce(function(anterior,atual){
            return anterior.concat(flatten(atual))
          },[]);
  else return [elemento];
}
1
  • 1
    Essa função tem complexidade quadrática no pior caso, quando a entrada tem "profundidade" N: Algo como [1,[2,[3,[4,[5]]]]]
    – hugomg
    Commented 18/06/2015 às 18:47
4

Podes criar o teu próprio mapeamento:

Array.prototype.hasObject = function(){
    for (i in this)
        if(typeof this[i] == "object")
            return true;

    return false;
}

Array.prototype.flatten  = function(){
    if (typeof condition == 'undefined') 
        condition = function(){return true;};

    narray = [];

    this.forEach(function(element){
        if (typeof element == 'object'){
            for(i in element){
                if (!element.hasOwnProperty(i))
                    continue;
                narray.push(element[i]);
            }
        } else 
            narray.push(element);
    });
    
    if (narray.hasObject())
        return narray.flatten();
    else return narray;
}
var array = [1,2,3,4,5, [1,3,2,4,1, [555,555,654, ['eu to malucooooo!']]]];
var newArray = array.flatten();

console.log(newArray)

Uso:

var array = [1,2,3,4,5, [1,3,2,4,1, [555,555,654, ['eu to malucooooo!']]]];
var newArray = array.flatten();

Saída:

[1, 2, 3, 4, 5, 1, 3, 2, 4, 1, 555, 555, 654, "eu to malucooooo!"]

JsFiddle

2

Atualização 2021 Você pode utilizar o método flat do array:

const array = [1,2,3,4,5, [1,3,2,4,1]];
console.log(array.flat());


flat

O método flat() cria um novo array com todos elementos sub-arrays concatenados nele de forma recursiva até a profundidade especificada.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .