Méthodes de Parcours des Tableaux et des Objets en JavaScript

Pour commencer avec les tableaux, définissons un exemple :

const items = ['rouge', 'bleu', 'vert', 'jaune'];

1. Boucle for classique nécessitant la connaissance de la longueur :

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

2. Méthode forEach qui itère sans valeur de retour et gère la longueur automatiquement :

items.forEach(function(element, index) {
  console.log(`Index: ${index}, Valeur: ${element}`);
});

3. Fonction map appliquant une transformation à chaque élément, retournant un nouveau tableau sans modifier l'original :

const modifie = items.map(item => 'Couleur: ' + item);
console.log(modifie);

4. Fonction filter créant un sous-ensemble d'éléments répondant à une condition :

const courts = items.filter(item => item.length < 5);
console.log(courts);

5. Fonction some vérifiant si au moins un élément satisfait un critère, retournant un booléen :

const contientRouge = items.some(item => item === 'rouge');
console.log(contientRouge); // true

6. Fonction every validant si tous les éléments correspondent à une condition :

const tousLongs = items.every(item => item.length > 2);
console.log(tousLongs); // false

7. Fonction reduce accumulant les valeurs via une fonction de rappel :

const somme = [5, 10, 15].reduce((accumulateur, valeur) => {
  return accumulateur + valeur;
}, 0);
console.log(somme); // 30

const applatir = [[1, 2], [3, 4]].reduce((acc, sousTableau) => {
  return acc.concat(sousTableau);
}, []);
console.log(applatir); // [1, 2, 3, 4]

Passons au parcours d'objets. Considérons cet exemple :

const profil = {nom: 'Alice', age: 28, profession: 'Développeuse'};

Utilisation de for...in pour itérer sur les propriétés de l'objet :

for (const cle in profil) {
  console.log(`${cle}: ${profil[cle]}`);
}

Cette méthode peut aussi s'appliquer aux tableaux, où cle représente l'indice sous forme de chaîne :

for (const cle in items) {
  console.log(`Indice ${cle}, Valeur ${items[cle]}`);
}

Une alternative moderne avec for...of pour les tableaux :

for (const valeur of items) {
  console.log(valeur);
}

for...of supporte les interruptions via break ou continue et fonctionne avec d'autres structures itérables comme les NodeList.

Pour les objets, on peut récupérer les clés avec Object.keys() :

const cles = Object.keys(profil);
cles.forEach(cle => {
  console.log(`${cle}: ${profil[cle]}`);
});

Étiquettes: JavaScript tableaux objets Itération reduce

Publié le 4 août à 17h32