JavaScript beherrschen: Teil 3, Schleifen erkunden

Angenommen, Ihre Aufgabe besteht darin, ein Programm zu schreiben, das die Zahlen 1 bis 100 anzeigt. Eine Möglichkeit, dies zu erreichen, besteht darin, 100 console.log() Statements zu schreiben. Aber ich bin mir sicher, dass Sie das nicht tun werden, denn Sie werden die Zeile neun oder Zeile zehn satt haben.

Der einzige Teil, der sich in jeder Aussage ändert, ist die Zahl, daher sollte es eine Möglichkeit geben, nur eine Aussage zu schreiben. Es gibt auch Schleifen. Mit Schleifen können wir eine Reihe von Schritten innerhalb eines Codeblocks wiederholen.

• While-Schleife
• Do-While-Schleife
• For-Schleife
• Array
• For-Of-Schleife
• For-In-Schleife

While-Schleife

Eine While-Schleife führt wiederholt eine Reihe von Anweisungen aus, wenn eine Bedingung wahr ist. Wenn die Bedingung falsch ist, verlässt das Programm die Schleife. Diese Art von Schleife testet eine Bedingung, bevor die Iteration ausgeführt wird. Iteration ist die Ausführung des Schleifenkörpers. Hier ist ein einfaches Beispiel für eine While-Schleife:

let x = 10;

while(x > 0) {
   console.log(`x is now ${x}`);
   x -= 1;
}

console.log("Out of the loop.");

/* Outputs:
x is now 10
x is now 9
x is now 8
x is now 7
x is now 6
x is now 5
x is now 4
x is now 3
x is now 2
x is now 1
Out of the loop. */

Im obigen Beispiel fügen wir zuerst x 设置为 10。在本例中，条件 x > 0 的计算结果为 true，因此执行块内的代码。这会打印语句“x is now 10”，并将 x 的值减 1。在下一次检查期间，x 等于 9，仍然大于 0。因此循环继续。在最后一次迭代中，x 最终变为 1，并且我们打印“x is now 1”。之后，x 变为 0，因此我们正在评估的条件不再成立 true hinzu. Dann beginnen wir mit der Ausführung der Anweisungen außerhalb der Schleife und geben „Out of theloop“ aus.

Dies ist die allgemeine Form einer While-Schleife:

while (condition) {
    statement;
    statement;
    etc.
}

Eine Sache, die Sie bei der Verwendung von While-Schleifen beachten sollten, ist, keine Endlosschleife zu erstellen. Dies geschieht, weil der Zustand nie false wird. Wenn Ihnen das passiert, stürzt Ihr Programm ab. Hier ein Beispiel:

let x = 10;

while(x > 0) {
   console.log(`x is now ${x}`);
   x += 1;
}

console.log("Out of the loop.");

In diesem Fall erhöhen wir x 而不是减少，并且 x auf einen Wert, der bereits größer als 0 ist, sodass die Schleife auf unbestimmte Zeit fortgesetzt wird.

Mission

Wie oft wird diese Schleife ausgeführt?

let i = 0;

while (i < 10) {
    console.log("Hello, World");
    i += 1;
}

Do-While-Schleife

Die Do-While-Schleife führt zuerst den Anweisungshauptteil aus und überprüft dann die Bedingung. Diese Art von Schleife ist nützlich, wenn Sie wissen, dass Sie den Code mindestens einmal ausführen möchten. Im folgenden Beispiel wird der Wert von x einmal protokolliert, auch wenn die Bedingung x 的值一次，即使条件计算结果为 false，因为 x ergibt, da x gleich 0 ist.

let x = 0;

do {
   console.log(`x is now ${x}`);
   x -= 1;
} while(x > 0);

console.log("Out of the loop.");

/* Outputs:
x is now 0
Out of the loop. */

Ich habe in meinen eigenen Projekten oft Do-While-Schleifen verwendet, um Zufallswerte zu generieren und diese dann weiter zu generieren, solange sie bestimmte Bedingungen nicht erfüllen. Dies trägt dazu bei, Duplikate aufgrund der Initialisierung und Neuzuweisung in der Schleife zu vermeiden.

Dies ist die allgemeine Form einer Do-While-Schleife:

do {
    statement;
    statement;
    etc.
} while (condition);

Mission

Schreiben Sie eine Do-While-Schleife, um die Zahlen 1 bis 10 anzuzeigen.

For-Schleife

Die for-Schleife wiederholt einen Codeblock eine bestimmte Anzahl von Malen. Das folgende Beispiel zeigt die Zahlen 1 bis 10:

for (let i = 1; i <= 10; i++) {
    console.log(i);
}

Dies ist die allgemeine Form einer for-Schleife:

for (initial; condition; step) {
    statement;
    statement;
    etc.
}

Initial ist ein Ausdruck, der den Wert einer Variablen festlegt. Dies ist ein optionaler Ausdruck, der die Initialisierung durchführt.

Eine Bedingung ist ein Ausdruck, der wahr sein muss, um eine Anweisung auszuführen. Die Anweisungen innerhalb des Blocks werden nur ausgeführt, wenn die Bedingung true ergibt. Das vollständige Überspringen der Bedingungen führt dazu, dass sie immer wahr sind, sodass Sie die Schleife auf andere Weise verlassen müssen.

