ES6 扩展运算符不会展平数组吗？

Question

没有具体反应，所以希望可以问，但我认为扩展运算符会使数组变平？

因此，使用以下对 args 求和的 sum 函数，您可以使用 .apply 传入值：

function sum() {
    return arguments.reduce((total, number) => total + number, 0);
}

var values = [2, 4, 8, 12, 16];

console.log(sum.apply(null, values));

我认为您可以只添加函数并使用扩展运算符来展平数组，以便可以使用调用。 （我知道你不会在这种情况下使用 call ，但我只是感到惊讶，因为我认为传播使数组变平：

function sum() {
    return [...arguments].reduce((total, number) => total + number, 0);
}

var values = [2, 4, 8, 12, 16];

console.log(sum.call(null, values));

这将返回字符串02,4,8,12,16

Answer 1

发生这种情况是因为arguments 类似于数组。数组变为字符串。

作为call documentation says，

虽然此函数的语法与 apply() 的语法几乎相同，但根本区别在于 call() 接受参数列表，而 apply() 接受单个参数数组。

这应该可以按预期工作：

sum(...values);
sum.call(null, ...values);
sum.apply(null, values);

顺便说一句，arguments 和 call 在 ES6 中是不受欢迎的。

Answer 2

arguments 是一个类似数组的结构，因此在将数组作为参数传递时，该结构就像一个嵌套数组。因此，应用扩展运算符会生成格式为[[2, 4, 8, 12, 16]]（即[...[[2, 4, 8, 12, 16]]]）的数组，reduce 方法应用0 + [2, 4, 8, 12, 16] 并生成"02,4,8,12,16"。

要使其工作，您需要使用 Function#apply 将数组值作为参数传递或获取第一个参数。

function sum() {
  return [...arguments].reduce((total, number) => total + number, 0);
}

var values = [2, 4, 8, 12, 16];

console.log(sum.apply(null, values));

function sum() {
  return [...arguments][0].reduce((total, number) => total + number, 0);
}

var values = [2, 4, 8, 12, 16];

console.log(sum.call(null, values));

参考：What is the difference between call and apply?