У мене є масив JavaScript на зразок:

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

Як би я міг об'єднати окремі внутрішні масиви в один такий:

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

Ви можете використовувати concatдля об'єднання масивів:

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

console.log(merged);

Використання applyметоду concatбуде просто приймати другий параметр як масив, тому останній рядок ідентичний цьому:

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

Існує також Array.prototype.flat()метод (представлений в ES2019), який можна використовувати для вирівнювання масивів, хоча він доступний лише в Node.js, починаючи з версії 11, і зовсім не в 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);
    

Ось коротка функція, яка використовує деякі новіші методи масиву JavaScript для вирівнювання n-мірного масиву.

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

Використання:

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]

Існує заплутано прихований метод, який конструює новий масив без мутації вихідного:

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

Найкраще це можна зробити за допомогою функції зменшення 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);
}, []);

Або з ES2015:

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

js-скрипка

Документи Mozilla

Існує новий власний метод, який називається плоский, щоб зробити це саме.

(Станом на кінець 2019 року, flatтепер опубліковано у стандарті ECMA 2019, і core-js@3(бібліотека бабеля) включає його у свою бібліотеку для полів заповнення )

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

Більшість відповідей тут не працюють на величезних (наприклад, 200 000 елементів) масивах, і навіть якщо вони є, вони повільні. Відповідь polkovnikov.ph має найкращі показники, але вона не працює для глибокого вирівнювання.

Ось найшвидше рішення, яке також працює на масивах з декількома рівнями вкладення :

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

Приклади

Величезні масиви

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

Він обробляє величезні масиви просто чудово. На моїй машині цей код займає близько 14 мс для виконання.

Вкладені масиви

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

Він працює з вкладеними масивами. Цей код виробляє [1, 1, 1, 1, 1, 1, 1, 1].

Масиви з різним рівнем гніздування

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

У них немає проблем з розрівнюванням масивів, як цей.

Оновлення: виявилося, що це рішення не працює з великими масивами. Ви шукаєте кращого, швидшого рішення, ознайомтеся з цією відповіддю .

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

Просто розширюється arrі передає його як аргументи concat(), що об'єднує всі масиви в один. Це рівнозначно [].concat.apply([], arr).

Ви також можете спробувати це для глибокого вирівнювання:

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

Дивіться демонстрацію на JSBin .

Посилання на елементи ECMAScript 6, використані в цій відповіді:

• Оператор розповсюдження
• Функції стрілки

Побічна примітка: такі методи, як find()і функції стрілок, підтримуються не в усіх браузерах, але це не означає, що ви не можете зараз використовувати ці функції. Просто використовуйте Babel - він перетворює код ES6 в ES5.

Ви можете використовувати підкреслення :

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

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

Загальні процедури означають, що нам не потрібно переписувати складність щоразу, коли нам потрібно використовувати певну поведінку.

concatMap(або flatMap) саме те, що нам потрібно в цій ситуації.

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

передбачення

І так, ви правильно це здогадалися, це лише згладжує один рівень, саме так воно має працювати

Уявіть собі такий набір даних

// 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 ] ] ]

Гаразд, скажіть, що ми хочемо надрукувати реєстр, який показує всіх гравців, які братимуть участь у game...

const gamePlayers = game =>
  flatten (game)

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

Якщо наша flattenпроцедура також згладила вкладені масиви, ми б закінчилися з цим результатом сміття…

const gamePlayers = game =>
  badGenericFlatten(game)

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

котиться глибоко, дитино

Це не означає, що іноді ви також не хочете розгладжувати вкладені масиви - тільки це не повинно бути поведінкою за замовчуванням.

Ми можемо зробити deepFlattenпроцедуру з легкістю ...

// 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 ]

Там. Тепер у вас є інструмент для кожної роботи - один для збивання одного рівня гніздування flatten, і один для знищення всіх гнізд deepFlatten.

Можливо, ви можете зателефонувати йому, obliterateабо nukeякщо ім'я вам не сподобається deepFlatten.

Не повторюйте двічі!

Звичайно, вищезазначені реалізації є розумними та стислими, але використання .mapнаступного дзвінка .reduceозначає, що ми робимо більше ітерацій, ніж потрібно

Використання надійного комбінатора, який я телефоную, mapReduceдопомагає зберегти ітерації до мінімуму; вона бере функцію відображення, функцію m :: a -> bвідновлення r :: (b,a) ->bі повертає нову функцію відновлення - цей комбінатор лежить в основі перетворювачів ; якщо вас цікавить, я написав інші відповіді на них

// 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 ]

Рішення для більш загального випадку, коли у вас можуть бути деякі елементи без масиву.

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

Як щодо використання reduce(callback[, initialValue])методуJavaScript 1.8

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

Зробив би роботу.

Ще одне рішення ECMAScript 6 у функціональному стилі:

Оголосити функцію:

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

і використовуйте його:

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

Розглянемо також власну функцію Array.prototype.flat () (пропозиція для ES6), доступну в останніх випусках сучасних браузерів. Завдяки @ (Константин Ван) та @ (Mark Amery) згадували про це у коментарях.

