Javascript 中的奇怪行为

Question

我一直在研究 JS 并尝试异步行为。我写了以下代码。

console.log("Program started");
[1, 2, 3, 4].forEach((val) => wait2SecondsSync(val))
// console.log("gap");
[1, 2, 3, 4].forEach((val) => wait2SecondsASync(val))

function wait2SecondsSync(val) {
    const date = Date.now() + 2000;
    while (date > Date.now()) { }
    console.log(val);
}

function wait2SecondsASync(val) {
    setTimeout(() => { console.log(val) }, 2000)
}

现在，我在打印 1 2 3 4 后遇到错误，

"TypeError: Cannot read properties of undefined (reading '4')"

。

1. 但奇怪的是，如果在它们之间引入一些代码，比如

   console.log("gap")

   。它按预期工作，
2. 还运行 wait2SecondsASync 单独运行，但不同步 对方使其正常工作。

我不知道发生了什么，也无法准确搜索并找到解决方案。

Answer 1

为了扩展 Jaromanda X，更多细节：

[1, 2, 3, 4].forEach((val) => wait2SecondsSync(val))
[1, 2, 3, 4].forEach((val) => wait2SecondsASync(val))

这些行被解释为 1 条语句。因此，第一个

forEach

（返回）未定义的结果是 then，就像使用第二个 [1,2,3,4]` 访问数组一样。

所以这失败了，因为第一个语句大致是

[1, 2, 3, 4].forEach((val) => wait2SecondsSync(val))[1, 2, 3, 4].forEach((val) => wait2SecondsASync(val))

那么为什么它在

4

上失败呢？这是因为像这样访问数组：

myArray[1,2,3,4].someThing

可能看起来很奇怪，但

1,2,3,4

首先被评估并使用逗号运算符。

该运算符评估列表中的所有内容并最终返回最后一项。所以这相当于：

myArray[4].someThing