for
Une boucle avec compteur : initialisation, condition et étape. Répète un bloc de code tant que la condition est vraie.
Exemple
#for (let i = 1; i <= 3; i++) {
console.log(`Leçon ${i}`)
}Définition et utilisation
#La boucle for classique a trois parties entre parenthèses, séparées par des points-virgules. La première s’exécute une fois au départ et crée généralement un compteur. La deuxième est la condition vérifiée avant chaque tour. La troisième s’exécute après chaque tour et incrémente généralement le compteur.
Elle est utile quand vous avez besoin d’un indice, que vous voulez avancer de plusieurs éléments à la fois, partir de la fin, ou ne parcourir qu’une partie du tableau. Si vous parcourez simplement tous les éléments, for...of ou les méthodes de tableaux, comme forEach() et map(), sont plus lisibles.
Déclarez le compteur avec let. Chaque tour reçoit alors sa propre copie de la variable, et le compteur n’existe pas en dehors de la boucle. Chacune des trois parties peut être omise, mais les points-virgules doivent rester : for (;;) est une boucle infinie, que vous n’interromprez que par break ou return.
Syntaxe
#for (initialization; condition; afterthought) {
// instructions
}Plus d’exemples
#const ranking = ['Emma', 'Léa', 'Lucas']
for (let i = 0; i < ranking.length; i++) {
console.log(`${i + 1}. ${ranking[i]}`)
}const countdown = []
for (let i = 10; i > 0; i -= 3) {
countdown.push(i)
}
console.log(countdown)for (let row = 1; row <= 3; row++) {
let line = ''
for (let col = 1; col <= 3; col++) {
line += row * col + ' '
}
console.log(line.trim())
}Compatibilité des navigateurs
#Largement disponible
Fonctionne dans tous les navigateurs modernes, y compris sur mobile. Vous pouvez l’utiliser sans crainte.
- Chrome
- Edge
- Firefox
- Safari
Bonnes pratiques
#- Attention à la condition
i <= array.length. Les indices se terminent àlength - 1, donc le dernier tour liraundefined. Correct :i < array.length. - Ne supprimez pas d’éléments du tableau (par ex. avec
splice()) en le parcourant vers l’avant, car il est facile de sauter l’élément suivant. Partez de la fin ou utilisezfilter(). - Si vous n’avez pas besoin de l’indice, choisissez
for...of. Le code est plus court et on ne peut pas se tromper d’un élément.
Entrées associées
#- for...ofParcourt les valeurs successives d’un objet itérable : tableau, chaîne, Map, Set et autres.
- whileRépète un bloc de code tant que la condition est vraie. La condition est vérifiée avant chaque tour.
- breakTermine immédiatement une boucle ou une instruction switch et passe au code qui la suit.
- continueIgnore le reste du tour de boucle actuel et passe immédiatement au suivant.
- Array.prototype.forEach()Appelle une fonction pour chaque élément du tableau.
Vous voyez une erreur ou il manque un exemple ? Écrivez-nous.