<< Bedingte Anweisungen | Inhaltsverzeichnis | Index | Objekte, Eigenschaften, Methoden >>

Wikipedia hat einen Artikel zum Thema:

JavaScript

Schleifen

Schleifen dienen dazu, bestimmte Programmteile zu wiederholen. Je nach Anwendungszweck gibt es hier mehrere Konstruktionsmöglichkeiten.

for – Zählschleifen

Mit Hilfe von for - Zählschleifen werden Programmteile wiederholt, wenn die Anzahl der Wiederholungen bekannt und vom Programmierer festgelegt wird.

Syntax


for (var Zählvariable = StartWert; Zählvariable <= Endwert; Zählvariable_erhöhen/vermindern)
   {
   Schleifenanweisung_1;
   Schleifenanweisung_2;
       .....
   Schleifenanweisung_n;
   }

Die Zählvariable wird auf den Startwert gesetzt, der Vergleich mit dem Endwert wird definiert ( < , <= , > oder >= ) und die Anweisung zur Veränderung des Zählers nach dem Schleifendurchlauf wird festgelegt.

Beispiel : in 1-er-Schritten vorwärts

Die folgende Schleife zählt einfach vorwärts von 1 bis 10 :

for (var i = 1; i <= 10; i++)
   {
   document.write(i);
   }

Beispiel : in 0.2-er-Schritten rückwärts

Die folgende Schleife zählt in 0.2-Schritten rückwärts von 1 bis 0 :


for (var i = 1; i >= 0; i=i-0.2)
   {
      document.write(i);
   }

Beispiel: Quadrat-Zahl-Tabelle

Man könnte mit Hilfe einer Zählschleife eine Quadratzahl-Tabelle ausgeben - mathematisch keine besonders anspruchsvolle Anwendung, der Mechanismus der Zählschleife wird aber gut deutlich:

<html>

<head>
  <title>Tabelle</title>
  
  <SCRIPT type="text/javascript">
  
     function fQuadrat(dZ)
      {
      var dQ=dZ*dZ;
      return dQ;
      }
        
     function fTabelle()
      {
        var iZeilen=parseInt(document.frmTabelle.txtZeilen.value);
        if(iZeilen>=1)
        {
         with(document)
         {
          open();
          write("<HTML>");
          write("   <HEAD>");
          write("      <TITLE>Tabelle der Quadratzahlen mit Java-Script<\/TITLE>");
          write("   <\/HEAD>");
          write("   <BODY>");
          write("   <H3>Tabelle der Quadratzahlen von 1 bis " + iZeilen + "<\/H3>");
          write("      <TABLE BORDER=1>");
          write("         <TR>");
          write("            <TD>Zahl<\/TD><TD>Quadrat<\/TD>");
          write("         <\/TR>");
  
  // ================ Beginn der Zaehlschleife: ==================
          for (var i = 1; i <= iZeilen; i++)
          {
            write("         <TR>");
            write("            <TD>" + i + "<\/TD><TD>" + fQuadrat(i) +"<\/TD>");
            write("         <\/TR>");
          }
  // ================ Ende der Zaehlschleife =====================
   
          write("      <\/TABLE>");
          write("   <\/BODY>");
          write("<\/HTML>");
          close();
         }
        }
        else
        {
        alert("Groesser als 1 habe ich gesagt!");
        }
       }

  </script>

</head>

<body>
  <form method="get" name="frmTabelle">
    <h3>Tabelle der Quadratzahlen erzeugen</h3>
    Gib eine ganze Zahl groesser 1 ein:
    <input type="text" name="txtZeilen">
    <input type="button" name="btnStart" value="Start"
      onClick="javascript:fTabelle()">
  </form>
</body>

</html>

Beispiel: Teilerliste einer Zahl

Auch alle Teiler einer Zahl lassen sich mit Hilfe einer for-Schleife und der in dem Kapitel "Bedingte Anweisungen" bereits besprochen Teilbarkeitsfunktion ausgeben:

<html>

<head>
  <title>Teilerliste einer Zahl n</title>
</head>

