Eu tenho uma matriz JavaScript como:

[["$6"], ["$12"], ["$25"], ["$25"], ["$18"], ["$22"], ["$10"]]

Como eu iria mesclar as matrizes internas separadas em uma como:

["$6", "$12", "$25", ...]

Você pode usar concatpara mesclar matrizes:

var arrays = [
  ["$6"],
  ["$12"],
  ["$25"],
  ["$25"],
  ["$18"],
  ["$22"],
  ["$10"]
];
var merged = [].concat.apply([], arrays);

console.log(merged);

Usando o applymétodo de concat, apenas o segundo parâmetro será usado como uma matriz; portanto, a última linha é idêntica a esta:

var merged2 = [].concat(["$6"], ["$12"], ["$25"], ["$25"], ["$18"], ["$22"], ["$10"]);

Há também o Array.prototype.flat()método (introduzido no ES2019) que você pode usar para nivelar as matrizes, embora ele esteja disponível apenas no Node.js, começando na versão 11, e nem no Internet Explorer .

const arrays = [
      ["$6"],
      ["$12"],
      ["$25"],
      ["$25"],
      ["$18"],
      ["$22"],
      ["$10"]
    ];
const merge3 = arrays.flat(1); //The depth level specifying how deep a nested array structure should be flattened. Defaults to 1.
console.log(merge3);
    

Aqui está uma função curta que usa alguns dos métodos mais recentes de matriz JavaScript para nivelar uma matriz n-dimensional.

function flatten(arr) {
  return arr.reduce(function (flat, toFlatten) {
    return flat.concat(Array.isArray(toFlatten) ? flatten(toFlatten) : toFlatten);
  }, []);
}

Uso:

flatten([[1, 2, 3], [4, 5]]); // [1, 2, 3, 4, 5]
flatten([[[1, [1.1]], 2, 3], [4, 5]]); // [1, 1.1, 2, 3, 4, 5]

Existe um método confuso, oculto, que constrói uma nova matriz sem alterar a original:

var oldArray = [[1],[2,3],[4]];
var newArray = Array.prototype.concat.apply([], oldArray);
console.log(newArray); // [ 1, 2, 3, 4 ]

Pode ser feito melhor com a função de redução de javascript.

var arrays = [["$6"], ["$12"], ["$25"], ["$25"], ["$18"], ["$22"], ["$10"], ["$0"], ["$15"],["$3"], ["$75"], ["$5"], ["$100"], ["$7"], ["$3"], ["$75"], ["$5"]];

arrays = arrays.reduce(function(a, b){
     return a.concat(b);
}, []);

Ou, com o ES2015:

arrays = arrays.reduce((a, b) => a.concat(b), []);

js-fiddle

Documentos do Mozilla

Há um novo método nativo chamado flat para fazer exatamente isso.

(A partir do final de 2019, flatagora é publicado no padrão ECMA 2019 e core-js@3(a biblioteca de babel) inclui-o em sua biblioteca de polyfill )

const arr1 = [1, 2, [3, 4]];
arr1.flat(); 
// [1, 2, 3, 4]

const arr2 = [1, 2, [3, 4, [5, 6]]];
arr2.flat();
// [1, 2, 3, 4, [5, 6]]

// Flatten 2 levels deep
const arr3 = [2, 2, 5, [5, [5, [6]], 7]];
arr3.flat(2);
// [2, 2, 5, 5, 5, [6], 7];

// Flatten all levels
const arr4 = [2, 2, 5, [5, [5, [6]], 7]];
arr4.flat(Infinity);
// [2, 2, 5, 5, 5, 6, 7];

A maioria das respostas aqui não funciona em matrizes enormes (por exemplo, 200.000 elementos) e, mesmo se o fizerem, são lentas. A resposta de polkovnikov.ph tem o melhor desempenho, mas não funciona para achatamento profundo.

Aqui está a solução mais rápida, que também funciona em matrizes com vários níveis de aninhamento :

