为什么 requestAnimationFrame 的许多示例在回调之外调用 requestAnimationFrame？

Question

我在网上看到很多RequestAnimationFrame的例子调用函数两次：在回调内部和外部。我明白为什么我们在里面称呼它；但是，为什么我们将其称为外部？

let myReq;

function step(timestamp) {
  myReq = requestAnimationFrame(step); // I understand why we call it here.
  console.log(timestamp, myReq)
  if(timestamp >= 1000) {
    cancelAnimationFrame(myReq);
  }
}

myReq = requestAnimationFrame(step);  // why invoke rAF here.

Answer 1

这是在下一个动画帧对 step 的初始调用；它实际上是在启动动画。没有它，你有这个：

let myReq;

function step(timestamp) {
  myReq = requestAnimationFrame(step);
  console.log(timestamp, myReq)
  if(timestamp >= 1000) {
    cancelAnimationFrame(myReq);
  }
}

...在这种情况下，我们永远不会有 step 的调用者并且它永远不会被调用。

或者，您可以省略 requestAnimationFrame 对 step 初始调用的包装器：

let myReq;

function step(timestamp) {
  myReq = requestAnimationFrame(step); // I understand why we call it here.
  console.log(timestamp, myReq)
  if(timestamp >= 1000) {
    cancelAnimationFrame(myReq);
  }
}

myReq = step;  // why invoke rAF here.

但是第一次调用 step 时，它不一定会等待第一个可用的动画帧。

为什么 requestAnimationFrame 的许多示例在回调之外调用 requestAnimationFrame？

Why do many examples for requestAnimationFrame invoke requestAnimationFrame outside the callback?

javascript

requestanimationframe