<body>
  <script type="text/javascript">
  
     function fTeiler(iZ,iT)
      {
         var iR =0;
         if(iT!=0) //Division durch 0 ist verboten!
         {
           iR=iZ%iT;
           if(iR==0)
           {
              //Es bleibt kein Rest - iZ ist teilbar durch iT
              return true;
           }
           else
           {
              //Es bleibt ein Rest - iZ ist nicht teilbar durch iT
              return false;
           }
        }
        else
        {
         //wegen verbotener Division durch 0 nicht teilbar
         return false;
        }
      }
        
     function fTeilerAusgabe()
     {
        with(document.frmTeiler)
        {
           tAusgabe.value="";
           var iZahl=parseInt(txtZahl.value);  //Text in Integer übersetzt
           var bOK=false;
           if(iZahl>=1)
           {
            for (var iT=1 ; iT<=iZahl ; iT++) // von 1 bis Zahl hochzählen
             {
             bOK=fTeiler(iZahl,iT);//Funktionsaufruf fTeiler
             if(bOK==true)
              {
                tAusgabe.value=tAusgabe.value + iT + "\n";
              }
             }
           }
           else
           {
              alert("Größer als 1 habe ich gesagt!");
           }
        }
     }

  </script>
   <form method="get" name="frmTeiler">
   <h3>Berechnung der Teilermenge einer Zahl n</h3>
       <b>Gib eine ganze Zahl n &gt; 1 ein:</b><br>
       <input type="text" name="txtZahl"><br>
       <input type="button" name="btnStart" value="Berechnung starten"
         onClick="fTeilerAusgabe()">
       <br>
       <textarea name="tAusgabe" cols="20" rows="50"></textarea>
   </form>
</body>

</html>

for / in - Schleifen

for / in - Schleifen werden benutzt, um alle Elemente eines Objektes oder eines Arrays nacheinander anzusprechen oder alle Eigenschaften eines Objektes nacheinander zu lesen.

Syntax


for (var Eigenschaft in Objekt)
    ... Objekt[Eigenschaft] ...

Beispiel: Eigenschaften des Window-Objektes

Das folgende Programm gibt alle Eigenschaften des Objektes „Window“ aus.

<html>
  <head>
     <title>Eigenschaften des Objektes window</title>
  </head>
  <body>
    <script type="text/javascript">

      var sProp = "";
      var curTyp = ""; 
      document.write("<h1>Eigenschaften von <u>Window<\/u><\/h1>");
      for (var Prop in window) {
        curTyp = typeof window[Prop];
        sProp = (curTyp=="function"||curTyp=="object") ? curTyp : window[Prop];
        document.write("window." + Prop + ": " + sProp + "<br>");
      }

    </script>
  </body>
</html>

while – kopfgesteuerte Schleifen

while-Schleifen werden eingesetzt, wenn die Schleife ausgeführt werden soll, solange eine Bedingung erfüllt ist. Bei der ersten Nichterfüllung der Bedingung bricht die Schleife ab. Die Bedingung wird bereits vor dem ersten Schleifendurchlauf geprüft – man spricht deshalb von einer „pre-checked-loop“ oder einer „kopfgesteuerten Schleife“. Der Code innerhalb einer Schleife dieser Art, wird anders als in einer „do / while“-Schleife – unter Umständen (wenn die Kopfbedingung nicht erfüllt ist) nicht ein einziges Mal ausgeführt.

Syntax


while(Bedingung)
   {
   Anweisung_1;
   Anweisung_2;
      ...
   Anweisung_n;
   }

Beispiel: iterative Berechnung der Quadratwurzel

Das folgende Skript berechnet die Quadratwurzel einer Zahl mit einem Näherungsverfahren. So lange die Differenz der Näherungen einen vorgegebenen Wert nicht unterschreitet, wird die Näherung weiter verbessert. Die Näherung wird mit einer „while“-Schleife ermittelt.

<html>
   <head>
      <title>Quadratwurzel</title>
      <script type="text/javascript">

         var x=Math.abs(parseInt(prompt("Bitte geben Sie eine Zahl ein :")));
         var sq1=0;
         var sq2=x; //1. Näherung wird auf die Zahl selbst gesetzt
         while((sq2-sq1)>=0.000000000000001)
            {
            sq1=x/sq2;
            sq2=(sq1+sq2)/2;
            }
            alert("Quadrat-Wurzel aus " + x + " ist " + sq2)

      </script>
   </head>
   <body>
   </body>
</html>

do / while – fußgesteuerte Schleifen

Bei do/while-Schleifen wird die Wiederholungs-Bedingung erst geprüft, nachdem die Anweisungen in der Schleife ausgeführt wurden. Deshalb heißen diese Schleifen auch „post-checked-loops“ oder „fußgesteuerte Schleifen“. Ist die Bedingung erfüllt, wird die Schleife ein weiteres Mal durchlaufen. Wie aus dem eben gesagten hervorgeht, wird der Kode innerhalb einer Schleife dieser Art in jedem Fall mindestens einmal ausgeführt.

