Kalle_B: setInterval / clearInterval innerhalb eines Objekts?

Hallöle,

möchte ein graphisches Objekt über den Bildschirm bewegen und habe dazu eine Prototype gemacht. Die Bewegung sollte durch Neuberechnung der Position und anschliessende Anzeige erfolgen.

Wie kann ich setInterval und clearInterval innerhalb des Prototypen einbinden? Meine Lösung klappt nicht. Fehlermeldung der Javascript-Konsole: "this.neuePosition is not a function".

Der Aufruf ausserhalb des Prototypen funktioniert, aber dann ist nicht klar, wie ich den clearInterval einsetzen soll.

function fahrzeug(id,x,y,ri)
{
  this.id   = id;
  this.x    = x;
  this.y    = y;
  this.ri   = ri;

this.aktiv = setInterval('this.neuePosition()',50); // START

this.neuePosition = function()
  {
    if ( this.x < 500 )
    {
      this.x++;
      this.y++;
      document.getElementById(this.id).style.left = this.x;
      document.getElementById(this.id).style.top  = this.y;
    }
    else
    {
      clearInterval(this.aktiv); // STOP
    }
  }
}

f01 = new fahrzeug("f01",10,10,"N");
//f01_aktiv = setInterval('f01.neuePosition()',50); // das funzt

