Cooperative asynchronous JavaScript: Timeouts and intervals

I would like to seek some help here. I didn’t get the code with the underline and in the red circle.
Not sure why we need to set variable startTime to null. What that if does? Where can tell us ‘startTime’ is the time that when requestAnimationFrame() started and timestamp is the time that since the requestAnimationFrame() started running? Thank you.

1 Like

Hi @Laura!

We declare the variable startTime in the global scope so it is available to the whole system, not just inside the function. It wouldn’t work if it were trapped inside the function scope.

We set it to null initially so that when the program first loads there is no startTime set. To be honest, we probably could have just not set a value at all initially, and it would also work (i.e. just let startTime;)

The if block is saying “if startTime is false (i.e. it has no value; null works here as is a falsy value), then set startTime’s value to equal the current timeStamp”. It will only be set once, the first time the callback runs. After that, startTime will resolve to true, so therefore the code inside the if block will no longer run.

‘timeStamp’ is a parameter automatically made available to any callback passed to a requestAnimationFrame() function call.

1 Like

Hi @chrisdavidmills, thank you for your help.
Can I remove the code as below from the code block showed on the screenshot? I think the effect would be the same, right?

if (rotateCount > 359) { rotateCount %= 360; }

1 Like

@Laura yes, I don’t think that is needed. If I remember rightly, it was included so that the rotateCount number doesn’t get ridiculously big — it basically returns it to 1 when it gets to 360. Keeping it in the range of 1-360 makes any other math you want to perform on it simpler, plus also eventually the code would break if the number got too big (computers have a maximum size of number they can deal with). This would take a long time, but it would happen eventually :wink:

2 Likes