Syntax

do
   {
   Anweisung_1;
   Anweisung_2;
      ...
   Anweisung_n;
   }
while(Bedingung)

Beispiel: Ermitteln des größten gemeinsamen Teilers (GGT)

Der größte gemeinsame Teiler von zwei Zahlen (z. B. wichtig zum Kürzen von Brüchen) wird hier mit dem Verfahren der Kettendivision ermittelt. Der Kern der Arbeit wird in der Funktion „fGGT“ innerhalb einer „DO / WHILE“-Schleife verrichtet.

<html>

   <head>
      <title>JavaScript - Beispiel fuer eine 'DO WHILE'-Schleife</title>
      <script type="text/javascript" >

       function fGGT(iX,iY)
         {
           //ermittelt den GGT nach dem Verfahren der Kettendivision
           var a= Math.max(iX,iY)
           var b= Math.min(iX,iY);
           var rest=0
           do
              {
              rest = a%b;
              a=b;
              b= rest;
              }
           while(rest>0)
           return a;
         }

         function fBerechne()
            {
               with (document.frmGGT) 
               {
                  //Auslesen der Textfelder und sichertsellen nummerischer Werte
                  // 1.Feld
                  iX = parseInt(txtZahl1.value);
                  txtZahl1.value = iX;
                  // 2.Feld
                  iY = parseInt(txtZahl2.value);
                  txtZahl2.value = iY;
                  //Aufruf der Funktion fGGT
                  txtGGT.value   = fGGT( iX, iY );
               } 
            }

      </script>

   </head>

   <body>
      <h1>Ermittlung des groessten gemeinsamen Teilers (ggT) zweier Zahlen</h1>
      <form method="get" name="frmGGT">
         <h2>Eingabe</h2>
         <p>
           a = <input type="text" name="txtZahl1"><br>
           b = <input type="text" name="txtZahl2">
           <input type="button" name="btnStart" value="ggT ermitteln"
             onClick="fBerechne()">
         </p>
         <h2>Ergebnis</h2>
         <p>
           ggT =  <input type="text" name="txtGGT">
         </p>
      </form>
   </body>

</html>

break / continue

break / continue ermöglichen es Programmierern, Bedingungen zu bestimmen, unter denen Schleifen anders als üblich durchlaufen werden sollen.

break

Im Zusammenhang mit der „switch“-Anweisung wurde das Kommando break bereits vorgestellt. In Schleifen bewirkt break nichts anderes, als schon dort erläutert, d. h. durch break wird eine Schleife sofort beendet und zwar auch dann, wenn die Schleifenbedingung – etwa in einer „DO / WHILE“-Schleife – noch „true“ ist.

Beispiel

for(var i=1; i<=10; i++)
   {
   document.write(i);
   if(i==3) break;
   }

Diese Schleife würde nur bis 3 zählen, obwohl die Zählvariable ursprünglich bis 10 laufen soll.

continue

Mit „continue“ können wir aus einer Schleife heraus vorzeitig ihren nächsten Durchlauf erzwingen. Im nächsten Beispiel wird mit diesem Kommando ein Fehler vermieden, der von einer Division durch 0 ausgelöst werden würde.

Beispiel

for(var i=-10; i<=10; i++)
   {
   if(i==0)
      continue;
   document.write(1/i);
   }

Aufgaben + Lösungen

<< Bedingte Anweisungen | Inhaltsverzeichnis | Index | Weblinks | Objekte, Eigenschaften, Methoden >>

Websiteentwicklung: JavaScript: Schleifen

Schleifen

for – Zählschleifen

Syntax

Beispiel : in 1-er-Schritten vorwärts

Beispiel : in 0.2-er-Schritten rückwärts

Beispiel: Quadrat-Zahl-Tabelle

Beispiel: Teilerliste einer Zahl

for / in - Schleifen

Syntax

Beispiel: Eigenschaften des Window-Objektes

while – kopfgesteuerte Schleifen

Syntax

Beispiel: iterative Berechnung der Quadratwurzel

do / while – fußgesteuerte Schleifen

Syntax

Beispiel: Ermitteln des größten gemeinsamen Teilers (GGT)

break / continue

break

Beispiel

continue

Beispiel

Aufgaben + Lösungen