什么是N个数组连接的最有效方法?

380

如何在JavaScript中高效地连接N个对象数组?

这些数组是可变的,结果可以存储在其中一个输入数组中。


4
可能是JavaScript中合并/平铺数组的数组的重复问题。 - rofrol
24个回答

7

使用 Push 合并数组:

const array1 = [2, 7, 4];
const array2 = [3, 5,9];
array1.push(...array2);
console.log(array1)

Using Concat and Spread operator:

const array1 = [1,2];
const array2 = [3,4];

// Method 1: Concat 
const combined1 = [].concat(array1, array2);

// Method 2: Spread
const combined2 = [...array1, ...array2];

console.log(combined1);
console.log(combined2);


4

使用concat函数轻松实现:

var a = [1,2,3];
var b = [2,3,4];
a = a.concat(b);
>> [1,2,3,2,3,4]

请记住,不幸的是,这种方法非常低效。https://jsperf.com/concat-small-arrays-vs-push-vs-loop/ - Dan

4
你可以使用jsperf.com网站进行性能比较。这里是连接的链接。
添加了以下比较:
var c = a.concat(b);

并且:

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

第二个在Chrome中几乎慢了10倍。

然而,你可以使用push.apply(),在除了Chrome浏览器之外的所有浏览器中似乎比concat()更快。请参见我的答案。 - Tim Down

3
如果您有一个数组的数组,并想将元素连接成一个单一的数组,请尝试以下代码(需要ES2015):
let arrOfArr = [[1,2,3,4],[5,6,7,8]];
let newArr = [];
for (let arr of arrOfArr) {
    newArr.push(...arr);
}

console.log(newArr);
//Output: [1,2,3,4,5,6,7,8];

如果你喜欢函数式编程

let arrOfArr = [[1,2,3,4],[5,6,7,8]];
let newArr = arrOfArr.reduce((result,current)=>{
    result.push(...current);
    return result;
});

console.log(newArr);
//Output: [1,2,3,4,5,6,7,8];

甚至更好的是使用ES5语法,不使用展开运算符

var arrOfArr = [[1,2,3,4],[5,6,7,8]];
var newArr = arrOfArr.reduce((result,current)=>{
    return result.concat(current);
});
console.log(newArr);
//Output: [1,2,3,4,5,6,7,8];

这种方法在编写代码时不知道数组数量时非常方便。

3

以下是一个函数,可以将多个数组连接在一起:

function concatNarrays(args) {
    args = Array.prototype.slice.call(arguments);
    var newArr = args.reduce( function(prev, next) {
       return prev.concat(next) ;
    });

    return newArr;
}

示例 -

console.log(concatNarrays([1, 2, 3], [5, 2, 1, 4], [2,8,9]));

将输出

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

1

试试这个:

i=new Array("aaaa", "bbbb");
j=new Array("cccc", "dddd");

i=i.concat(j);

@reggie,你们两个都从同一个来源复制粘贴了 ;) - I.devries
我已经查看了与您相同的链接中的信息。http://ilovethecode.com/Javascript/Javascript-Tutorials-How_To-Easy/Javascript_Concat_-_Use_Concat_to_Join_Two_Arrays_in_Javascript.shtml - JAiro
是的...我猜我们从同一个来源得到了它 :D - reggie
至少@JAiro更改了数组内容,@reggie没有。 :) - dogbane
重要的是帮助人们解决问题,无论是什么,都是一样的 :) - JAiro

1
你可以使用这个 -
let array2d = [[1, 2, 3], [5, 4], [7, 8]];

let array1d = array2d.reduce((merged, block) => {
                          merged.push(...block); 
                          return merged; 
                     }, []);

console.log(array1d); // [1, 2, 3, 5, 4, 7, 8]

我喜欢上面某个答案中提到的这个 -
let array2d = [[1, 2, 3], [5, 4], [7, 8]];
console.log([].concat(...array2d)); // [1, 2, 3, 5, 4, 7, 8]

或者我发现的这个 -

let array2d = [[1, 2, 3], [5, 4], [7, 8]];
console.log(array2d.join().split(',').map(Number); // [1, 2, 3, 5, 4, 7, 8]

1

1

其中'n'是一些数组的数量,可能是一个二维数组...

var answer = _.reduce(n, function(a, b){ return a.concat(b)})


1

最快的方法是将数组视为一个数组进行迭代,而不实际连接它们(如果可以的话)。

我很惊讶concat比push略快,除非测试不公平。

const arr1 = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i'];
const arr2 = ['j', 'k', 'l', 'i', 'm', 'n', 'o', 'p', 'q', 'r', 's'];
const arr3 = ['t', 'u', 'v', 'w'];
const arr4 = ['x', 'y', 'z'];

let start;

// Not joining but iterating over all arrays - fastest
// at about 0.06ms
start = performance.now()

const joined = [arr1, arr2, arr3, arr4];

for (let j = 0; j < 1000; j++) {
  let i = 0;
  while (joined.length) {
    // console.log(joined[0][i]);
    if (i < joined[0].length - 1) i++;
    else {
      joined.shift()
      i = 0;
    }
  }
}

console.log(performance.now() - start);

// Concating (0.51ms).
start = performance.now()

for (let j = 0; j < 1000; j++) {
  const a = [].concat(arr1, arr2, arr3, arr4);
}

console.log(performance.now() - start);

// Pushing on to an array (mutating). Slowest (0.77ms)
start = performance.now()

const joined2 = [arr1, arr2, arr3, arr4];

for (let j = 0; j < 1000; j++) {
  const arr = [];
  for (let i = 0; i < joined2.length; i++) {
    Array.prototype.push.apply(arr, joined2[i])
  }
}

console.log(performance.now() - start);

如果您将其抽象化,即使不加入清理器,也可以进行迭代,并且速度仍然快两倍:

const arr1 = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i'];
const arr2 = ['j', 'k', 'l', 'i', 'm', 'n', 'o', 'p', 'q', 'r', 's'];
const arr3 = ['t', 'u', 'v', 'w'];
const arr4 = ['x', 'y', 'z'];

function iterateArrays(arrays, onEach) {
  let i = 0;
  while (joined.length) {
    onEach(joined[0][i]);
    if (i < joined[0].length - 1) i++;
    else {
      joined.shift();
      i = 0;
    }
  }
}

// About 0.23ms.
let start = performance.now()

const joined = [arr1, arr2, arr3, arr4];

for (let j = 0; j < 1000; j++) {
  iterateArrays(joined, item => {
    //console.log(item);
  });
}

console.log(performance.now() - start);


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接