У flatфункції є один параметр, який визначає очікувану глибину вкладення масиву, яка 1за замовчуванням дорівнює .

[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) );

Для вирівнювання масиву одноелементних масивів вам не потрібно імпортувати бібліотеку, простий цикл є і найпростішим, і найефективнішим рішенням:

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

Для людей, що переживають низку супроводу: прочитайте запитання, не зверніть увагу, оскільки воно не відповідає вашій зовсім іншій проблемі. Це рішення є і найшвидшим і найпростішим для заданого питання.

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

Зверніть увагу: Коли Function.prototype.apply( [].concat.apply([], arrays)) або оператор розкидання ([].concat(...arrays) ) використовується для вирівнювання масиву, вони можуть спричинити переповнення стека для великих масивів, оскільки кожен аргумент функції зберігається у стеку.

Ось безпечна реалізація у функціональному стилі, яка зважує найважливіші вимоги один до одного:

• повторне використання
• читабельність
• стислість
• виконання

// 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));

Як тільки ви звикнете до малих функцій зі стрілками у закрученому вигляді, складу функцій та функцій вищого порядку, цей код читається як проза. Потім програмування складається лише з об'єднання невеликих будівельних блоків, які завжди працюють так, як очікувалося, оскільки не містять побічних ефектів.

ES6 Однорядне вирівнювання

Дивіться lodash flatten , підкреслення flatten (неглибокий true)

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

або

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

Тестували с

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

ES6 однорядне глибоке вирівнювання

Див. Lodash flattenDeep , підкреслення вирівнювання

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

Тестували с

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

Ви можете використовувати Array.flat()з Infinityбудь-якою глибиною вкладеного масиву.

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)

перевірити сумісність браузера

Хаскелескій підхід

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 спосіб:

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

Шлях ES5 для flattenфункціонування з резервним пакетом ES3 для N-разів вкладених масивів:

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

Якщо у вас є лише масиви з 1 рядковим елементом:

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

зробить роботу. Bt, що конкретно відповідає вашому прикладу коду.

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

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

(Я просто пишу це як окрему відповідь, грунтуючись на коментарі @danhbear.)

Рекомендую функцію генератора з використанням простору :

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

За бажанням створіть масив сплющених значень таким чином:

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

Я б швидше перетворив весь масив, як є, у рядок, але на відміну від інших відповідей, зробив би це, використовуючи, JSON.stringifyа не використовуючиtoString() метод, який дає небажаний результат.

За допомогою цього JSON.stringifyрезультату все, що залишилося, - зняти всі дужки, знову обернути результат запуском і кінцевими дужками і подати результат, за допомогою JSON.parseякого рядок повертається до "життя".

• Може обробляти нескінченні вкладені масиви без витрат на швидкість.
• Можна правильно обробляти елементи масиву, що представляють собою рядки, що містять коми.

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

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

console.log(flattened)

Виконати фрагмент кодуСховати результати

Розгорніть фрагмент

• Тільки для багатовимірного масиву рядків / чисел (не об'єктів)

Ви також можете спробувати новий Array.Flat()метод. Це працює наступним чином:

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

console.log(arr);

The flat()Метод створює новий масив з усіма елементами суб-масиву об'єднуються в нього рекурсивно до 1 шару глибини (тобто масиви всередині масивів)

Якщо ви також хочете вирівняти тривимірні або навіть більш високі розмірні масиви, ви просто викликаєте плоский метод кілька разів. Наприклад (3 розміри):

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

console.log(arr);

Будь обережний!

Array.Flat()метод порівняно новий. Старіші веб-переглядачі, такі як, можливо, не реалізували метод. Якщо ви хочете, щоб код працював у всіх браузерах, можливо, доведеться перевести JS на старішу версію. Перевірте наявність веб-документів MD на поточну сумісність браузера.

Використання оператора спред:

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

Це не важко, просто повторіть масиви та об'єднайте їх:

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

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

Схоже, це виглядає як робота для РЕКУРСІЇ!

• Обробляє кілька рівнів гніздування
• Обробляє порожні масиви та параметри масиву
• Не має мутації
• Не покладається на сучасні функції браузера

Код:

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

Використання:

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

Я зробив це за допомогою рекурсії та закриття

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

Днями я гуляв з генераторами ES6 і написав цю суть . Що містить ...

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

В основному я створюю генератор, який перетинає вихідний вхідний масив, якщо він знаходить масив, він використовує оператор урожайності * у поєднанні з рекурсією для постійного сплощення внутрішніх масивів. Якщо елемент не є масивом, він дає лише один елемент. Потім за допомогою оператора ES6 Spread (він же оператор splat) я вирівнюю генератор у новий екземпляр масиву.

Я не перевіряв продуктивність цього, але вважаю, що це приємний простий приклад використання генераторів та оператора * віддачі.

Але знову ж таки, я просто гнукав, тому впевнений, що є більш вдалі способи зробити це.

просто найкраще рішення без лодашу

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