JavaScript pour la boucle
Les boucles peuvent exécuter un bloc de code un nombre de fois spécifié.
Boucles JavaScript
Si vous souhaitez exécuter le même code encore et encore, avec la même valeur chacune temps différent, alors il est très pratique d'utiliser des boucles.
JavaScript prend en charge différents types de boucles?:
for - boucle un bloc de code un certain nombre de fois
for/in - Parcourez les propriétés de l'objet
while - Parcourez le bloc de code spécifié lorsque la condition spécifiée est vraie
do/ while - De même, lorsque la condition spécifiée est vraie, bouclez le bloc de code spécifié
For boucle
La boucle for est un outil que vous utilisez souvent lorsque vous souhaitez créer une boucle.
Voici la syntaxe de la boucle for?:
for (instruction 1?; instruction 2?; instruction 3)
{
Le bloc de code exécuté
>
L'instruction 1 (bloc de code) exécute les démarrages avant de démarrer.
L'instruction 2 définit les conditions d'exécution de la boucle (code block)
L'instruction 3 est exécutée après l'exécution de la boucle (bloc de code)
Instance
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <p>點(diǎn)擊按鈕循環(huán)代碼5次。</p> <button onclick="myFunction()">點(diǎn)擊這里</button> <p id="demo"></p> <script> function myFunction(){ var x=""; for (var i=0;i<5;i++){ x=x + "該數(shù)字為 " + i + "<br>"; } document.getElementById("demo").innerHTML=x; } </script> </body> </html>
Exécutez le programme et essayez-le
Dans l'exemple ci-dessus, vous pouvez voir?:
L'instruction 1 définit la variable (var i=0) avant que la boucle ne commence.
L'instruction 2 définit les conditions d'exécution de la boucle (je dois être inférieur à 5).
L'instruction 3 incrémente une valeur (i++) à chaque fois que le bloc de code est exécuté.
Instruction 1
Habituellement, nous utilisons l'instruction 1 pour initialiser les variables utilisées dans la boucle (var i=0 ) .
La déclaration 1 est facultative, ce qui signifie que vous pouvez vous passer de la déclaration 1.
Vous pouvez initialiser n'importe quelle (ou plusieurs) valeurs dans l'instruction 1?:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <script> cars=["小明","小龍","小奇","小濤"]; for (var i=0,l=cars.length; i<l; i++){ document.write(cars[i] + "<br>"); } </script> </body> </html>
Exécutez le programme et essayez-le
Vous pouvez également omettre l'instruction 1 ( tels que Lorsque la valeur a été définie avant le début de la boucle) :
Instance
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <script> cars=["BMW","Volvo","Saab","Ford"]; var i=2,len=cars.length; for (; i<len; i++){ document.write(cars[i] + "<br>"); } </script> </body> </html>
Exécutez le programme pour l'essayer
Déclaration 2
Habituellement, l'instruction 2 est utilisée pour évaluer la condition de la variable initiale.
La déclaration 2 est également facultative.
Si l'instruction 2 renvoie vrai, la boucle recommence, si elle renvoie faux, la boucle se termine.
Remarque?: Si vous omettez l'instruction 2, alors break doit être fourni à l'intérieur de la boucle. Sinon, le cycle ne peut pas être arrêté. Cela peut faire planter le navigateur.
Déclaration 3
Habituellement, l'instruction 3 augmentera la valeur de la variable initiale.
La déclaration 3 est également facultative.
La déclaration 3 a de nombreuses utilisations. L'incrément peut être négatif (i--) ou supérieur (i=i+15).
L'instruction 3 peut également être omise (par exemple, lorsqu'il y a du code correspondant à l'intérieur de la boucle)?:
Instance
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <script> cars=["BMW","Volvo","Saab","Ford"]; var i=0,len=cars.length; for (; i<len; ){ document.write(cars[i] + "<br>"); i++; } </script> </body> </html>
Exécutez Essayez le programme
Boucle For/In
L'instruction JavaScript for/in parcourt les propriétés de l'objet?:
Exemple
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <p>點(diǎn)擊下面的按鈕,循環(huán)遍歷對(duì)象 "person" 的屬性。</p> <button onclick="myFunction()">點(diǎn)擊這里</button> <p id="demo"></p> <script> function myFunction(){ var x; var txt=""; var person={fname:"Bill",lname:"Gates",age:56}; for (x in person){ txt=txt + person[x]; } document.getElementById("demo").innerHTML=txt; } </script> </body> </html>
Exécutez le programme et essayez-le
Nous expliquerons la boucle while et ferons /while en boucle dans le chapitre suivant.