const flatten = function(arr, result = []) {
  for (let i = 0, length = arr.length; i < length; i++) {
    const value = arr[i];
    if (Array.isArray(value)) {
      flatten(value, result);
    } else {
      result.push(value);
    }
  }
  return result;
};

Exemplos

Matrizes enormes

flatten(Array(200000).fill([1]));

Ele lida com matrizes enormes muito bem. Na minha máquina, esse código leva cerca de 14 ms para ser executado.

Matrizes aninhadas

flatten(Array(2).fill(Array(2).fill(Array(2).fill([1]))));

Funciona com matrizes aninhadas. Este código produz [1, 1, 1, 1, 1, 1, 1, 1].

Matrizes com diferentes níveis de aninhamento

flatten([1, [1], [[1]]]);

Ele não tem nenhum problema ao nivelar matrizes como esta.

Atualização: verificou-se que esta solução não funciona com matrizes grandes. Se você está procurando uma solução melhor e mais rápida, confira esta resposta .

function flatten(arr) {
  return [].concat(...arr)
}

É simplesmente expande arre passa como argumentos para concat(), que mescla todas as matrizes em uma. É equivalente a [].concat.apply([], arr).

Você também pode tentar isso para achatamento profundo:

function deepFlatten(arr) {
  return flatten(           // return shalowly flattened array
    arr.map(x=>             // with each x in array
      Array.isArray(x)      // is x an array?
        ? deepFlatten(x)    // if yes, return deeply flattened x
        : x                 // if no, return just x
    )
  )
}

Veja a demonstração no JSBin .

Referências para os elementos do ECMAScript 6 usados ​​nesta resposta:

• Operador de propagação
• Funções de seta

Nota lateral: métodos como find()e funções de seta não são compatíveis com todos os navegadores, mas isso não significa que você não possa usar esses recursos no momento. Basta usar o Babel - ele transforma o código ES6 em ES5.

Você pode usar o sublinhado :

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

_.flatten(x); // => [1, 2, 3, 4]

Procedimentos genéricos significam que não precisamos reescrever a complexidade toda vez que precisamos utilizar um comportamento específico.

concatMap(ou flatMap) é exatamente o que precisamos nessa situação.

// concat :: ([a],[a]) -> [a]
const concat = (xs,ys) =>
  xs.concat (ys)

// concatMap :: (a -> [b]) -> [a] -> [b]
const concatMap = f => xs =>
  xs.map(f).reduce(concat, [])

// id :: a -> a
const id = x =>
  x

// flatten :: [[a]] -> [a]
const flatten =
  concatMap (id)

// your sample data
const data =
  [["$6"], ["$12"], ["$25"], ["$25"], ["$18"], ["$22"], ["$10"]]

console.log (flatten (data))

previsão

E sim, você adivinhou corretamente, apenas nivela um nível, que é exatamente como deve funcionar

Imagine alguns conjuntos de dados como este

// Player :: (String, Number) -> Player
const Player = (name,number) =>
  [ name, number ]

// team :: ( . Player) -> Team
const Team = (...players) =>
  players

// Game :: (Team, Team) -> Game
const Game = (teamA, teamB) =>
  [ teamA, teamB ]

// sample data
const teamA =
  Team (Player ('bob', 5), Player ('alice', 6))

const teamB =
  Team (Player ('ricky', 4), Player ('julian', 2))

const game =
  Game (teamA, teamB)

console.log (game)
// [ [ [ 'bob', 5 ], [ 'alice', 6 ] ],
//   [ [ 'ricky', 4 ], [ 'julian', 2 ] ] ]

Ok, agora digamos que queremos imprimir uma lista que mostre todos os jogadores que participarão game…

const gamePlayers = game =>
  flatten (game)

gamePlayers (game)
// => [ [ 'bob', 5 ], [ 'alice', 6 ], [ 'ricky', 4 ], [ 'julian', 2 ] ]

Se nosso flattenprocedimento também nivelar matrizes aninhadas, acabaremos com esse resultado de lixo ...

const gamePlayers = game =>
  badGenericFlatten(game)

