Tableaux et objets

Objectifs

À la fin de cette leçon, vous saurez :

• stocker une suite de valeurs dans un tableau et les lire par index ;
• manipuler les tableaux : ajouter, retirer, parcourir ;
• comprendre ce qu'est un objet et accéder à ses propriétés ;
• utiliser ensemble tableaux et objets pour structurer.

🔗 Pour vous rafraîchir la mémoire : conditions et boucles · découper avec des fonctions

Tableaux : une suite de valeurs

const numbers = [1, 2, 3, 4, 5];

L'accès par position commence à 0 :

console.log(numbers[0]);   // 1
console.log(numbers[4]);   // 5
console.log(numbers[5]);   // undefined : hors limites

length est une propriété donnée par Array :

console.log(numbers.length);   // 5

On peut remplacer la valeur d'une case existante :

numbers[1] = 20;   // remplace la valeur de l'index 1

En revanche, pas de réaffectation du tableau lui-même :

numbers = [6, 7];   // erreur : numbers est const

Manipulations de base

const fruits = [];

fruits.push("pomme");   // ajoute à la fin
fruits.push("banane");
console.log(fruits);    // ["pomme", "banane"]

const dernier = fruits.pop();    // retire et rend le dernier
console.log(dernier);            // banane
console.log(fruits.length);      // 1

fruits.unshift("kiwi");  // ajoute au début

Attention : push modifie le tableau en place ; pop retire et renvoie. Ce sont des méthodes du tableau.

Parcourir un tableau

const notes = [12, 15, 8, 17];

for (const note of notes) {
  console.log(`Note : ${note}`);
}

Pour calculer un total :

let total = 0;
for (const note of notes) {
  total += note;
}
console.log(total / notes.length);   // moyenne

+= ajoute la valeur et remet dans la même variable : un raccourci fréquent.

Objets : relier des valeurs nommées

const user = {
  name: "Paul",
  age: 20,
};

L'objet est un regroupement de valeurs sous des noms de propriétés :

console.log(user.name);    // Paul
console.log(user.age);     // 20

user.age = 21;             // modification du contenu
console.log(user);         // { name: "Paul", age: 21 }

Deux syntaxes de lecture, mêmes données :

user.name        // point : nom de la propriété écrit
user["name"]     // crochets : expression qui donne le nom

La lecture par crochets accepte une variable :

const cle = "name";
console.log(user[cle]);    // Paul

Un tableau d'objets

const contacts = [
  { name: "Paul", email: "paul@exemple.fr" },
  { name: "Marie", email: "marie@exemple.fr" },
];

for (const contact of contacts) {
  console.log(`${contact.name} → ${contact.email}`);
}

Le programme manipule maintenant des entités : chaque contact a un nom et un email, et la boucle les rencontre un par un.

Comment choisir ?

Données	Outil
Une suite ordonnée de valeurs	tableau
Un ensemble de valeurs nommées	objet
Les deux à la fois	tableau d'objets

Exercice

1. Créez un tableau annees de 4 années, affichez la première et la longueur.
2. Ajoutez une année avec push, puis affichez le tableau.
3. Affichage de la moyenne d'un tableau de notes avec une boucle for...of.
4. Créez un objet voiture avec marque, modele, annee. Affichez ses trois propriétés.
5. Ajoutez au même objet une propriété vitesseMax : voiture.vitesseMax = 220.
6. Créez un tableau de 3 objets voiture et affichez pour chacune : marque et modele.
7. Calculer avec une boucle l'année moyenne des voitures.

Indices

Sur la moyenne : somme / nombre d'éléments ; tableau.length est le nombre d'éléments. Attention à ne pas diviser par zéro si le tableau est vide.

Sur l'objet : les propriétés peuvent être lues après coup ; l'objet lui-même reste const.

Sur le parcours : for...of donne chaque élément, pas son index. Pour les deux à la fois, un for classique avec i.

Résumé

• Tableau : suite ordonnée d'éléments, lue par index (position).
• push ajoute, pop retire, length mesure, for...of parcourt.
• Objet : valeurs sous des noms, lues par point ou crochets.
• Un tableau d'objets représente une liste d'entités. C'est le problème qui guide le choix de structure.

const annees = [2020, 2021, 2022, 2023];
console.log(annees[0]);      // 2020
console.log(annees.length);  // 4

annees.push(2024);
console.log(annees);         // [2020, 2021, 2022, 2023, 2024]

const notes = [12, 15, 8, 17];
let total = 0;
for (const note of notes) {
  total += note;
}
console.log(total / notes.length);   // 13

const voiture = {
  marque: "Renault",
  modele: "Clio",
  annee: 2019,
};
console.log(voiture.marque);
console.log(voiture.modele);
console.log(voiture.annee);

voiture.vitesseMax = 220;

const garage = [
  { marque: "Renault", modele: "Clio", annee: 2019 },
  { marque: "Peugeot", modele: "208", annee: 2021 },
  { marque: "Tesla", modele: "Model 3", annee: 2022 },
];

for (const caisse of garage) {
  console.log(`${caisse.marque} ${caisse.modele}`);
}

let totalAnnees = 0;
for (const caisse of garage) {
  totalAnnees += caisse.annee;
}
console.log(totalAnnees / garage.length);   // 2020,666...