Start · Sprachen · JavaScript · Referenz · for

for

Anweisung

Die <code>for</code>-Anweisung erstellt eine Schleife mit drei optionalen Ausdrücken in Klammern, gefolgt von einer auszuführenden Anweisung.

seit JavaScript ES1 Kategorie: syntax

Signatur

for (initialization; condition; afterthought) statement

Beschreibung

Wie andere Schleifenanweisungen können Sie innerhalb von statement Kontrollfluss-Anweisungen verwenden:

  • break stoppt die Ausführung von statement und springt zur ersten Anweisung nach der Schleife.
  • continue stoppt die Ausführung von statement und wertet afterthought und dann condition erneut aus.

Parameter

Name Typ Default Beschreibung
$initialization expression | declaration Ein Ausdruck (einschließlich assignment expressions) oder eine Variablendeklaration, der einmal vor Beginn der Schleife ausgewertet wird. Üblicherweise dient er zur Initialisierung einer Zählervariable. Dieser Ausdruck kann optional neue Variablen mit den Schlüsselwörtern var oder let deklarieren. Mit var deklarierte Variablen sind nicht lokal zur Schleife, d.h. sie befinden sich im selben Scope wie die for-Schleife. Mit let deklarierte Variablen sind lokal zur Anweisung. Das Ergebnis dieses Ausdrucks wird verworfen.
$condition expression Ein Ausdruck, der vor jeder Schleifeniteration ausgewertet wird. Wenn dieser Ausdruck zu true ausgewertet wird (truthy), wird statement ausgeführt. Wenn der Ausdruck zu false ausgewertet wird (falsy), verlässt die Ausführung die Schleife und geht zur ersten Anweisung nach dem for-Konstrukt. Dieser Bedingungstest ist optional. Wenn er weggelassen wird, wird die Bedingung immer als true ausgewertet.
$afterthought expression Ein Ausdruck, der am Ende jeder Schleifeniteration ausgewertet wird. Dies geschieht vor der nächsten Auswertung von condition. Wird generell verwendet, um die Zählervariable zu aktualisieren oder zu inkrementieren.
$statement Pflicht statement Eine Anweisung, die ausgeführt wird, solange die Bedingung als true ausgewertet wird. Sie können eine Block-Anweisung verwenden, um mehrere Anweisungen auszuführen. Um keine Anweisung innerhalb der Schleife auszuführen, verwenden Sie eine leere Anweisung (;).

Rückgabewert

Typ
void
Beschreibung
Eine for-Anweisung gibt keinen Wert zurück.

Beispiele

for verwenden

for (let i = 0; i < 9; i++) {
  console.log(i);
  // weitere Anweisungen
}

Syntax des Initialisierungsblocks

for (let i = "start" in window ? window.start : 0; i < 9; i++) {
  console.log(i);
}
// SyntaxError: 'for-in' loop variable declaration may not have an initializer.

Syntax des Initialisierungsblocks (korrekt)

// Den gesamten Initialisierer klammern
for (let i = ("start" in window ? window.start : 0); i < 9; i++) {
  console.log(i);
}

// Den `in`-Ausdruck klammern
for (let i = ("start" in window) ? window.start : 0; i < 9; i++) {
  console.log(i);
}

Optionale for-Ausdrücke

let i = 0;
for (; i < 9; i++) {
  console.log(i);
  // weitere Anweisungen
}

condition weglassen

for (let i = 0; ; i++) {
  console.log(i);
  if (i > 3) break;
  // weitere Anweisungen
}

Alle drei Ausdrücke weglassen

let i = 0;

for (;;) {
  if (i > 3) break;
  console.log(i);
  i++;
}

Stattdessen while verwenden

let i = 0;

while (i <= 3) {
  console.log(i);
  i++;
}

Lexikalische Deklarationen im Initialisierungsblock

for (let i = 0; i < 3; i++) {
  setTimeout(() => {
    console.log(i);
  }, 1000);
}

Variable im äußeren Scope

let i = 0;
for (; i < 3; i++) {
  setTimeout(() => {
    console.log(i);
  }, 1000);
}

Mit var deklariert

for (var i = 0; i < 3; i++) {
  setTimeout(() => {
    console.log(i);
  }, 1000);
}
// Loggt 3, 3, 3

Closure im Initialisierungsblock

for (let i = 0, getI = () => i; i < 3; i++) {
  console.log(getI());
}
// Loggt 0, 0, 0

getI in afterthought neu berechnen

for (let i = 0, getI = () => i; i < 3; i++, getI = () => i) {
  console.log(getI());
}
// Loggt 0, 1, 2

i im Rumpf inkrementieren

for (let i = 0, getI = () => i; i < 3;) {
  i++;
  console.log(getI());
}
// Loggt 0, 0, 0

Initiales Binding einfangen

for (
  let i = 0, getI = () => i, incrementI = () => i++;
  getI() < 3;
  incrementI()
) {
  console.log(i);
}
// Loggt 0, 0, 0

for ohne Rumpf verwenden

function showOffsetPos(id) {
  let left = 0;
  let top = 0;
  for (
    let itNode = document.getElementById(id); // initialization
    itNode; // condition
    left += itNode.offsetLeft,
      top += itNode.offsetTop,
      itNode = itNode.offsetParent // afterthought
  ); // Semikolon

  console.log(
    `Offset position of "${id}" element:
left: ${left}px;
top: ${top}px;`,
  );
}

showOffsetPos("content");

// Loggt:
// Offset position of "content" element:
// left: 0px;
// top: 153px;

for mit zwei iterierenden Variablen

const arr = [1, 2, 3, 4, 5, 6];
for (let l = 0, r = arr.length - 1; l < r; l++, r--) {
  console.log(arr[l], arr[r]);
}
// 1 6
// 2 5
// 3 4

// Wichtig · Fallstricke

Beachten Sie, dass das Semikolon nach der for-Anweisung obligatorisch ist, da es als leere Anweisung (empty statement) steht. Andernfalls übernimmt die for-Anweisung die nachfolgende console.log-Zeile als ihren statement-Abschnitt, wodurch log mehrfach ausgeführt wird.