JavaScript - 使用 concat 方法而不是 push 方法连接数组的数组

Question

我有一个问题要求我加入一个数组的数组并以[ array[0][0], array[0][1], array[1][0], array[1][1], etc. ] 的形式返回一个数组。我在嵌套的for循环中使用push方法解决了它，但提示说我应该熟悉concat方法。我知道concat 方法的语法及其工作原理，但我不知道如何使用它来完成提示所要求的操作。

这是我使用push 方法的解决方案：

function joinArrayOfArrays(arr) {
  var joined = [];
  for (var i = 0; i < arr.length; i++) {
    for (var k = 0; k < arr[i].length; k++) {
      joined.push(arr[i][k]);
    }
  } 
  return joined;
}

joinArrayOfArrays([[1, 4], [true, false], ['x', 'y']]);

// => [ 1, 4, true, false, 'x', 'y' ]

如何使用concat 方法返回相同的输出？

Answer 1

尝试使用reduce：

arr.reduce((a, e) => a.concat(e))

Answer 2

您可以使用数组前面的展开元素作为.concat()的参数

let res = [].concat(...[[1, 4], [true, false], ['x', 'y']]);

console.log(res);

使用函数

const joinArrayOfArrays = (arrays = []) => [].concat(...arrays);

let res = joinArrayOfArrays([[1, 4], [true, false], ['x', 'y']]);

console.log(res);

Answer 3

如果你想使用连接，你不需要第二个循环，你可以在一个循环中连接每个子数组。要记住的一件事是concat 不会修改现有数组而是返回一个新数组：

function joinArrayOfArrays(arr) {
  var joined = [];
  for (var i = 0; i < arr.length; i++) {
    joined = joined.concat(arr[i]) // concat sub array
  } 
  return joined;
}

console.log(
  joinArrayOfArrays([[1, 4], [true, false], ['x', 'y']])
);

您也可以以类似的方式使用spread：

function joinArrayOfArrays(arr) {
  var joined = [];
  for (var i = 0; i < arr.length; i++) {
    joined = [...joined, ...arr[i]] // spread
  } 
  return joined;
}

console.log(
  joinArrayOfArrays([[1, 4], [true, false], ['x', 'y']])
);

使用reduce、as suggested by J. Guilherme 是一种更优雅的方法。

Answer 4

如果你正在尝试练习你的数组方法，我建议在 MDN 上查找 reduce 方法，并将这个解决方案作为 for 循环的替代方案来解决这个问题：

function joinArrayOfArrays(arr) {
      return arr.reduce(function(a, b) {
        return a.concat(b);
      }); 
    }

    var output = joinArrayOfArrays([[1, 4], [true, false], ['x', 'y']]);
    console.log(output); 
    // [1, 4, true, false, "x", "y"]