Javascript requestAnimationFrame回调中的时间戳不会更改

我想用两种方式跟踪时间戳，第一种是forloop调用，第二种是setinterval。 但是对于forloop，所有times[]数组中的时间戳都是相同的

var i = 0;
var i2=0;
var times = [];
var times2 = [];

function step(timestamp) {
   times[i++] = timestamp;
}

for (let k=1 ; k < 1111 ; k++) requestAnimationFrame(step);


function step2(timestamp) {times2[i2++] = timestamp;}

rAF = _ => requestAnimationFrame(step2);
const ID = setInterval(rAF,0);
setTimeout( _ => clearInterval(ID) , 200);

console.log(times); // [22.453 , 22.453 , 22.453 ,......] NEVER CHANGE !
console.log(times2); // [ 87.456 , 87.456 , 99.223 ...]

var i=0；
VarI2=0；
var时间=[]；
var times2=[]；
功能步骤（时间戳）{
时间[i++]=时间戳；
}
对于（k=1；k<1111；k++）requestAnimationFrame（步骤）；
函数step2（timestamp）{times2[i2++]=timestamp；}
rAF==>requestAnimationFrame（步骤2）；
常数ID=设置间隔（rAF，0）；
setTimeout（=>clearInterval（ID），200）；
console.log（次）；//[22.453，22.453，22.453，…]永不改变！
console.log（times2）；//[ 87.456 , 87.456 , 99.223 ...]

编辑：以下更改不影响时间[]，始终为相同值

for (let k=1 ; k < 1111 ; k++) {
    for (let o=1 ; o < 11111111 ; o++) {} // i guess it put some delay between each call to requestAnimationFrame
    requestAnimationFrame(step);
}

for（设k=1；k<1111；k++）{
对于（让o=1；o<11111111；o++）{}//我想它会在每次调用requestAnimationFrame之间增加一些延迟
请求动画帧（步骤）；
}

您的

用于（让k=1；k<1111；k++）请求动画帧（步骤）

同时调用所有

requestAnimationFrame

，因此对

step

的所有

1110

调用都安排在下一个动画帧中，因此同时调用所有调用

这将是一个为每个动画帧运行

步骤

功能1111次的设置

function step(timestamp) {
   times[i++] = timestamp;
   if( i < 1111 ) {
      requestAnimationFrame(step)
   }
}

requestAnimationFrame(step)

功能步骤（时间戳）{
时间[i++]=时间戳；
if（i<1111）{
requestAnimationFrame（步骤）
}
}
requestAnimationFrame（步骤）

更改：

for (let k=1 ; k < 1111 ; k++) {
   requestAnimationFrame(step);
}

for（设k=1；k<1111；k++）{
请求动画帧（步骤）；
}

致：

for（设k=1；k<1111；k++）{
对于（让o=1；o<11111111；o++）{}//我想它会在每次调用requestAnimationFrame之间增加一些延迟
请求动画帧（步骤）；
}

---

不会改变任何东西，不管循环需要多长时间。JavaScript是单线程的。从那时起，当循环运行时，中间不会执行其他代码。因此所有

requestAnimationFrame（步骤）将始终排队等待相同的下一个动画帧。
好，但为什么对步骤的调用都同时调用？对于（k=1；k<1111；k++）{do_some_stuff（）；requestAnimationFrame（step）}@philipperoceangermanque，如果调用
requestAnimationFrame
，那么唯一发生的事情就是将传递给
requestAnimationFrame
的函数添加到列表中，在下一个动画帧中，javascript引擎调用此列表中的所有函数。并且下一个动画帧将在当前代码执行结束后的某个时间发生。@Philipper:
delay[…]如果此参数小于10，则使用值10。请注意，实际延迟可能更长
。因此，您设置了一个每隔10+毫秒调用一次的间隔，当它被调用时，它会注册一个回调，该回调应该在下一个动画帧上执行。30fps是每帧约33ms，因此在每个下一个动画帧之前大约会发生2-3次间隔回调。这就是为什么~2-3
step2
具有相同的时间。
for (let k=1 ; k < 1111 ; k++) {
    for (let o=1 ; o < 11111111 ; o++) {} // i guess it put some delay between each call to requestAnimationFrame
    requestAnimationFrame(step);
}