JavaScript for-Satz

Definition und Verwendung

Das for-Satz erstellt einen Schleifenlauf und führt diesen so lange aus, bis die Bedingung wahr ist.

Solange die Bedingung wahr ist, läuft der Schleifenlauf fort. Er wird nur beendet, wenn die Bedingung falsch wird.

JavaScript unterstützt verschiedene Arten von Schleifen:

  • for - Mehrfache Schleifenklausel
  • for/in - Durchlaufen der Eigenschaften eines Objekts
  • for/of - Durchlaufen Sie die Werte eines iterierbaren Objekts
  • while - Durchlaufen Sie einen Code-Block, solange die angegebene Bedingung wahr ist
  • do/while - Durchlaufen Sie einen Code-Block einmal und wiederholen Sie ihn, wenn die angegebene Bedingung wahr ist

Tipp:Verwenden Sie das break-Statement, um den Loop zu verlassen, und das continue-Statement, um einen bestimmten Wert im Loop zu überspringen.

Beispiel

Durchlaufen Sie den Code-Block fünf Mal:

var text = "";
var i;
for (i = 0; i < 5; i++) {
  text += "Die Zahl ist " + i + "<br>";

Selbst ausprobieren

Unten auf der Seite gibt es mehr TIY-Beispiele.

Syntax

for (statement 1; statement 2; statement 3) {
  code block to be executed

Parameterwert

Parameter Beschreibung
statement1

Optional. Wird vor dem Beginn des Loops (Code-Block) ausgeführt. Dieses Statement wird in der Regel verwendet, um Zählervariablen zu initialisieren. Um mehrere Werte zu initialisieren, trennen Sie jede Wert durch Komma.

Kommentare:Dieser Parameter kann weggelassen werden. Aber vermeiden Sie das Semikolon ";"
statement2

Optional. Definiert die Bedingung für den Loop (Code-Block). Dieses Statement wird in der Regel verwendet, um die Bedingung der Zählervariable zu bewerten. Wenn true zurückgegeben wird, wird der Loop neu gestartet, wenn false, wird der Loop beendet.

Kommentare:Dieser Parameter kann weggelassen werden. Aber vermeiden Sie das Semikolon ";". Wenn dieser Parameter weggelassen wird, muss im Loop ein break bereitgestellt werden. Andernfalls wird der Loop niemals enden und Ihren Browser zum Absturz bringen.
statement3

Optional. Wird nach jeder Ausführung des Loops (Code-Block) ausgeführt. Dieses Statement wird in der Regel verwendet, um Zählervariablen zu erhöhen oder zu verringern.

Kommentare:Dieser Parameter kann weggelassen werden (z.B. Erhöhung/Verringerung des Werts im Loop).

Technische Details

JavaScript-Version: ECMAScript 1

Mehr Beispiele

Beispiel

Durchlaufen Sie die Indizes des Arrays und sammeln Sie die Namen der Autos aus dem cars-Array:

var cars = ["BMW", "Volvo", "Saab", "Ford"];
var text = "";
var i;
for (i = 0; i < cars.length; i++) {
  text += cars[i] + "<br>";

Selbst ausprobieren

Beispielklärung:

  • Zunächst setzen wir eine Variable vor dem Beginn des Loops (var i = 0;)
  • Dann definieren wir die Bedingung für den Loop. Solange die Variable kleiner als die Länge des Arrays (d.h. 4) ist, wird der Loop fortgesetzt
  • Jedes Mal, wenn der Loop ausgeführt wird, wird die Variable um eins erhöht (i++)
  • Wenn die Variable nicht mehr kleiner als 4 (die Länge des Arrays) ist, ist die Bedingung falsch und der Loop endet

Beispiel

Initialisieren Sie mehrere Werte im ersten Parameter:

var cars = ["BMW", "Volvo", "Saab", "Ford"];
var i;
for (i = 0, len = cars.length, text = ""; i < len; i++) { 
  text += cars[i] + "<br>";

Selbst ausprobieren

Beispiel

Vermeiden Sie den ersten Parameter (setzen Sie den Wert vor dem Beginn des Loops):

var cars = ["BMW", "Volvo", "Saab", "Ford"];
var i = 2;
var len = cars.length;
var text = "";
for (; i < len; i++) {
  text += cars[i] + "<br>";

Selbst ausprobieren

Beispiel

Verwenden Sie den continue-Befehl - Durchlaufen Sie den Code-Block, aber überspringen Sie den Wert "3":

var text = ""
var i;
for (i = 0; i < 5; i++) {
  if (i == 3) {
    continue;
  
  text += "Die Zahl ist " + i + "<br>";

Selbst ausprobieren

Beispiel

Verwenden Sie das break-Statement - Führen Sie einen Abschnitt des Codes aus, aber beenden Sie die Schleife, wenn die Variable i "3" ist:

var text = ""
var i;
for (i = 0; i < 5; i++) {
  if (i == 3) {
    break;
  
  text += "Die Zahl ist " + i + "<br>";

Selbst ausprobieren

Beispiel

Der zweite Parameter wird weggelassen. In diesem Beispiel verwenden wir auch das break-Statement, um den Ausgang der Schleife bei i gleich "3" zu beenden (wenn der zweite Parameter weggelassen wird, muss im Schleifendurchlauf ein break bereitgestellt werden. Andernfalls wird die Schleife nie enden und Ihr Browser wird abstürzen):

var cars = ["BMW", "Volvo", "Saab", "Ford"];
var text = "";
var i;
for (i = 0; ; i++) {
  if (i == 3) {
    break;
  
  text += cars[i] + "<br>";

Selbst ausprobieren

Beispiel

Durchsuchen Sie die Indizes des Arrays in absteigender Reihenfolge (negativer Inkrement):

var cars = ["BMW", "Volvo", "Saab", "Ford"];
var text = "";
var i;
for (i = cars.length - 1; i >= 0; i--) {
  text += cars[i] + "<br>";

Selbst ausprobieren

Beispiel

Die letzte Parameter wird weggelassen und im Schleifendurchlauf inkrementiert:

var cars = ["BMW", "Volvo", "Saab", "Ford"];
var i = 0;
var len = cars.length;
for (; i < len;) { 
  text += cars[i] + "<br>";
  i++;

Selbst ausprobieren

Beispiel

Durchsuchen Sie die Knoten des NodeList-Objekts und ändern Sie die Hintergrundfarbe aller <p>-Elemente in der Liste:

var myNodelist = document.getElementsByTagName("P");
var i;
for (i = 0; i < myNodelist.length; i++) {
  myNodelist[i].style.backgroundColor = "red";

Selbst ausprobieren

Beispiel

Beispiel für verschachtelte Schleifen (Schleife innerhalb einer Schleife):

var text = "";
var i, j;
for (i = 0; i < 3; i++) {
  text += "<br>" + "i = " + i + ", j = "; 
  for (j = 10; j < 15; j++) {
    document.getElementById("demo").innerHTML = text += j + " ";

Selbst ausprobieren

Browser-Unterstützung

Anweisungen Chrome IE Firefox Safari Opera
für Unterstützt Unterstützt Unterstützt Unterstützt Unterstützt

Verwandte Seiten

JavaScript-Anleitung:JavaScript For-Schleife

JavaScript-Referenzhandbuch:JavaScript for ... in-Anweisung

JavaScript-Referenzhandbuch:JavaScript break-Anweisung

JavaScript-Referenzhandbuch:JavaScript continue-Anweisung

JavaScript-Referenzhandbuch:JavaScript while-Anweisung