Wie Javascript Animation in Google T-Rex-Spiel funktioniert?

Question

Ich wundere mich, wie T-Rex-Spiel (Google) tatsächlich mit diesem code animieren. Speziell habe ich mir den Code angesehen und versucht zu verstehen, wie er animiert. Soweit ich weiß, sollte die Update-Funktion (die Prototyp in der Quelldatei ist) immer wieder aufgerufen werden, um Animation zu ermöglichen. Allerdings kann ich nichts sehen, das Update-Funktion mehrmals aufruft. Und dieser Quellcode ist mit selbstaufrufenden Funktion geschrieben und es gibt einen Konstruktor namens Runner am Anfang des Codes. Meine Frage ist, wird dieser Konstruktor von selbst aufgerufen?

Auf meine Frage zusammenzufassen,

Mit diesem Code kann jemand erklären, wie Animation eigentlich? Gibt es irgendeine Möglichkeit für Runner's Prototyp (Sie können es finden, wenn Sie den Quellcode auf Links sehen) von Browser aufgerufen werden oder was auch immer ..?

Und, wenn Selbstaufruf-Funktion von selbst gestartet wird, wird Konstruktor oder innere Funktion zur gleichen Zeit aufgerufen ..?

Dank im Voraus plz jemand Licht darauf.

Answer 1

Ich denke, ich habe es herausgefunden.

Also nennt sich die Update-Methode rekursiv auf Umwegen.

Am Ende up-Update haben Sie diese Aussagen

if (!this.crashed) { 
    this.tRex.update(deltaTime); 
    this.raq(); 
} 

Die Magie mit dem raq Verfahren geschieht. Es ruft die Update-Methode erneut auf. requestAnimationFrame ist eine Browser-Methode, die eine Reanimation des Bildschirms anfordert, wobei der Callback aufgerufen wird, bevor die Animation ausgeführt wird. Daher ist die update Methode erneut aufgerufen wird, die es raq wieder nennen wir die update wieder Anrufe, etc ...

raq: function() { 
    if (!this.drawPending) { 
     this.drawPending = true; 
     this.raqId = requestAnimationFrame(this.update.bind(this)); 
    } 
}, 

Zum Vergleich: https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame

auf, wie die Anwendung tatsächlich beginnt, ich denke, es hat mit Annotationen und dem Closing-Compiler zu tun haben. Die @export Annotation auf Runner bedeutet, dass eine Instanz davon von der Self Invoker-Funktion erstellt wird.

Dann wird der Konstruktor ruft loadImages die init ruft die update