Tableaux

Un tableau est une collection ordonnée de valeurs. C'est l'une des structures de données les plus fondamentales en JavaScript et est utilisée chaque fois que tu as besoin de stocker une liste d'éléments.

La façon la plus courante de créer un tableau est avec un littéral de tableau — des crochets contenant des valeurs séparées par des virgules :

const colors = ['red', 'green', 'blue'];
const numbers = [1, 2, 3, 4, 5];
const empty = [];

Les tableaux JavaScript peuvent contenir des types mixtes — nombres, chaînes de caractères, booléens, objets, même d'autres tableaux :

const mixed = ['hello', 42, true, null, [1, 2]];

Les tableaux à l'intérieur de tableaux sont appelés tableaux imbriqués (ou tableaux multidimensionnels) :

const grid = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9],
];
console.log(grid[1][2]); // 6 (ligne 1, colonne 2)

Tu peux aussi créer des tableaux avec le constructeur Array(), mais la syntaxe littérale est presque toujours préférée :

const arr = new Array(3); // Crée [empty x 3] — souvent pas ce que tu veux !
const arr2 = Array.of(1, 2, 3); // [1, 2, 3]

Pour vérifier si une valeur est un tableau, utilise Array.isArray() :

Array.isArray([1, 2, 3]); // true
Array.isArray('hello');   // false
Array.isArray({ a: 1 });  // false

C'est plus fiable que typeof, qui retourne 'object' pour les tableaux.

Les tableaux utilisent une indexation basée sur zéro. Le premier élément est à l'index 0, le deuxième à l'index 1, et ainsi de suite :

const fruits = ['apple', 'banana', 'cherry'];
console.log(fruits[0]); // 'apple'
console.log(fruits[1]); // 'banana'
console.log(fruits[2]); // 'cherry'
console.log(fruits[3]); // undefined (hors limites)

La propriété .length te dit combien d'éléments le tableau contient :

console.log(fruits.length); // 3

Tu peux accéder au dernier élément en utilisant length - 1 :

console.log(fruits[fruits.length - 1]); // 'cherry'

JavaScript fournit plusieurs méthodes pour ajouter et supprimer des éléments :

• push() — ajoute un ou plusieurs éléments à la fin :
  javascript

  fruits.push('date');       // ['apple', 'banana', 'cherry', 'date']

• pop() — supprime le dernier élément et le retourne :
  javascript

  const last = fruits.pop(); // 'date', le tableau est maintenant ['apple', 'banana', 'cherry']

• unshift() — ajoute un ou plusieurs éléments au début :
  javascript

  fruits.unshift('avocado'); // ['avocado', 'apple', 'banana', 'cherry']

• shift() — supprime le premier élément et le retourne :
  javascript

  const first = fruits.shift(); // 'avocado'

Pour un contrôle plus précis, splice() peut insérer, supprimer ou remplacer des éléments à n'importe quelle position :

const nums = [1, 2, 3, 4, 5];
nums.splice(2, 1);       // Supprime 1 élément à l'index 2 → [1, 2, 4, 5]
nums.splice(1, 0, 99);   // Insère 99 à l'index 1 → [1, 99, 2, 4, 5]
nums.splice(0, 2, 10, 20); // Remplace les 2 premiers éléments → [10, 20, 2, 4, 5]

Pour créer une copie d'un tableau (plutôt qu'une référence), utilise l'opérateur de propagation :

const original = [1, 2, 3];
const copy = [...original];
copy.push(4);
console.log(original); // [1, 2, 3] — inchangé

Tu auras fréquemment besoin de parcourir chaque élément d'un tableau. JavaScript offre plusieurs façons de le faire :

1. Boucle for avec index — l'approche classique, te donne un contrôle total sur l'index :

const colors = ['red', 'green', 'blue'];

for (let i = 0; i < colors.length; i++) {
  console.log(i, colors[i]);
}
// 0 'red'
// 1 'green'
// 2 'blue'

Utilise ceci quand tu as besoin de l'index, que tu veux sauter des éléments, ou que tu as besoin d'itérer en sens inverse.

2. Boucle for...of — une syntaxe plus propre quand tu as seulement besoin des valeurs :

for (const color of colors) {
  console.log(color);
}
// 'red'
// 'green'
// 'blue'

C'est la boucle recommandée pour la plupart des itérations sur tableaux. Elle est concise, lisible, et fonctionne avec n'importe quel itérable.

3. Méthode forEach — appelle une fonction pour chaque élément :

colors.forEach(function(color, index) {
  console.log(index, color);
});

forEach est utile quand tu veux utiliser un style de callback, mais note que tu ne peux pas sortir d'une boucle forEach avec break (contrairement à for et for...of).

Évite for...in pour les tableaux. La boucle for...in est conçue pour itérer sur les propriétés d'objets, pas sur les éléments de tableaux. Elle itère sur des clés chaînes de caractères (y compris celles héritées), ce qui peut produire des résultats inattendus :

// Ne fais pas ça avec des tableaux !
for (const key in colors) {
  console.log(key); // '0', '1', '2' — des chaînes, pas des nombres
}

Utilise for...in pour les objets et for...of pour les tableaux.