Les Tableaux

Un tableau permet de stocker plusieurs valeurs dans une seule variable.

En JavaScript, les tableaux sont très utilisés pour :

• Créer des listes
• Parcourir des données
• Manipuler plusieurs valeurs
• Afficher du contenu dynamique

Les tableaux sont une des structures les plus importantes du langage.

1. Créer un tableau

Un tableau utilise les crochets :

[]

const fruits = ["apple", "banana", "orange"];

Ici, le tableau contient trois valeurs.

2. Les index

Chaque valeur possède une position appelée :

index

Les index commencent toujours à :

0

3. Accéder à une valeur

const fruits = ["apple", "banana", "orange"];

console.log(fruits[0]);

Ici, JavaScript retourne la première valeur du tableau.

4. Modifier une valeur

const fruits = ["apple", "banana"];

fruits[1] = "orange";

console.log(fruits);

La valeur à l’index 1 est remplacée.

5. Ajouter une valeur avec push()

La méthode push() ajoute une valeur à la fin du tableau.

const fruits = ["apple", "banana"];

fruits.push("orange");

console.log(fruits);

6. Supprimer avec pop()

La méthode pop() retire la dernière valeur.

const fruits = ["apple", "banana", "orange"];

fruits.pop();

console.log(fruits);

7. Ajouter au début avec unshift()

const fruits = ["banana", "orange"];

fruits.unshift("apple");

console.log(fruits);

La valeur est ajoutée au début du tableau.

8. Supprimer au début avec shift()

const fruits = ["apple", "banana", "orange"];

fruits.shift();

console.log(fruits);

La première valeur est supprimée.

9. length

La propriété length retourne le nombre d’éléments.

const fruits = ["apple", "banana", "orange"];

console.log(fruits.length);

10. Parcourir un tableau avec for

const fruits = ["apple", "banana", "orange"];

for (let i = 0; i < fruits.length; i++) {

    console.log(fruits[i]);

}

Cette boucle parcourt chaque valeur du tableau.

11. Parcourir avec for...of

const fruits = ["apple", "banana", "orange"];

for (const fruit of fruits) {

    console.log(fruit);

}

Cette syntaxe est souvent plus lisible.

12. includes()

La méthode includes() vérifie si une valeur existe.

const fruits = ["apple", "banana"];

console.log(fruits.includes("banana"));

13. indexOf()

La méthode indexOf() retourne la position d’une valeur.

const fruits = ["apple", "banana", "orange"];

console.log(fruits.indexOf("banana"));

14. join()

La méthode join() transforme un tableau en chaîne de caractères.

const fruits = ["apple", "banana", "orange"];

console.log(fruits.join(", "));

15. slice()

La méthode slice() retourne une portion du tableau.

const fruits = ["apple", "banana", "orange"];

const result = fruits.slice(0, 2);

console.log(result);

Ici, JavaScript retourne les éléments entre les index 0 et 2.

16. splice()

La méthode splice() peut supprimer ou ajouter des valeurs.

const fruits = ["apple", "banana", "orange"];

fruits.splice(1, 1);

console.log(fruits);

Ici, JavaScript supprime un élément à partir de l’index 1.

17. Tableaux multidimensionnels

Un tableau peut contenir d’autres tableaux.

const grid = [

    [1, 2],
    [3, 4]

];

console.log(grid[0][1]);

18. Tableaux et références

Les tableaux sont des objets en JavaScript.

const numbers = [1, 2];

const copy = numbers;

copy.push(3);

console.log(numbers);

Les deux variables pointent vers le même tableau.

19. Copier un tableau

Le spread operator permet de copier un tableau.

const numbers = [1, 2];

const copy = [...numbers];

copy.push(3);

console.log(numbers);

console.log(copy);

20. Bonnes pratiques

• Utiliser des noms clairs
• Utiliser for...of pour la lisibilité
• Éviter les tableaux trop complexes
• Utiliser spread pour copier les données
• Choisir des méthodes adaptées au besoin

Résumé rapide