JavaScript - Boucle for...in : Guide du débutant

Salut là, jeune programmeur en herbe ! Aujourd'hui, on va plonger dans un outil pratique de JavaScript : la boucle for...in. Ne t'inquiète pas si tu n'as jamais codé auparavant - je vais te guider pas à pas, comme j'ai fait pour des centaines d'étudiants au fil des ans. Alors, prends une tasse de café (ou de thé, si c'est ton truc), et c'est parti !

Qu'est-ce que la boucle for...in ?

Avant de rentrer dans les détails, comprendre ce qu'est la boucle for...in. Imagine que tu as une grande boîte pleine de jouets (nous appellerons cette boîte un "objet" en JavaScript). La boucle for...in est comme une main magique qui atteint dans la boîte et tire un jouet à la fois, te permettant de les examiner individuellement.

En termes de programmation, la boucle for...in nous permet d'itérer sur les propriétés d'un objet. C'est un moyen pour examiner chaque morceau de données stocké dans un objet, un par un.

Syntaxe de la boucle for...in

Maintenant, regardons comment écrire une boucle for...in. Ne t'inquiète pas si cela paraît un peu étrange au début - on va le décortiquer ensemble !

for (let key in object) {
// code à exécuter
}

Voici ce que cela signifie :

• for : Ce mot-clé indique à JavaScript que nous démarons une boucle.
• let key : Cela crée une variable (que nous appelons key ici) qui retiendra le nom de chaque propriété que nous parcourons dans l'objet.
• in : Ce mot-clé sépare le nom de la variable de l'objet que nous parcourons.
• object : C'est l'objet que nous voulons examiner.
• Les accolades {} contiennent le code qui s'exécutera pour chaque propriété dans l'objet.

Exemples de la boucle for...in en action

Exemple 1 : Explorer un objet simple

Commençons par un exemple simple. Imaginons que nous avons un objet représentant un livre :

let book = {
title: "Gatsby le Magnifique",
author: "F. Scott Fitzgerald",
year: 1925
};

for (let property in book) {
console.log(property + ": " + book[property]);
}

Si nous exécutons ce code, voici ce que nous verrons dans la console :

title: Gatsby le Magnifique
author: F. Scott Fitzgerald
year: 1925

Que se passe-t-il ici ? Notre boucle for...in parcourt chaque propriété de l'objet book. Pour chaque itération :

• property contient le nom de la propriété courante ("title", "author", ou "year").
• book[property] nous donne la valeur de cette propriété.
• Nous utilisons console.log() pour afficher à la fois le nom de la propriété et sa valeur.

Exemple 2 : Compter les propriétés

Disons que nous voulons compter combien de propriétés un objet a :

let car = {
make: "Toyota",
model: "Corolla",
year: 2020,
color: "blue"
};

let propertyCount = 0;

for (let prop in car) {
propertyCount++;
}

console.log("L'objet car a " + propertyCount + " propriétés.");

Cela affichera : "L'objet car a 4 propriétés."

Dans cet exemple, nous utilisons la boucle for...in pour parcourir chaque propriété de l'objet car. Au lieu de faire quelque chose avec les propriétés elles-mêmes, nous augmentons simplement un compteur à chaque fois que la boucle s'exécute. Cela nous donne le nombre total de propriétés dans l'objet.

Exemple 3 : Filtrer les propriétés

Parfois, vous pourriez vouloir faire quelque chose uniquement avec certaines propriétés. Regardons un exemple :

let person = {
name: "Alice",
age: 30,
city: "New York",
job: "Ingénieur",
hobby: "peinture"
};

console.log("Propriétés qui commencent par 'j' :");
for (let prop in person) {
if (prop.startsWith('j')) {
console.log(prop + ": " + person[prop]);
}
}

Cela affichera :

Propriétés qui commencent par 'j' :
job: Ingénieur

Dans cet exemple, nous utilisons la boucle for...in pour parcourir toutes les propriétés de l'objet person, mais nous n'affichons que les propriétés qui commencent par la lettre 'j'. Nous utilisons la méthode startsWith() pour vérifier cette condition.

Méthodes couramment utilisées avec les boucles for...in

Voici un tableau de certaines méthodes courantes que vous pourriez utiliser en conjonction avec les boucles for...in :

Méthode	Description	Exemple
hasOwnProperty()	Vérifie si la propriété est directement sur l'objet (non héritée)	if (object.hasOwnProperty(property))
Object.keys()	Retourne un tableau des noms de propriétés propres et enumerable d'un objet	Object.keys(object)
Object.values()	Retourne un tableau des valeurs propres et enumerable d'un objet	Object.values(object)
Object.entries()	Retourne un tableau des propres et enumerable [key, value] paires d'un objet	Object.entries(object)

Conclusion

Et voilà ! Vous avez fait vos premiers pas dans le monde des boucles for...in. Souvenez-vous, comme apprendre à rouler à vélo, la programmation nécessite de la pratique. Ne soyez pas découragé si cela ne vous vient pas immédiatement - continuez à expérimenter avec différents objets et voyez ce que vous pouvez faire avec les boucles for...in.

Comme nous disons dans le monde de la programmation, "La seule façon d'apprendre à programmer est de programmer !" Alors, pourquoi ne pas essayer de créer vos propres objets et d'utiliser des boucles for...in pour les explorer ? Peut-être créer un objet représentant votre film ou livre préféré, et voir ce que vous pouvez en faire.

Bonne programmation, et souvenez-vous - chaque expert a déjà été un débutant. Continuez à vous entraîner, et avant de savoir, vous serez en train de parcourir les objets comme un pro !

Credits: Image by storyset