我有一个JavaScript数组,如:

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

如何将单独的内部数组合并为一个,例如:

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

当前回答

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

arr.reduce((acc, val) => acc.concat(val), []);

其他回答

更新:事实证明,这种解决方案不适用于大型阵列。如果您正在寻找更好、更快的解决方案,请查看此答案。


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

Is简单地展开arr并将其作为参数传递给concat(),concat将所有数组合并为一个数组。它相当于[].contat.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元素的引用:

Spread运算符箭头功能


附带说明:并非所有浏览器都支持find()和arrow函数等方法,但这并不意味着您现在不能使用这些功能。只需使用Babel-它将ES6代码转换为ES5。

泛型过程意味着我们不必在每次需要利用特定行为时重写复杂性。

concatMap(或flatMap)正是我们在这种情况下需要的。

//凹面::([a],[a])->[a]常量concat=(xs,ys)=>xs.concat(系统)//concatMap::(a->[b])->[a]->[b】常量concatMap=f=>xs=>xs.map(f).reduce(concat,[])//id::a->a常量id=x=>x(x)//展平::[[a]]->[a]常量展平=concatMap(id)//您的示例数据常量数据=[["$6"], ["$12"], ["$25"], ["$25"], ["$18"], ["$22"], ["$10"]]console.log(展平(数据))

远见

是的,你猜对了,它只会使一个层次变平,这正是它应该工作的方式

想象一下这样的数据集

//玩家::(字符串,数字)->玩家常量玩家=(姓名,号码)=>[姓名、编号]//team::(.Player)->团队const团队=(…玩家)=>玩家//游戏::(团队,团队)->游戏常量游戏=(teamA,teamB)=>[团队A,团队B]//样本数据常量团队A=团队(球员('ob',5),球员('lice',6))常量组B=团队(球员(“恶心”,4),球员(“朱利安”,2))常量游戏=游戏(A队、B队)console.log(游戏)//[[鲍勃,5],[爱丽丝,6],//[['ricky',4],['julian',2]]]

好的,现在假设我们要打印一份名册,显示所有将参加比赛的球员…

const gamePlayers = game =>
  flatten (game)

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

如果我们的展平过程也展平了嵌套数组,我们最终会得到这个垃圾结果…

const gamePlayers = game =>
  badGenericFlatten(game)

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

滚得很深,宝贝

这并不是说有时候你也不想压平嵌套的数组——只是这不应该是默认行为。

我们可以轻松地制作一个deepFlatten程序…

//凹面::([a],[a])->[a]常量concat=(xs,ys)=>xs.concat(系统)//concatMap::(a->[b])->[a]->[b】常量concatMap=f=>xs=>xs.map(f).reduce(concat,[])//id::a->a常量id=x=>x(x)//展平::[[a]]->[a]常量展平=concatMap(id)//deepFlatten::[[a]]->[a]恒定深度展平=凹面贴图(x=>Array.isArray(x)?深度展平(x):x)//您的示例数据常量数据=[0, [1, [2, [3, [4, 5], 6]]], [7, [8]], 9]console.log(展平(数据))// [ 0, 1, [ 2, [ 3, [ 4, 5 ], 6 ] ], 7, [ 8 ], 9 ]console.log(deepFlatten(数据))// [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 ]

那里现在,每个作业都有一个工具——一个用于挤压一层嵌套、展平,另一个用于清除所有嵌套深度展平。

如果你不喜欢deepFlatten这个名字,也许你可以称之为毁灭或核武器。


不要重复两次!

当然,上面的实现是聪明和简洁的,但是使用.map后跟.reduce的调用意味着我们实际上要做的迭代超过了需要

使用我称之为mapReduce的可靠组合器,可以帮助将迭代保持在最小值;它采用一个映射函数m::a->b,一个归约函数r::(b,a)->b,并返回一个新的归约函数-这个组合子是换能器的核心;如果你感兴趣,我已经写了其他关于他们的答案

//mapReduce=(a->b,(b,a)->b,(a,b)->b)常量mapReduce=(m,r)=>(加速度,x)=>r(加速度,m(x))//concatMap::(a->[b])->[a]->[b】常量concatMap=f=>xs=>xs.reduce(mapReduce(f,concat),[])//凹面::([a],[a])->[a]常量concat=(xs,ys)=>xs.concat(系统)//id::a->a常量id=x=>x(x)//展平::[[a]]->[a]常量展平=concatMap(id)//deepFlatten::[[a]]->[a]恒定深度展平=凹面贴图(x=>Array.isArray(x)?深度展平(x):x)//您的示例数据常量数据=[ [ [ 1, 2 ],[ 3, 4 ] ],[ [ 5, 6 ],[ 7, 8 ] ] ]console.log(展平(数据))// [ [ 1. 2 ], [ 3, 4 ], [ 5, 6 ], [ 7, 8 ] ]console.log(deepFlatten(数据))// [ 1, 2, 3, 4, 5, 6, 7, 8 ]

使用排列运算符:

常量输入=[[“$6”],[“$12”],【“$25”】,[“$25“],【”$18“】,【”$22“】,[”$10“]];常量输出=[].contat(…输入);console.log(输出);//-->["$6", "$12", "$25", "$25", "$18", "$22", "$10"]

这是我的版本。它允许您将复杂的对象展平,可以在更多场景中使用:

输入

var input = {
   a: 'asdf',
   b: [1,2,3],
   c: [[1,2],[3,4]],
   d: {subA: [1,2]}
}

Code

功能如下:

function flatten (input, output) {

  if (isArray(input)) {
    for(var index = 0, length = input.length; index < length; index++){
      flatten(input[index], output);
    }
  }
  else if (isObject(input)) {
    for(var item in input){
      if(input.hasOwnProperty(item)){
        flatten(input[item], output);
      }
    }
  }
  else {
    return output.push(input);
  }
};

function isArray(obj) {
  return Array.isArray(obj) || obj.toString() === '[object Array]';
}

function isObject(obj) {
  return obj === Object(obj);
}

用法

var output = []

flatten(input, output);

输出

[“asdf”,1,2,3,1,2,3,4,1,2]

ES6单线压扁

参见lodash flatten,下划线flatten(浅真)

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

or

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 flattendep,下划线flatten

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