你能给我解释一下JS代码吗?它是如何工作的?

Can you explain me the JS code ? How its working?

提问人:iamworldian 提问时间:1/12/2023 最后编辑:James Hearniamworldian 更新时间:1/12/2023 访问量:52

问:

console.log([1 , 2, 3 , 4 , 5].map((acc = 0 , num => acc += num)));
// output : [1, 3, 6, 10, 15]

我知道这里已经对这段代码应用了闭包,但不知道它是如何工作的,一步一步 - 我想把它可视化。

我们知道地图上有这个签名:

array.map(function(currentValue, index, arr), thisValue)

有了这个,谁能向我解释上面的代码?

JavaScript 节点 .js 数组 闭包

评论

1赞 pilchard 1/12/2023
仅当您未处于严格模式或已在某处声明时,这才有效。这是使用分组运算符,结合逗号运算符,首先将值同化到,然后将回调传递给 。accaccmap
0赞 iamworldian 1/12/2023
@pilchard它工作的好朋友。请再次检查 jsfiddle.net/peyv13un
0赞 Samathingamajig 1/12/2023
@pilchard你弄错了,那是使用逗号运算符的有效 JavaScript
0赞 pilchard 1/12/2023
@Samathingamajig我详细阐述了我的发言。它在严格模式下无效

答:

2赞 Samathingamajig 1/12/2023 #1

从技术上讲,这是创建一个闭包,但关键部分是声明一个全局变量(除非当前范围内已经存在),使用值初始化它,然后在匿名箭头函数中使用该值。通过使用分组运算符和逗号运算符,它是内联完成的。accacc0

console.log([1 , 2, 3 , 4 , 5].map((acc = 0 , num => acc += num)));
// output : [1, 3, 6, 10, 15]

console.log(acc, window.acc); // acc exists globally

它相当于这样:

acc = 0;
console.log([1 , 2, 3 , 4 , 5].map(num => acc += num));
// output : [1, 3, 6, 10, 15]

console.log(acc, window.acc); // acc exists globally

请注意,在严格模式下,除非您之前声明了变量,否则程序将失败。

"use strict";

console.log([1 , 2, 3 , 4 , 5].map((acc = 0 , num => acc += num)));
// output : ReferenceError: Can't find variable: acc

console.log(acc, window.acc); // acc doesn't exist because program exits

"use strict";

let acc;

console.log([1 , 2, 3 , 4 , 5].map((acc = 0 , num => acc += num)));
// output : [1, 3, 6, 10, 15]

console.log(acc, window.acc); // acc doesn't exist globally, but it does locally

评论

0赞 pilchard 1/12/2023
它要么是关闭,要么是全局的,而不是两者兼而有之。如果您想要在这种情况下闭包,请使用 IIFEconsole.log([1, 2, 3, 4, 5].map(((acc = 0)=> (num) => (acc += num))()));
1赞 Samathingamajig 1/12/2023
@pilchard全局包含在闭包中 MDN “在 JavaScript 中,每次创建函数时,都会在函数创建时创建闭包。”“每个闭包都有三个范围:1.本地范围(自己的范围) 2.封闭范围(可以是块、功能或模块范围) 3.全球范围”
0赞 pilchard 1/12/2023
我想从某种意义上说,acc 将始终以相同的起始值启动,尽管它之后在全局范围内可用。这很公平。
0赞 iamworldian 1/12/2023
因此,我们可以说“acc”一直被维护为全局变量,因此单独的闭包可以访问相同的“acc”,这与通常具有不同词法范围的真实闭包不同。@Samathingamajig