Question Fusionner / aplatir un tableau de tableaux en JavaScript?


J'ai un tableau JavaScript comme:

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

Comment irais-je sur la fusion des tableaux internes séparés en un comme:

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

727
2018-06-02 18:53


origine


Réponses:


Vous pouvez utiliser concat pour fusionner des tableaux:

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

En utilisant le apply méthode de concat prendra juste le deuxième paramètre en tant que tableau, ainsi la dernière ligne est identique à ceci:

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

1289
2018-06-02 18:56



Voici une courte fonction qui utilise certaines des méthodes de tableau JavaScript les plus récentes pour aplatir un tableau à n dimensions.

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

Usage:

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]

352
2018-02-22 17:41



Voici une solution fonctionnelle simple et performante:

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

Pas de gâchis impératif.


270
2018-03-13 22:12



Il peut être mieux fait par javascript réduire la fonction.

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, avec ES2015:

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

js-violon

Mozilla docs


144
2017-08-19 05:58



La plupart des réponses ici ne fonctionnent pas sur des tableaux énormes (par exemple 200 000 éléments), et même s'ils le font, ils sont lents. La réponse de polkovnikov.ph a les meilleures performances, mais cela ne fonctionne pas pour un aplatissement profond.

Voici la solution la plus rapide, qui fonctionne également sur les tableaux avec plusieurs niveaux d'imbrication:

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;
};

Exemples

Énormes tableaux

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

Il gère très bien les tableaux énormes. Sur ma machine, ce code prend environ 14 ms à exécuter.

Tableaux imbriqués

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

Cela fonctionne avec les tableaux imbriqués. Ce code produit [1, 1, 1, 1, 1, 1, 1, 1].

Tableaux avec différents niveaux d'imbrication

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

Il n'a aucun problème avec les tableaux d'aplatissement comme celui-ci.


50
2017-08-17 14:54



Mise à jour: il s'est avéré que cette solution ne fonctionne pas avec de grands tableaux. Si vous cherchez une solution meilleure et plus rapide, consultez cette réponse.


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

Est simplement se développe arr et passe comme arguments à concat(), qui fusionne tous les tableaux en un seul. C'est équivalent à [].concat.apply([], arr).

Vous pouvez également essayer ceci pour un aplatissement profond:

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
    )
  )
}

Voir la démo sur JSBin.

Références pour les éléments ECMAScript 6 utilisés dans cette réponse:


Note de côté: des méthodes comme find() et les fonctions de flèche ne sont pas supportées par tous les navigateurs, mais cela ne signifie pas que vous ne pouvez pas utiliser ces fonctionnalités maintenant. Juste utiliser Babel - il transforme le code ES6 en ES5.


47
2018-01-24 19:31



Vous pouvez utiliser Souligner:

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

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

41
2018-06-02 18:58