gamePlayers (game)
// => [ 'bob', 5, 'alice', 6, 'ricky', 4, 'julian', 2 ]

rolando fundo, baby

Isso não quer dizer que às vezes você também não queira achatar matrizes aninhadas - apenas esse não deve ser o comportamento padrão.

Podemos fazer um deepFlattenprocedimento com facilidade…

// concat :: ([a],[a]) -> [a]
const concat = (xs,ys) =>
  xs.concat (ys)

// concatMap :: (a -> [b]) -> [a] -> [b]
const concatMap = f => xs =>
  xs.map(f).reduce(concat, [])

// id :: a -> a
const id = x =>
  x

// flatten :: [[a]] -> [a]
const flatten =
  concatMap (id)

// deepFlatten :: [[a]] -> [a]
const deepFlatten =
  concatMap (x =>
    Array.isArray (x) ? deepFlatten (x) : x)

// your sample data
const data =
  [0, [1, [2, [3, [4, 5], 6]]], [7, [8]], 9]

console.log (flatten (data))
// [ 0, 1, [ 2, [ 3, [ 4, 5 ], 6 ] ], 7, [ 8 ], 9 ]

console.log (deepFlatten (data))
// [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 ]

Lá. Agora você tem uma ferramenta para cada trabalho - uma para esmagar um nível de aninhamento flattene outra para obliterar todos os aninhamentos deepFlatten.

Talvez você possa ligar obliterateou nukese não gostar do nome deepFlatten.

Não itere duas vezes!

É claro que as implementações acima são inteligentes e concisas, mas usar um .mapseguido de uma chamada para .reducesignifica que estamos realmente fazendo mais iterações do que o necessário

Usar um combinador confiável que estou chamando mapReduceajuda a manter as iterações em um mínimo; requer uma função de mapeamento m :: a -> b, uma função redutora r :: (b,a) ->be retorna uma nova função redutora - esse combinador está no coração dos transdutores ; se você estiver interessado, eu escrevi outras respostas sobre eles

// mapReduce = (a -> b, (b,a) -> b, (b,a) -> b)
const mapReduce = (m,r) =>
  (acc,x) => r (acc, m (x))

// concatMap :: (a -> [b]) -> [a] -> [b]
const concatMap = f => xs =>
  xs.reduce (mapReduce (f, concat), [])

// concat :: ([a],[a]) -> [a]
const concat = (xs,ys) =>
  xs.concat (ys)

// id :: a -> a
const id = x =>
  x

// flatten :: [[a]] -> [a]
const flatten =
  concatMap (id)
  
// deepFlatten :: [[a]] -> [a]
const deepFlatten =
  concatMap (x =>
    Array.isArray (x) ? deepFlatten (x) : x)

// your sample data
const data =
  [ [ [ 1, 2 ],
      [ 3, 4 ] ],
    [ [ 5, 6 ],
      [ 7, 8 ] ] ]

console.log (flatten (data))
// [ [ 1. 2 ], [ 3, 4 ], [ 5, 6 ], [ 7, 8 ] ]

console.log (deepFlatten (data))
// [ 1, 2, 3, 4, 5, 6, 7, 8 ]

Uma solução para o caso mais geral, quando você pode ter alguns elementos que não são da matriz.

function flattenArrayOfArrays(a, r){
    if(!r){ r = []}
    for(var i=0; i<a.length; i++){
        if(a[i].constructor == Array){
            r.concat(flattenArrayOfArrays(a[i], r));
        }else{
            r.push(a[i]);
        }
    }
    return r;
}

Para nivelar uma matriz de matrizes de elemento único, você não precisa importar uma biblioteca, um loop simples é a solução mais simples e mais eficiente :

for (var i = 0; i < a.length; i++) {
  a[i] = a[i][0];
}

Para votantes negativos: leia a pergunta, não diminua o voto porque não se adequa ao seu problema muito diferente. Esta solução é a mais rápida e a mais simples para a pergunta feita.

Que tal usar o reduce(callback[, initialValue])método deJavaScript 1.8

list.reduce((p,n) => p.concat(n),[]);

Faria o trabalho.

Outra solução do ECMAScript 6 em estilo funcional:

Declare uma função:

const flatten = arr => arr.reduce(
  (a, b) => a.concat(Array.isArray(b) ? flatten(b) : b), []
);

e use-o:

flatten( [1, [2,3], [4,[5,[6]]]] ) // -> [1,2,3,4,5,6]

 const flatten = arr => arr.reduce(
         (a, b) => a.concat(Array.isArray(b) ? flatten(b) : b), []
       );


console.log( flatten([1, [2,3], [4,[5],[6,[7,8,9],10],11],[12],13]) )

Considere também uma função nativa Array.prototype.flat () (proposta para ES6) disponível nas últimas versões dos navegadores modernos. Obrigado a @ (Константин Ван) e @ (Mark Amery) o mencionaram nos comentários.

A flatfunção possui um parâmetro, especificando a profundidade esperada do aninhamento de matriz, que é igual 1por padrão.

[1, 2, [3, 4]].flat();                  // -> [1, 2, 3, 4]

[1, 2, [3, 4, [5, 6]]].flat();          // -> [1, 2, 3, 4, [5, 6]]

[1, 2, [3, 4, [5, 6]]].flat(2);         // -> [1, 2, 3, 4, 5, 6]

[1, 2, [3, 4, [5, 6]]].flat(Infinity);  // -> [1, 2, 3, 4, 5, 6]

let arr = [1, 2, [3, 4]];

console.log( arr.flat() );

arr =  [1, 2, [3, 4, [5, 6]]];

console.log( arr.flat() );
console.log( arr.flat(1) );
console.log( arr.flat(2) );
console.log( arr.flat(Infinity) );

const common = arr.reduce((a, b) => [...a, ...b], [])

Observe: Quando Function.prototype.apply( [].concat.apply([], arrays)) ou o operador de dispersão ( [].concat(...arrays)) é usado para achatar uma matriz, ambos podem causar estouros de pilha para matrizes grandes, porque todos os argumentos de uma função são armazenados na pilha.

Aqui está uma implementação segura para a pilha em estilo funcional que avalia os requisitos mais importantes entre si:

• reutilização
• legibilidade
• concisão
• desempenho

// small, reusable auxiliary functions:

const foldl = f => acc => xs => xs.reduce(uncurry(f), acc); // aka reduce

const uncurry = f => (a, b) => f(a) (b);

const concat = xs => y => xs.concat(y);


// the actual function to flatten an array - a self-explanatory one-line:

const flatten = xs => foldl(concat) ([]) (xs);

// arbitrary array sizes (until the heap blows up :D)

const xs = [[1,2,3],[4,5,6],[7,8,9]];

console.log(flatten(xs));


// Deriving a recursive solution for deeply nested arrays is trivially now


// yet more small, reusable auxiliary functions:

const map = f => xs => xs.map(apply(f));

const apply = f => a => f(a);

const isArray = Array.isArray;


// the derived recursive function:

const flattenr = xs => flatten(map(x => isArray(x) ? flattenr(x) : x) (xs));

const ys = [1,[2,[3,[4,[5],6,],7],8],9];

console.log(flattenr(ys));

Assim que você se acostumar com pequenas funções de seta na forma de caril, composição de funções e funções de ordem superior, esse código será exibido como prosa. A programação consiste apenas em reunir pequenos blocos de construção que sempre funcionam como esperado, porque não contêm efeitos colaterais.

Achatar uma linha ES6

Consulte achatamento de lodash , achatamento de sublinhado (raso true)

function flatten(arr) {
  return arr.reduce((acc, e) => acc.concat(e), []);
}

ou

function flatten(arr) {
  return [].concat.apply([], arr);
}

Testado com

test('already flatted', () => {
  expect(flatten([1, 2, 3, 4, 5])).toEqual([1, 2, 3, 4, 5]);
});

