Boucle For JavaScript

La boucle est utilisée en programmation pour exécuter automatiquement des tâches répétitives.

Par exemple, supposons que nous voulions imprimer "Hello World" 10fois. Il peut être fait ainsi :

　　document.write("Hello World<br>");
　　document.write("Hello World<br>");
　　document.write("Hello World<br>");
　　document.write("Hello World<br>");
　　document.write("Hello World<br>");
　　document.write("Hello World<br>");
　　document.write("Hello World<br>");
　　document.write("Hello World<br>");
　　document.write("Hello World<br>");
　　document.write("Hello World<br>");

Et dans la boucle, cette instruction doit être écrite une seule fois, et la boucle exécutera10fois, comme suit :

for (let i = 0; i <　10; i++) {
document.write("Hello World<br>");
}

Boucle for

La syntaxe de la boucle for est la suivante :

for (initialisation; condition; final-expression) {
　　　　//Instruction à exécuter
}

initialisationExécuter avant l'exécution de l'instruction (une fois).

conditionDéfinir les conditions de exécution de l'instruction.

Après l'exécution de la instruction, il sera exécutéfinal-expression。

for (var i = 0; i <　5; i++) {
　　　　document.write("<br>The number is "　+　i);
}

À partir de l'exemple précédent, vous pouvez lire :

• initialisation Définir les variables avant le début de la boucle (variable i = 0).

• condition Définir les conditions de exécution de la boucle (je dois être inférieur5)

• À chaque exécution du bloc de code dans la boucle,final-expression serontAjouter une valeur (i ++)

Dans l'exemple suivant, nous parcourons une liste en ordre croissant :

var fruits = ['Apple', 'Mango', 'Banana', 'Orange'];
var txt = "";
for (var i = 0; i < fruits.length; i)++) {
　　　　txt　+= fruits[i]　+　'<br>';
}

在下面的示例中，我们以降序循环遍历一个数组：

var fruits = ['Apple', 'Mango', 'Banana', 'Orange'];
var txt = "";
for (var i = fruits.length　-1; i >= 0; i--) {
txt　+= fruits[i]　+　'<br>';
}

可选表达式

for循环中的三个表达式都是可选的。例如，我们可以通过在循环外部初始化变量来编写相同的For语句，而不需要初始化表达式。

//在循环外声明变量
var i = 0;
//初始化循环
for (; i <　5; i++) {
document.write(i);
}

在这种情况下，第一个； 表示该语句是指向初始化，条件还是最终表达式，即使省略它也是必要的。

下面，我们还可以从循环中删除条件。我们将使用一个if语句和break来告诉循环在i大于3时停止运行，这与true条件相反。

//在循环外声明变量
var i = 0;
//省略初始化和条件
for (; ; i++) {
if (i >　3) {
break;
}
document.write(i);
}

注意：break如果省略该条件，则必须包含该语句，否则循环将永远无限循环运行，并可能导致浏览器崩溃。

最后，可以通过将最终表达式放在循环末尾来将其删除。两个分号仍必须包含在内，否则循环将无法运行。

//在循环外声明变量
var i = 0;
//省略所有表达式
for (; ; ) {
if (i >　3) {
break;
}
document.write(i);
i++;
}

从上面的示例可以看出，包括所有这三个语句通常会产生最简洁易读的代码。但是，知道以后可以省略语句是很有用的。

嵌套循环

您可以嵌套循环，即在另一个循环内循环。

嵌套循环在矩阵乘法中的大多数地方都使用，显示表格和许多其他地方：

var txt = "";
for (var row = 0; row <　10; row++) {
　　　for (var col = 0; col < row; col++) {
　　　txt　+= ""　*　";
　　　}
　　　txt　+= "<br>";
}

For ...in循环

for...in循环迭代的对象的属性。

为了演示，我们将创建一个简单的myObj对象，其中包含一些name：value对。

var myObj = {
name: "VISHAL",
age:　22,
height:　175,
city: "New Delhi",
getNothing: function () { return ""; }
};
for (let x in myObj) {
document.write(x);
}

Dans chaque itération, une propriété provenant de l'objet est assignée àx,Et cette boucle continue jusqu'à ce que toutes les propriétés de l'objet soient épuisées.

L'exemple suivant implémente une boucle for...in et affiche les propriétés du navigateur Web.NavigatorObjet :

for (let x in navigator) {
document.write(x);
}

Boucle For...Of

La directive for...of crée une boucle pour parcourir un objet itérable, y compris : String intégré, Array, objet similaire à Array et objet itérable défini par l'utilisateur.

let iterable = [10,　20,　30,　40,　50];
for (let x of iterable) {
document.write(x);
}

Dans chaque itération, une élément provenant de l'objet est assigné àx,Et cette boucle continue jusqu'à ce que tous les éléments de l'objet soient épuisés.

Que ce soit pour...in ou for...of, les éléments itérés ne sont pas les mêmes. La principale différence entre eux réside dans ce qu'ils itèrent :

• La boucle for...in itère sur les propriétés énumérées de l'objet, dans un ordre quelconque

• La boucle for...of itère sur les données, l'objet itéré doit être défini pour être parcouru

Boucle while

Les boucles while et do...while seront expliquées dans le prochain chapitre.