javascript - JavaScript 中的扁平化数组 - 需要解释

Question

我正在读一本名为Eloquent JavaScript的书。其中有一个练习需要展平异构数组，在尝试了很长时间但未能得到答案后，我在网上查找了解决方案，但无法理解代码。我希望有人能好心地解释一下，特别是对于“扁平”的论证以及它应该如何运作。代码如下

var arrays = [[1, 2, 3], [4, 5], [6]];

console.log(arrays.reduce(function(flat, current) {
    return flat.concat(current);
}, []));

Answer 1

书中定义的reduce函数是:

function reduce(array, combine, start) {
  var current = start;
  for (var i = 0; i < array.length; i++)
    current = combine(current, array[i]);
  return current;
}

作为数组的方法，

arr.reduce(combine, start);

让我们看看reduce 方法的每个部分。书中将其描述为“折叠数组，一次一个元素”。 reduce 的第一个参数是“组合器函数”，它接受两个参数:“当前”值和数组中的“下一个”项。

现在，初始“当前”值作为reduce函数的第二个参数给出，在展平数组的解决方案中，它是空数组， []。请注意，一开始，数组中的“下一个”项是第 0 项。

引用书上的观点:“如果你的数组至少包含一个元素，那么你可以省略起始参数。”

还可能令人困惑的是，在扁平化解决方案中，current 被放置为 reduce 的第二个参数，而在上面的 reduce 定义中，current 用于分配累积的折叠值。在展平解决方案中，current 指的是“下一个”arrays 项(单个整数数组)

现在，在缩减的每个步骤中，“当前”值加上下一个数组项被馈送到(匿名)组合器，并且返回值成为更新的“当前”值。也就是说，我们消耗了数组的一个元素并继续下一个项目。

flat 只是累积结果的名称。因为我们希望返回一个平面数组，所以它是一个合适的名称。因为数组有concat函数，所以reduce函数的第一步是(假装我可以分配内部变量)

flat = [];  // (assignment by being the second argument to reduce)

现在，通过执行上面 reduce 定义中所示的步骤，以迭代数组的方式逐步完成归约

  for (var i = 0; i < arrays.length; i++)
    flat = combine(flat, arrays[i]);

调用 combine 会得到 [].concat([1, 2, 3])//=> [1, 2, 3]

那么，

flat = [1, 2, 3].concat([4, 5])  // => [1, 2, 3, 4, 5]

并再次进行下一次缩减迭代。 reduce 函数的最终返回值就是 flat 的最终值。