Wie verwende ich requestAnimationFrame nenne meine js-Prototyp?

Möchte ich nennen, meine methid animieren indefinetely mit requestAnimationFrame. Aber der Ansatz, den ich verwende, scheint nicht zu funktionieren.. Hier sind meine codes ..

<html>
    <head>
        <meta charset="utf-8">

        <script>
function object(){
    this.index = 0;
}

object.prototype.animate = function(){
    alert("vimak");
    window.webkitRequestAnimationFrame( self.animate);
}
me = new object();
me.animate();

        </script>

    </head>

    <body>
    </body>
</html>

es gibt mir die folgende Fehlermeldung..
Nicht abgefangener Fehler: TYPE_MISMATCH_ERR: DOM Exception 17

Wie kann ich dieses Problem beheben ?

Bearbeitete version

<html>
    <head>
        <meta charset="utf-8">

        <script>
function object(){
    this.index = 0;
}

object.prototype.animate = function(){

    var that = this;console.log(that);
    window.webkitRequestAnimationFrame( that.animate);
}
me = new object();
me.animate();

        </script>

    </head>

    <body>
    </body>
</html>

Die Ausgabe ist

Objekt
requestAnimationFrame.html:12
Fenster
requestAnimationFrame.html:12
Nicht abgefangener Fehler: TYPE_MISMATCH_ERR: DOM Exception 17

Wie mache ich diese Arbeit ?

InformationsquelleAutor Vimal Basdeo | 2012-05-22
  1. 26

    Müssen Sie denke (Debuggen), was bedeuten self auf diesem Zusammenhang.

    Verwenden eine lokale variable zu binden ursprünglichen Kontext:

    var that = this;
window.webkitRequestAnimationFrame( function() { that.animate(); } );

    Oder verwenden Sie den bind Funktion:

    window.webkitRequestAnimationFrame( this.animate.bind(this) );
    • Möchte nur darauf hinweisen, dass .bind() ist sehr langsam, vor allem in Chrom und Sie definitiv nicht wollen, um es mit requestAnimationFrame.
    • Und das erste Beispiel (mit der anonym-Funktion, closure) ist nur betteln für ein Speicher-Leck. Versuchen Sie den Aufruf, dass der code als Ergebnis einer webkitRequestAnimationFrame und sehen, wie schnell dein Speicher wird verbraucht. Das 'callback' ERZEUGT eine anonyme Funktion, jedes mal, wenn es ausgeführt wird. Keine dieser Lösungen wird die Arbeit in Schleife/animation Kontexten...
    InformationsquelleAutor Juan Mellado
Schreibe einen Kommentar