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

JavaScript - Join arrays of an array with concat method instead of push method

我遇到一个问题,要求我以 [ array[0][0], array[0][1], array[1][0], array[1][1], etc. ] 的形式连接数组的数组和 return 单个数组。我在嵌套的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 方法 return 获得相同的输出?

尝试使用 reduce:

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

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

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 是一种更优雅的方法。

您可以使用数组前面的展开元素作为参数 .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);

如果您正在尝试练习数组方法,我建议您在 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"]