Lieben Gruß, Kalle

  1. Moin!

    Wie kann ich setInterval und clearInterval innerhalb des Prototypen einbinden? Meine Lösung klappt nicht. Fehlermeldung der Javascript-Konsole: "this.neuePosition is not a function".

    Das, was du setInterval (oder setTimeout) als String übergibst, muß ein im Hauptprogramm ausführbarer Befehl sein. "this" ist dort nicht definiert.

    this.aktiv = setInterval('this.neuePosition()',50); // START

    In deinem Prototypen hast du "this", in setInterval nicht.

    f01 = new fahrzeug("f01",10,10,"N");
    //f01_aktiv = setInterval('f01.neuePosition()',50); // das funzt

    Weil du ein absolutes Objekt angibst.

    - Sven Rautenberg

    --
    "Love your nation - respect the others."
    1. Moin, Sven!

      Das, was du setInterval (oder setTimeout) als String übergibst, muß ein im Hauptprogramm ausführbarer Befehl sein. "this" ist dort nicht definiert.

      Aha, also

      this.aktiv = setInterval(this.id + '.neuePosition()',50); // START

      Jooooop! Läuft!

      Und

      clearInterval(this.aktiv); // STOP
        alert ( 'Stop ' + this.id );

      Stoppt. Echt geil.

      Kalle

      1. this.aktiv = setInterval(this.id + '.neuePosition()',50); // START

        Jooooop! Läuft!

        Nein, nur zufällig, weil deine id die Gleiche ist wie der Name deiner Objektvariabel.

        Struppi.

        --
        Javascript ist toll (Perl auch!)
        1. Jooooop! Läuft!

          Nein, nur zufällig, weil deine id die Gleiche ist wie der Name deiner Objektvariabel.

          Hää? Was ist eine Objektvariabel?

          Der Name ist gleich der id des div:

          f01 = new fahrzeug("f01",10,10,"N",3);
          ...
          <div id=f01 class=fx>1</div>

          also "f01" (Javascript) und id=f01 (HTML) sind identisch.

          Du meinst, das ist Zufall?

          Kalle

          1. Nein, nur zufällig, weil deine id die Gleiche ist wie der Name deiner Objektvariabel.

            Hää? Was ist eine Objektvariabel?

            Der Name ist gleich der id des div:

            f01 = new fahrzeug("f01",10,10,"N",3);

            ^^^^
            Das ist die Objektvariabel, nenn sie mal anders.

            also "f01" (Javascript) und id=f01 (HTML) sind identisch.

            Du meinst, das ist Zufall?

            sicher du kannst das JS-Objekt x-beliebig benennen oder auch in einer Funktion lokal erzeugen (mit var, sollte man sowieso immer verwenden) und dann funktioniert das auch nicht mehr.

            z.b.

            window.onload = function()
            {
               var f01 = new fahrzeug("f01",10,10,"N",3);
            }

            Struppi.

            --
            Javascript ist toll (Perl auch!)
  2. Wie kann ich setInterval und clearInterval innerhalb des Prototypen einbinden? Meine Lösung klappt nicht. Fehlermeldung der Javascript-Konsole: "this.neuePosition is not a function".

    Du hast keinen protoypen, lediglich eine Konstruktorfunktion, die Eigenschaften und Methoden deklariert.

    Der Aufruf ausserhalb des Prototypen funktioniert, aber dann ist nicht klar, wie ich den clearInterval einsetzen soll.

    function fahrzeug(id,x,y,ri)
    {
      this.id   = id;

    Ich würd mir überlegen, ob du hier wirklich die id brauchst und bei jedem Aufruf das Objekt neu suchen willst oder nicht lieber an einer Stelle das Objekt speicherst.

    this.x    = x;
      this.y    = y;
      this.ri   = ri;

    this.aktiv = setInterval('this.neuePosition()',50); // START

    Ein altes Problem, der String 'this.neuePosition()' wird im globalen Kontext ausgeführt, also unter window. D.h. this=window und window.neuPostion() existiert nicht.

    Da du nur neuere Browser berücksichtigen willst kannst du
    this.aktiv = setInterval(this.neuePosition,50);

    schreiben (wobei ich das nicht in den Konstruktor packen würde)

    this.neuePosition = function()

    Wie im anderen Thread schon gesagt, das ist ein priviliegierte Funktion, pack die in den prototype

    {
        if ( this.x < 500 )
        {
          this.x++;
          this.y++;
          document.getElementById(this.id).style.left = this.x;
          document.getElementById(this.id).style.top  = this.y;

    Das geht gar nicht, ohne Einheit sollte das gar nicht funktionieren, oder benutzt du etwa den IE?
    In der Regel ist das keine gute Idee, gerade wenn du größere Skripte entwickelst, die Fehlermeldungen sind unbrauchbar und die Fehlertoleranz des IEs ist viel zu gross als dass dui Skripte schreiben kannst, von denen du auch was lernst.

    Struppi.

    --
    Javascript ist toll (Perl auch!)
    1. Hallo,

      Da du nur neuere Browser berücksichtigen willst kannst du
      this.aktiv = setInterval(this.neuePosition,50);
      schreiben (wobei ich das nicht in den Konstruktor packen würde)

      Hm, was soll das ändern?

      this zeigt auch dann auf window, weil der Bezug zum Objekt verloren geht, wenn man setTimeout das Funktionsobjekt als Parameter übergibt.

      Mathias

      1. Da du nur neuere Browser berücksichtigen willst kannst du
        this.aktiv = setInterval(this.neuePosition,50);
        schreiben (wobei ich das nicht in den Konstruktor packen würde)

        Hm, was soll das ändern?

        Im Bezug zur Fragestelung nichts, aber ich halte es nicht für besonders klug vom Programmablauf, einem Objekt im Konstruktor schon eine solche aktion zu starten. Sinnvoller wäre es IMHO eine Methode zum starten/stoppen der Bewegung zu deklarieren.

        Struppi.

        --
        Javascript ist toll (Perl auch!)
    2. Du hast keinen protoypen, lediglich eine Konstruktorfunktion, die Eigenschaften und Methoden deklariert.

      Unterschied habe ich nicht verstanden. Was macht die Konstruktorfunktion zum Prototypen? Oder braucht man beides?

      Ich würd mir überlegen, ob du hier wirklich die id brauchst und bei jedem Aufruf das Objekt neu suchen willst oder nicht lieber an einer Stelle das Objekt speicherst.

      Wäre vielleicht für die Ablaufgeschwindigkeit vorteilhaft. Schon bei zwei bewegten Objekten ruckelt es manchmal.

      document.getElementById(this.id).style.left = this.x;
            document.getElementById(this.id).style.top  = this.y;

      Das geht gar nicht, ohne Einheit sollte das gar nicht funktionieren, oder benutzt du etwa den IE?

      Nöö, der FF 1.5 schluckt das. Habe ich ergänzt mit +'px'

      Der IE 5.0 meldet "Das Objekt unterstützt dies Eiegenschft oder Methode nicht" und verweist auf das erste Zeichen der Zeile

      f01 = new fahrzeug("f01",10,10,"N");

      ... und die Fehlertoleranz des IEs ist viel zu gross als dass dui Skripte schreiben kannst, von denen du auch was lernst.

      Deshalb schaue ich mir ja lieber die Javascript-Konsole des FF an. Aber teste dann doch auch mit dem IE. Und der will nicht.

      Kalle

      1. Du hast keinen protoypen, lediglich eine Konstruktorfunktion, die Eigenschaften und Methoden deklariert.

        Unterschied habe ich nicht verstanden. Was macht die Konstruktorfunktion zum Prototypen? Oder braucht man beides?

        Gar nichts, jedes Objekt hat einen prototypen und ein Objekt erzeugst du aus einer Konstruktorfunktion (Jede Funktion kann eine Konstruktorfunktion sein, erst durch das Schlüsselwort new() wird es ein Objekt).

        Ich würd mir überlegen, ob du hier wirklich die id brauchst und bei jedem Aufruf das Objekt neu suchen willst oder nicht lieber an einer Stelle das Objekt speicherst.

        Wäre vielleicht für die Ablaufgeschwindigkeit vorteilhaft. Schon bei zwei bewegten Objekten ruckelt es manchmal.

        Das ist normal.

        document.getElementById(this.id).style.left = this.x;
              document.getElementById(this.id).style.top  = this.y;

        Das geht gar nicht, ohne Einheit sollte das gar nicht funktionieren, oder benutzt du etwa den IE?

        Nöö, der FF 1.5 schluckt das. Habe ich ergänzt mit +'px'

        Dann läßt du deine Seiten im Quriksmode darstellen, auch nicht unbedingt gut.

        Der IE 5.0 meldet "Das Objekt unterstützt dies Eiegenschft oder Methode nicht" und verweist auf das erste Zeichen der Zeile

        Welcher Zeile?

        Struppi.

        --
        Javascript ist toll (Perl auch!)