使阵列变平?[].concat(..[array])

Question

我知道[].concat(...array)会使数组变平，但我一直在学习webpack课程，在加载预设的代码中，它使用语法[].concat(...[array])

我对它的理解是：

const array = [[1,2,3], [4,5,6], [7,8,9]];
const result = [].concat(...array);       // [1,2,3,4,5,6,7,8,9]
const result2 = [].concat(...[array]);    // [[1,2,3], [4,5,6], [7,8,9]]

这肯定让我感到困惑，因为课程代码(下面(确实有效，但我看不出[].concat(...[array])实现了什么？

const webpackMerge = require("webpack-merge");
const applyPresets = (env = {presets: []}) => {
const presets = env.presets || [];
/** @type {string[]} */
const mergedPresets = [].concat(...[presets]);
const mergedConfigs = mergedPresets.map(presetName =>
require(`./presets/webpack.${presetName}`)(env)
);
return webpackMerge({}, ...mergedConfigs);
};
module.exports = applyPresets;

有人能给我一个模糊的想法吗？

Answer 1

这有点奇怪。

CCD_ 4方法从多个阵列中获取每个元素并将它们添加到新的阵列中。所以

[].concat([1],[2],[3]) = [1, 2, 3]

现在使用[somevariable]语法，将somevariable放入一个数组中。

let arr1 = [1, 2, 3, 4]
let arr2 = [arr1]
console.log(arr2) // prints [[1, 2, 3]]

最后，...语法(称为扩展语法(本质上是对数组进行反汇编，因此它的元素可以直接访问

function myFunc(...[x, y, z]) {
return x * y* z; // without the dots, we'd have to say arr[0] * arr[1] * arr[2]
}

因此，您感到困惑的[].concat(...[array])表达式确实没有任何作用；它将array放入另一个具有[]语法的数组中，然后立即将其反汇编回具有...语法的数组。等效的表达式是[].concat(array)，由于它只有一个参数，并且contact()方法是在一个空数组上调用的，所以它的作用不大。

Answer 2

让我首先说，我不知道为什么要使用排列运算符。据我所知，[].concat(...[presets])相当于[].concat(presets)。

然而CCD_ 16可能被用于对CCD_ 17进行归一化。如果presets已经是一个数组，那么这只会创建一个浅拷贝。

如果presets不可连接扩展(Symbol.isConcatSpreadable属性设置为错误值(，如"foo"，则将其转换为具有单个元素的数组，输出将为["foo"]。

如果存在可concat扩展的自定义数据类型(将Symbol.isConcatSpreadable属性设置为truthy值(，但不具有所有数组方法。使用此方法可以将其转换为大小为presets.length的数组。

由于输出始终是数组，因此可以使用类似map(mergedPresets.map(的方法，而不必担心presets的类型。

const normalize = presets => [].concat(presets);
console.log(normalize(["foo"]));
console.log(normalize("foo"));
console.log(normalize({
0: "foo",
length: 1,
[Symbol.isConcatSpreadable]: true
}));