Javascript for循环的确切执行顺序是什么？

Question

我对Codepen中正在使用的特定for循环的执行顺序感到有点难过.看看这两个循环,它们都做同样的事情:

var a = ['orange','apple']; 
for (var i=0; i<2;i++) {
    alert(a[i]);
}

for (var j=0, fruit; fruit = a[j++];) {
    alert(fruit);
}

你可以在这里看到这个:http://codepen.io/nickbarry/pen/MYNzLP/

第一个循环是编写for循环的标准,vanilla方式.正如预期的那样,它会提醒"橙色",然后是"苹果".

我使用MDN的建议编写了第二个循环(搜索"idiom",这里:https://developer.mozilla.org/en-US/docs/Web/JavaScript/A_re-introduction_to_JavaScript).

它有效,但我不太明白为什么.我对for循环的理解显然是不正确的(不止一种方式？)是:*for循环在第一次运行之前计算第二个表达式的真实性.因此,当for循环正在评估第二个表达式的真实性时,它应该在设置fruit的值之前增加j.因此,第一次通过循环,水果应该等于"苹果".*并且循环应该只运行一次,因为在第一次通过之后,当它再次评估第二个表达式以查看它是否仍然为真时,它应该再次增加j,然后将值返回到fruit,并且因为没有值在索引位置2,它应返回一个假结果,并退出循环.

我不明白究竟发生了什么.在评估第二个表达式之前,for循环是否运行一次？但这似乎是不可能的,因为如果发生这种情况,警报会在第一时间发出警报,因为水果还没有价值.

此外,MDN文章的作者似乎喜欢编写循环的第二种方式 - 是否有更好的方法？它使用较少的字符,这是好的,我想.跳过for循环中的第三个表达式可以节省大量时间吗？或者它只是一个"它很酷,因为它很聪明"的东西？

Answer 1

for (var j=0, fruit; fruit = a[j++];) {
    alert(fruit);
}

在伪代码中等于:

initialize j = 0 and fruit = undefined

assign fruit = a[j] (j = 0, fruit = 'orange')
j = j + 1 (j = 1)
check fruit for being truthy (true)

alert(fruit) ('orange')

assign fruit = a[j] (j = 1, fruit = 'apple')
j = j + 1 (j = 2)
check fruit for being truthy (true)

alert(fruit) ('apple')

assign fruit = a[j] (j = 2, fruit = undefined)
j = j + 1 (j = 3)
check fruit for being truthy (false)

exit loop

重要的提示:

后缀一元运算++符的工作原理如下:

1. 我们返回变量的当前值
2. 我们增加变量的值

跳过for循环中的第三个表达式可以节省大量时间吗？

它根本不保存任何东西

此外,MDN文章的作者似乎喜欢编写循环的第二种方式 - 是否有更好的方法？

它在任何方面都不是更好.作者只是认为这很酷,作者喜欢很酷(虽然他们不喜欢).