step ist ein Ausdruck, der den Wert einer Variablen erhöht. Dies ist ebenfalls optional und wird ausgeführt, nachdem alle Anweisungen im for-Block ausgeführt wurden. Schrittausdrücke werden häufig in der Nähe der Endbedingung einer Schleife verwendet.

Sie können auch eine for-Schleife als äquivalente while-Schleife schreiben. Alles, was Sie tun müssen, ist, Ihre Aussagen und Bedingungen geringfügig zu ändern. Die obige for-Schleife kann wie folgt umgeschrieben werden:

initial;

while(condition) {
    statement;
    statement;
    etc.
    step;
}

Ein Programmiermuster besteht darin, eine for-Schleife zu verwenden, um den Wert einer Variablen sowohl mit der Variablen selbst als auch mit dem neuen Wert zu aktualisieren. In diesem Beispiel werden die Zahlen 1 bis 10 addiert:

let x = 0;

for (let i = 1; i <= 10; i++) {
    x += i;
}

// Outputs: 55
console.log(x);

Dies ist die äquivalente while-Schleife, die die gleiche Ausgabe liefert:

let x = 0;
let i = 1;

while(i <= 10) {
  x += i;
  i += 1;
}

// Outputs: 55
console.log(x);

Sie sollten bemerken, wie ich am Ende des while-Blocks statt am Anfang erhöhe. Das Erhöhen der Schleifenvariablen i am Anfang würde uns 65 ergeben, was wir hier nicht beabsichtigen.

Der

+=-Operator ist ein Zuweisungsoperator, der einer Variablen einen Wert zurückfügt. Hier ist die Liste aller Zuweisungsoperatoren:

操作员	示例	等效
+=	x += 2	x = x + 2
-=	x -= 2	x = x - 2
*=	x *= 2	x = x * 2
/=	x /= 2	x = x / 2
%=	x%=2	x = x % 2

任务

编写一个 for 循环来计算数字的阶乘。数字n的因子是从1到n的所有整数的乘积。例如，4！ （4 阶乘）为 1 x 2 x 3 x 4，等于 24。

数组

数组是一个包含项目列表的对象，这些项目称为元素，可以通过索引进行访问。索引是元素在数组中的位置。第一个元素位于索引 0 处。

数组有一个名为 length 的属性，它为您提供数组中元素的总数。这意味着您可以创建一个 for 循环来迭代数组中的项目，如下所示：

let arr = [1, 2, "Hello", "World"];

for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
}

/*
Outputs:
1
2
Hello
World
*/

二维数组是指元素为数组的数组。例如：

let arr = [
    [1, 2],
    ["Hello", "World"]
];

这是循环数组并显示每个元素的方式：

for (let i = 0; i < arr.length; i++) {
    for (let j = 0; j < arr[i].length; j++) {
        console.log(arr[ i ][ j ]);
    }
}

/*
Outputs:
1
2
Hello
World
*/

您将如何重写上面的循环，以便从末尾开始打印数组元素？

For-Of 循环

迭代数组时最常见的场景之一是从头开始，然后一次遍历所有元素，直到到达末尾。有一种更短的方法可以将 for 循环编写为 for-of 循​​环。

for-of 循​​环让我们可以循环遍历可迭代对象（例如数组、映射和字符串）的值。 for-of 循​​环基本上用于迭代对象的属性值。这是上一节中的循环，重写为 for-of 循​​环。

let arr = [1, 2, "Hello", "World"];

for (let item of arr) {
    console.log(item);
}

/*
Outputs:
1
2
Hello
World
*/

循环字符串：

let big_word = "Pulchritudinous";

for (let char of big_word) {
    console.log(char);
}

/*
Outputs:
P
u
l
c
h
r
i
t
u
d
i
n
o
u
s
*/

For-In 循环

这种循环让我们可以循环访问对象的属性。对象是一种将键映射到值的数据结构。 JavaScript 中的数组也是对象，因此我们也可以使用 for-in 循环来循环数组属性。我们首先看看如何使用 for-in 循环来迭代对象键或属性。

以下是使用 for-in 循环遍历对象键的示例：

let obj = {
    foo: "Hello",
    bar: "World"
};

for (let key in obj) {
    console.log(key);
}

/*
Outputs:
foo
bar
*/

下面是使用 for-in 循环遍历数组的示例：

let arr = [1, 2, "hello", "world"];

for (let key in arr) {
    console.log(arr[key]);
}

/* Outputs:
1
2
hello
world */

我想补充一点，即使我们能够使用 for-in 循环遍历数组元素，您也应该避免这样做。这是因为它的目的是循环访问对象的属性，如果您只想循环数组索引来获取数组值，则在某些情况下可能会得到意外的结果。

评论

循环让我们减少代码中的重复。 While 循环让我们重复一个动作，直到条件为假。 do-while 循环将至少执行一次。 For 循环让我们重复一个动作，直到到达计数结束。 for-in 循环的设计是为了让我们可以访问对象中的键。 for-of 循​​环的设计是为了让我们能够获取可迭代对象的值。

在下一部分中，您将学习函数。

本文已根据 Monty Shokeen 的贡献进行了更新。 Monty 是一位全栈开发人员，他也喜欢编写教程和学习新的 JavaScript 库。

Das obige ist der detaillierte Inhalt vonJavaScript beherrschen: Teil 3, Schleifen erkunden. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!