test('flats first level', () => {
  expect(flatten([1, [2, [3, [4]], 5]])).toEqual([1, 2, [3, [4]], 5]);
});

Nivelamento profundo de uma linha ES6

Veja lodash flattenDeep , sublinhado flatten

function flattenDeep(arr) {
  return arr.reduce((acc, e) => Array.isArray(e) ? acc.concat(flattenDeep(e)) : acc.concat(e), []);
}

Testado com

test('already flatted', () => {
  expect(flattenDeep([1, 2, 3, 4, 5])).toEqual([1, 2, 3, 4, 5]);
});

test('flats', () => {
  expect(flattenDeep([1, [2, [3, [4]], 5]])).toEqual([1, 2, 3, 4, 5]);
});

Você pode usar Array.flat()com Infinityqualquer profundidade da matriz aninhada.

var arr = [ [1,2,3,4], [1,2,[1,2,3]], [1,2,3,4,5,[1,2,3,4,[1,2,3,4]]], [[1,2,3,4], [1,2,[1,2,3]], [1,2,3,4,5,[1,2,3,4,[1,2,3,4]]]] ];

let flatten = arr.flat(Infinity)

console.log(flatten)

verifique aqui a compatibilidade do navegador

Uma abordagem haskellesca

function flatArray([x,...xs]){
  return x ? [...Array.isArray(x) ? flatArray(x) : [x], ...flatArray(xs)] : [];
}

var na = [[1,2],[3,[4,5]],[6,7,[[[8],9]]],10];
    fa = flatArray(na);
console.log(fa);

ES6 maneira:

const flatten = arr => arr.reduce((acc, next) => acc.concat(Array.isArray(next) ? flatten(next) : next), [])

const a = [1, [2, [3, [4, [5]]]]]
console.log(flatten(a))

Maneira ES5 de flattenfunção com fallback ES3 para matrizes aninhadas N-times:

var flatten = (function() {
  if (!!Array.prototype.reduce && !!Array.isArray) {
    return function(array) {
      return array.reduce(function(prev, next) {
        return prev.concat(Array.isArray(next) ? flatten(next) : next);
      }, []);
    };
  } else {
    return function(array) {
      var arr = [];
      var i = 0;
      var len = array.length;
      var target;

      for (; i < len; i++) {
        target = array[i];
        arr = arr.concat(
          (Object.prototype.toString.call(target) === '[object Array]') ? flatten(target) : target
        );
      }

      return arr;
    };
  }
}());

var a = [1, [2, [3, [4, [5]]]]];
console.log(flatten(a));

Se você tiver apenas matrizes com 1 elemento de sequência:

[["$6"], ["$12"], ["$25"], ["$25"]].join(',').split(',');

fará o trabalho. Bt que corresponde especificamente ao seu exemplo de código.

var arrays = [["a"], ["b", "c"]];
Array.prototype.concat.apply([], arrays);

// gives ["a", "b", "c"]

(Estou apenas escrevendo isso como uma resposta separada, com base no comentário de @danhbear.)

Eu recomendo uma função de gerador com economia de espaço :

function* flatten(arr) {
  if (!Array.isArray(arr)) yield arr;
  else for (let el of arr) yield* flatten(el);
}

// Example:
console.log(...flatten([1,[2,[3,[4]]]])); // 1 2 3 4

Se desejar, crie uma matriz de valores nivelados da seguinte maneira:

let flattened = [...flatten([1,[2,[3,[4]]]])]; // [1, 2, 3, 4]

Prefiro transformar toda a matriz, como está, em uma string, mas, ao contrário de outras respostas, faria isso usando JSON.stringifye não usando otoString() método, que produz um resultado indesejado.

Com essa JSON.stringifysaída, tudo o que resta é remover todos os colchetes, envolver o resultado com os colchetes de início e final mais uma vez e servir o resultado com o JSON.parsequal a string volta à "vida".

• Pode lidar com matrizes aninhadas infinitas sem custos de velocidade.
• Pode lidar corretamente com itens de matriz que são cadeias contendo vírgulas.

