Question

此JavaScript代码段将1作为答案。谁能解释这个代码如何执行？

const b = [1,2,3];
const f = (a, ...b) => a+b;

alert( f( 1 ) );

Answer 1

这里发生了几件事。主要的原因是您正在 shading b上，因此未在函数内使用b。相反，您将在其中创建一个新数组（因为使用了rest parameter，...b）并将其分配给b参数。由于仅使用一个参数调用f，因此该数组为空。 1+[]是"1"，因为当+的两个操作数中的任何一个都不是基元（数组不是基元）时，它被强制为基元，而将数组强制为基元（间接）导致在数组上执行.join(",")。对于空白数组，.join(",")是""。然后，由于其中一个操作数是字符串，因此另一个操作数（1）被强制转换为字符串（"1")，并且它的作用是"1"+""，当然，"1" （有关最后in the spec的详细信息。）

Answer 2

f(1)与1 + []

f(1,2,3)与1 + [2, 3]

仅此而已...

不使用第一行const b = [1,2,3];，因为lambda表达式中的b是参数，而不是之前声明的常量。

Answer 3

您可以在函数 call 中引用变量，但是，当您定义函数表达式时，参数名称不会引用任何变量。

如果您这样调用函数，将会得到预期的结果：

alert(f(1, b));

Answer 4

它将rest parameters ...作为数组b。

当它为空时，它将被转换为一个空字符串，并且两个操作数都被视为字符串，因为如果一个是字符串，那么它将所有值加为字符串。

结果为'1'。

const b = [1, 2, 3];
const f = (a, ...b) => a + '';

console.log(typeof f(1));

Answer 5

在浏览器的开发工具控制台中重现此内容，如下所示：

> b = [1,2,3]
> f = (a, ...b) => a+b
> f(1)
< "1"
// so it results in the string 1, why's that?
// lets try logging what a and b are in the function
> g = (a, ...b) => console.log("a=%o, b=%o", a, b)
> g(1)
< a=1, b=[]
// ah, so b is an array, which is what the spread operator does 
// (gathers all remaining arguments into an array, so the question 
// is then what does JavaScript return for the number 1 added to an empty array?
> 1 + []
< "1"

在不同类型上使用+运算符时，此行为是众多quirks of JavaScript之一。

箭头函数中的JavaScript Spread运算符

5 个答案: