отметка времени не изменяется в обратном вызове requestAnimationFrame - PullRequest
0 голосов
/ 16 февраля 2019

Я хочу сохранить метку времени двумя способами: во-первых, я отменяю вызов, затем с помощью 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 ...]

EDIT: последующее изменение не влияет на times [], всегда одинаковое значение

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);
}

1 Ответ

0 голосов
/ 17 февраля 2019

Ваш for (let k=1 ; k < 1111 ; k++) requestAnimationFrame(step); вызывает все requestAnimationFrame одновременно, поэтому все 1110 вызовы на step запланированы на следующий кадр анимации, и поэтому они вызываются все одновременно.

Это будет установка для запуска функции step для каждого кадра анимации 1111 раз.

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

requestAnimationFrame(step)

Изменение:

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

на:

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);
}

ничего не меняет, не имеет значения, сколько времени занимает цикл.JavaScript является однопоточным.Начиная с этого цикла, никакой другой код не будет выполняться между ними.Таким образом, все requestAnimationFrame(step); внутри цикла всегда будут поставлены в очередь для того же следующего кадра анимации.

...