BRE03

JavaScript : Tableaux et boucles for

Introduction

Un tableau, c’est une structure de données qui permet de regrouper plusieurs données ensemble pour pouvoir les manipuler comme un bloc.

Documentation des tableaux

Déclarer un tableau

Deux syntaxes sont possibles pour déclarer un tableau en JavaScript.

La syntaxe sans objet

let animals = ["Dog", "Cat", "Spider"];

La syntaxe “objet”

let animals = new Array("Dog", "Cat", "Spider");

Lire dans un tableau

Pour lire dans un tableau il faut en fait lire une “case” du tableau (attention la première case d’un tableau porte le numéro 0). Le numéro de la case est appelée la clé.

Il existe également deux syntaxes pour accéder à ses données que l’on peut utiliser quelle que soit la syntaxe utilisée pour déclarer le tableau :

let animals = ["Dog", "Cat", "Spider"];

let fruits = new Array("Apple", "Banana", "Orange");

console.log(animals.at(1)); // Cat

console.log(fruits[2]); // Orange

Manipuler un tableau

Ajouter un élément à la fin

let animals = ["Dog", "Cat", "Spider"];

animals.push("Mouse"); // ["Dog", "Cat", "Spider", "Mouse"]

Enlever un élément à la fin

let animals = ["Dog", "Cat", "Spider", "Mouse"];

animals.pop(); // ["Dog", "Cat", "Spider"]

Ajouter un élément au début

let animals = ["Dog", "Cat", "Spider"];

animals.unshift("Bird"); // ["Bird", "Dog", "Cat", "Spider"]

Ajouter un élément au milieu

let animals = ["Dog", "Cat", "Spider"];

animals.splice(1, 0, "Bird"); // ["Dog", "Bird", "Cat", "Spider"]

// on ajoute lélément Bird à la position 1 et on supprime 0 éléments

Enlever un élément au début

let animals = ["Bird", "Dog", "Cat", "Spider"];

animals.shift(); // ["Dog", "Cat", "Spider"]

Parcourir un tableau

Les boucles for

Les boucles for sont une sorte de boucle supplémentaire que vous pouvez utiliser en JavaScript.

Il existe deux syntaxes différentes pour utiliser les boucles for en JavaScript :

La syntaxe simple

for(etat_de_debut; condition_de_fin; incrementation)
{

}

La méthode Array.length permet de connaitre la longueur d’un tableau, elle est très utile pour les conditions de fin avec la syntaxe simple :

let animals = ["Dog", "Cat", "Spider"];

for(let i = 0; i < animals.length; i++)
{
	console.log(animals[i]);
}

La syntaxe for … of

// element n'existera que dans le scope de la boucle for
for(let element of tableau)
{
	
}

Pour chacun des éléments du tableau, effectuer l’action contenue dans les accolades :

let animals = ["Dog", "Cat", "Spider"];

for(let animal of animals)
{
	console.log(animal);
}

Précisions sur les tableaux imbriqués

Lien du cours

Exercices sur les tableaux et les boucles for

Sujet des exercices