Tableaux et objets : création, lecture, modification

Rangez plusieurs valeurs dans des tableaux, décrivez des entités avec des objets, puis apprenez à les lire et à les modifier.

8 min · 3 questions

Jusqu'ici, chaque variable contenait une seule valeur. Un tableau (array en anglais) est une liste ordonnée de valeurs, écrite entre crochets [ ], les valeurs étant séparées par des virgules. Chaque valeur occupe une position numérotée appelée index. Attention : la numérotation commence à 0. Le premier élément est donc à l'index 0, le deuxième à l'index 1, et ainsi de suite. La propriété length donne le nombre d'éléments.

const fruits = ["pomme", "banane", "cerise"];

console.log(fruits[0]);     // Affiche : pomme
console.log(fruits[2]);     // Affiche : cerise
console.log(fruits.length); // Affiche : 3

Un tableau se modifie facilement. La méthode push(...) ajoute un élément à la fin ; une méthode est une fonction attachée à une valeur, que l'on appelle avec un point. Et l'écriture fruits[0] = ... remplace l'élément situé à l'index indiqué.

const fruits = ["pomme", "banane"];

fruits.push("cerise"); // Ajoute à la fin
fruits[0] = "poire";   // Remplace le premier
console.log(fruits);
// Affiche : ["poire", "banane", "cerise"]

Un objet regroupe plusieurs informations liées sous forme de paires clé : valeur, entre accolades { }. La clé est un nom, comme l'étiquette d'un champ, et la valeur est la donnée associée. C'est idéal pour décrire une entité du quotidien : une personne, un produit, un film... On lit ou on modifie une propriété avec un point, par exemple user.name, et on peut ajouter une nouvelle propriété à tout moment.

const user = {
  name: "Léa",
  age: 28
};

console.log(user.name); // Affiche : Léa
user.age = 29;          // Modifie la propriété
user.city = "Lyon";     // Ajoute une propriété
console.log(user.age);  // Affiche : 29
console.log(user.city); // Affiche : Lyon

Quiz de validation

Vérifiez que vous avez bien retenu les points clés de cette leçon.

1. Comment lit-on le premier élément d'un tableau nommé fruits ?
   • fruits[1]
   • fruits[0]
   • fruits.first
2. Quelle méthode ajoute un élément à la fin d'un tableau ?
   • push()
   • add()
   • append()
   • insert()
3. Comment lit-on la propriété name de l'objet user ?
   • user.name
   • name.user
   • user->name