带有 setInterval 普通 JS 的 IIFE 和箭头函数

Question

我有以下代码：

 window.setInterval((array => { console.log(array[0]++); console.log(array[1]++); })([0, 0]), 500);

我预计上面的代码每次运行都会产生0和0 （500 毫秒）。 然而，事实并非如此。 它只跑了一次。 当我尝试：

 window.setInterval((array => () => { console.log(array[0]++); console.log(array[1]++); })([0, 0]), 500);

有效。 我认为第一个仍然会每 500 毫秒打印一次0和0 ，因为带有参数array的 IIFE 在每次运行时总是会被赋予值[0, 0] （但是，情况并非如此，它只运行了一次！） . 然后，第二个代码以某种方式允许array “记住”其先前的值并在每次运行时更新其值。 有人可以向我解释一下吗？

Answer 1

传递给setInterval的第一个参数应该是一个函数。 在第一个片段中，您立即调用一个函数并返回undefined ：

window.setInterval((array => {
  console.log(array[0]++);
  console.log(array[1]++);
})([0, 0]), 500);

相当于

window.setInterval(() => {
  // do something, return undefined
})(), 500);

一旦评估了 IIFE：

window.setInterval(undefined, 500);

因此，您需要类似于第二个代码段的内容，其中 IIFE 还返回一个函数：

 window.setInterval((array => () => { console.log(array[0]++); console.log(array[1]++); })([0, 0]), 500);

不过，您可能会考虑在外部 IIFE 中定义array以使代码更清晰一些：

 window.setInterval( (() => { const array = [0, 0]; return () => { console.log(array[0]++); console.log(array[1]++); }; })(), 500 );