var arr = ["abc",[[[6]]],["3,4"],"2"];

var s = "[" + JSON.stringify(arr).replace(/\[|]/g,'') +"]";
var flattened = JSON.parse(s);

console.log(flattened)

Executar snippet de códigoOcultar resultados

Expandir snippet

• Somente para matriz multidimensional de cadeias / números (não objetos)

Você também pode tentar o novo Array.Flat()método. Funciona da seguinte maneira:

let arr = [["$6"], ["$12"], ["$25"], ["$25"], ["$18"], ["$22"], ["$10"]].flat()

console.log(arr);

O flat()método cria uma nova matriz com todos os elementos da sub-matriz concatenados nela recursivamente até a 1 camada de profundidade (ou seja, matrizes dentro de matrizes)

Se você também deseja achatar matrizes tridimensionais ou dimensionais mais altas, basta chamar o método flat várias vezes. Por exemplo (3 dimensões):

let arr = [1,2,[3,4,[5,6]]].flat().flat().flat();

console.log(arr);

Seja cuidadoso!

Array.Flat()O método é relativamente novo. Navegadores mais antigos, como por exemplo, podem não ter implementado o método. Se você deseja que o código funcione em todos os navegadores, pode ser necessário transpilar seu JS para uma versão mais antiga. Verifique os documentos da web do MD para obter a compatibilidade atual do navegador.

Usando o operador spread:

const input = [["$6"], ["$12"], ["$25"], ["$25"], ["$18"], ["$22"], ["$10"]];
const output = [].concat(...input);
console.log(output); // --> ["$6", "$12", "$25", "$25", "$18", "$22", "$10"]

Isso não é difícil, basta percorrer as matrizes e mesclá-las:

var result = [], input = [["$6"], ["$12"], ["$25"], ["$25"], ["$18"]];

for (var i = 0; i < input.length; ++i) {
    result = result.concat(input[i]);
}

Parece que isso parece um trabalho para RECURSION!

• Lida com vários níveis de aninhamento
• Lida com matrizes vazias e sem parâmetros de matriz
• Não tem mutação
• Não depende dos recursos modernos do navegador

Código:

var flatten = function(toFlatten) {
  var isArray = Object.prototype.toString.call(toFlatten) === '[object Array]';

  if (isArray && toFlatten.length > 0) {
    var head = toFlatten[0];
    var tail = toFlatten.slice(1);

    return flatten(head).concat(flatten(tail));
  } else {
    return [].concat(toFlatten);
  }
};

Uso:

flatten([1,[2,3],4,[[5,6],7]]);
// Result: [1, 2, 3, 4, 5, 6, 7] 

Eu fiz isso usando recursão e fechamentos

function flatten(arr) {

  var temp = [];

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

Eu estava brincando com os ES6 Generators outro dia e escrevi essa essência . Que contém ...

function flatten(arrayOfArrays=[]){
  function* flatgen() {
    for( let item of arrayOfArrays ) {
      if ( Array.isArray( item )) {
        yield* flatten(item)
      } else {
        yield item
      }
    }
  }

  return [...flatgen()];
}

var flatArray = flatten([[1, [4]],[2],[3]]);
console.log(flatArray);

Basicamente, estou criando um gerador que faz um loop na matriz de entrada original; se encontrar uma matriz, ele usa o operador yield * em combinação com a recursão para nivelar continuamente as matrizes internas. Se o item não for uma matriz, apenas produzirá o único item. Em seguida, usando o operador ES6 Spread (também conhecido como operador splat), aplico o gerador em uma nova instância de array.

Não testei o desempenho disso, mas acho que é um bom exemplo simples de uso de geradores e do operador yield *.

Mas, novamente, eu estava apenas brincando, então tenho certeza de que existem maneiras mais eficazes de fazer isso.

apenas a melhor solução sem lodash

let flatten = arr => [].concat.apply([], arr.map(item => Array.isArray(item) ? flatten(item) : item))