Array.
Appelle une fonction pour chaque élément du tableau.
- Renvoie
undefined- Modifie l’original
- Non
Exemple
#const modules = ['HTML', 'CSS', 'JavaScript']
modules.forEach((module, index) => {
console.log(`${index + 1}. ${module}`)
})Définition et utilisation
#La méthode forEach() parcourt les éléments du tableau les uns après les autres et appelle la fonction donnée pour chacun. Elle ne renvoie aucune valeur utile (toujours undefined) et sert donc aux effets de bord : afficher, enregistrer, ajouter des éléments à la page.
La boucle forEach() ne peut pas être interrompue avec break. Pour arrêter plus tôt, utilisez une boucle for...of classique, ou les méthodes some() ou find().
Elle ne fonctionne pas bien non plus avec await : les fonctions asynchrones dans forEach() ne sont pas attendues les unes après les autres. Pour des opérations asynchrones séquentielles, préférez une boucle for...of.
Syntaxe
#array.forEach(callbackFn)
array.forEach(callbackFn, thisArg)Paramètres
#callbackFn
function (element, index, array)
Fonction appelée pour chaque élément.thisArg
optionnel
Valeur dethisà l’intérieur de la fonction.
Plus d’exemples
#const result = [1, 2, 3].forEach((n) => n * 2)
console.log(result)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
#- Si vous construisez un nouveau tableau à partir des résultats, utilisez
map()plutôt queforEach()avecpush(). - Pour une boucle avec
await, ou pour pouvoir l’interrompre, choisissezfor...of.
Entrées associées
#- map() vs forEach()map() construit un nouveau tableau à partir des résultats de la fonction ; forEach() se contente d’appeler la fonction pour chaque élément et renvoie toujours undefined.
- Array.prototype.map()Crée un nouveau tableau avec les résultats de l’appel d’une fonction pour chaque élément.
- for...ofParcourt les valeurs successives d’un objet itérable : tableau, chaîne, Map, Set et autres.
- Array.prototype.some()Vérifie si au moins un élément remplit la condition.
- Array.prototype.reduce()Réduit tout le tableau à une seule valeur, par exemple une somme, un objet ou un nouveau tableau.
Vous voyez une erreur ou il manque un exemple ? Écrivez-nous.