Medizinmann: Warum feuert setTimeout hier nicht nur einmal?

Hallo,

in meiner [allzu oft augenscheinlich obskuren] Welt muss die setTimeout() - Methode zumindest aus zwei Parametern bestehen: der erste Parameter beschreibt, welche Funktion ausgeführt werden soll, der zweite nach welcher Zeit dies zu geschehen hat. So weit so übersichtlich.

Nun bin ich über eines von Adam Khoury's unzweifelhaft [oft] genialen Tutorials gestolpert, dessen Funktionsweise sich mir in Hinblick auf oben beschriebene Methode nicht so recht erschließen will:

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
canvas{border: #999 1px solid;}
</style>
<script type="application/javascript" language="javascript">
function draw(x,y) {
		var canvas = document.getElementById('canvas');
		var ctx = canvas.getContext('2d');
		ctx.clearRect(0,0,550,400);
		ctx.fillStyle = "rgba(0,200,0,1)";
		ctx.fillRect (x, 20, 50, 50);
		x += 2;
		var loopTimer = setTimeout('draw('+x+', '+y+')', 1000);
}
</script>
</head>
<body>
<button onclick="draw(0,0)">Draw</button>
<canvas id="canvas" width="550" height="400"></canvas>
</body>
</html>

Meines Erachtens dürfte laut diesem Script die setTimeout-Methode genau ein EINZIGES Mal feuern; - tut sie aber nicht. Stattdessen wird x jede Sekunde um den Faktor 2 inkrementiert, und das ganz ohne [beispielsweise] einer for- oder einer while-Schleife...

Daher meine [Verständnis-]frage: Warum feuert die setTimeout() - Methode hier jede Sekunde, und nicht, wie zu erwarten wäre, nur EIN EINZIGES Mal nach einer Sekunde?

Vielen Dank für tatkräftige Aufklärungsversuche! Ergebenst, Euer Medizinmann.

  1. Tach,

    Warum feuert die setTimeout() - Methode hier jede Sekunde, und nicht, wie zu erwarten wäre, nur EIN EINZIGES Mal nach einer Sekunde?

    weil jedes mal, wenn die draw-Methode aufgerufen wurde, am Ende ein neuer Timeout gesetzt wird und nach dessen Ablauf die draw Methode aufgerufen wird.

    Ein klarer Fall von Zitat 225.

    mfg
    Woodfighter

    1. Tatsache!

      Danke!

  2. Tach!

    Warum feuert die setTimeout() - Methode hier jede Sekunde, und nicht, wie zu erwarten wäre, nur EIN EINZIGES Mal nach einer Sekunde?

    setTimeout() feuert nur ein einziges Mal, und dabei ruft sie draw() auf, in dem ein setTimeout()-Aufruf steht. Fortsetzung am Beginn des vorherigen Satzes.

    dedlfix.