Les Collections

Une collection permet de regrouper plusieurs valeurs ensemble.

En JavaScript, les collections sont très utilisées pour manipuler :

• Des listes d’utilisateurs
• Des produits
• Des tâches
• Des messages
• Des données provenant d’une API

La collection la plus utilisée en JavaScript est le tableau.

1. Les tableaux

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

const fruits = [

    "Pomme",
    "Banane",
    "Orange"

];

Chaque valeur possède une position appelée index.

2. Les index

Les index commencent toujours à 0.

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

3. Modifier un tableau

Les tableaux peuvent être modifiés après leur création.

fruits[1] = "Mangue";

console.log(fruits);

Ici, la valeur "Banane" est remplacée par "Mangue".

4. push()

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

fruits.push("Fraise");

console.log(fruits);

5. pop()

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

fruits.pop();

console.log(fruits);

Après l’exécution, la dernière valeur est supprimée.

6. slice()

La méthode slice() permet de créer une copie partielle d’un tableau.

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

const copy = numbers.slice(0, 2);

console.log(copy);

slice() ne modifie pas le tableau original.

7. concat()

La méthode concat() fusionne plusieurs tableaux.

const array1 = [1, 2];
const array2 = [3, 4];

const result = array1.concat(array2);

console.log(result);

concat() retourne un nouveau tableau.

8. Les références dans les tableaux

Les tableaux sont manipulés par référence.

const array1 = [1, 2];

const array2 = array1;

array2.push(3);

console.log(array1);

Les deux variables pointent vers le même tableau en mémoire.

9. Copier un tableau

Pour éviter les problèmes de références, on peut copier un tableau.

const numbers = [1, 2, 3];

const copy = [...numbers];

copy.push(4);

console.log(numbers);
console.log(copy);

L’opérateur ... s’appelle le spread operator.

10. Map

JavaScript possède aussi la structure Map.

Une Map permet d’associer une clé à une valeur.

const users = new Map();

users.set("Fred", 33);

console.log(users.get("Fred"));

11. Parcourir une collection

Les collections sont souvent parcourues avec des boucles.

const fruits = [

    "Pomme",
    "Banane",
    "Orange"

];

for (const fruit of fruits) {

    console.log(fruit);

}

Cette boucle affiche chaque valeur du tableau.

Résumé rapide