Array, Set et Map

Tableaux en JavaScript: Array

Pour plus d'information, vous pouvez vous référer à cette page: https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Objets_globaux/Array

Les arrays sont des tableaux. Il s'agit de listes avec des index.

Tableau à une dimension (ligne)

Un tableau en "une dimension" est une ligne:

[case 1, case2, case3, case4, case5, etc , dernièrecase]

Tableau à deux dimensions (table)

Un tableau en "deux dimensions" est une table:

[case1ligne1, case 2ligne1, case3igne1, case4igne1, case5igne1, etc , dernièrecaseigne1]

[case1igne2, case2igne2, case3igne2, case4igne2, case5igne2, etc , dernièrecaseigne2]

[case1igne3, case2igne3, case3igne3, case4igne3, case5igne3, etc , dernièrecaseigne3]

etc..

Créer un tableau Array en JavaScript

Tableau à une dimension (ligne)

Syntaxe

Pour qu'une variable maVariable devienne un tableau avec trois cases contenant les variables ou les valeurs case1, case2 et case3, la syntaxe est la suivante:

maVariable = [case1, case2, case3];

On utilise des crochets pour ouvrir et fermer le tableau, et des virgules pour séparer les cases

Exemples

Voici un exemple de tableau avec deux cases (des chaines de caractères) stocké dans la variable coursProg

let coursProg = ['Langage du web', 'Algorithmique'];

Voici un exemple de tableau avec cinq cases (des Numbers) stocké dans la variable mesNotes:

let mesNotes = [15 , 18, 16 , 12 , 13.5 ];

Voici un exemple de tableau avec quatre cases (des chaines de caractères) stocké dans la variable prenoms:

let prenom1 = "Lauren";

let prenom2 = "Morgan";

let prenom4 = "Camille";

let prenoms = [prenom1 , prenom2, "Martine" , prenom4 ];

Tableau à deux dimensions (table)

Principe

Un tableau à deux dimensions (une table) est un tableau dont les cases sont contiennent un tableau.

Etape 0: créér un tableau "vide"

monTableauADeuxDimensions = [ ] ;

Etape 1: mettre la structure des lignes

monTableauADeuxDimensions =

[

[ ligne 1 ],

[ ligne 2 ],

[ ligne 3 ],

[ ligne 4 ]

];

Etape 2: remplir les lignes

monTableauADeuxDimensions =

[

[case1, case2, case3] ,

[case1, case2, case3]

];

L'étape 2 équivaut à monTableauADeuxDimensions =[ [case1, case2, case3] , [case1, case2, case3] , [case1, case2, case3] , [case1, case2, case3] ];

Syntaxe

Pour qu'une variable maVariable devienne un tableau avec deux lignes de trois cases contenant les variables ou les valeurs case1ligne1, case2ligne1, case3ligne1, case1ligne2, case2ligne2, case3ligne2, la syntaxe est la suivante:

maVariable = [ [case1ligne1, case 2ligne1, case3igne1], [case1ligne2, case 2ligne2, case3igne2] ];

Exemples

Voici un exemple de tableau avec deux lignes de deux cases (des chaines de caractères) stocké dans la variable cours. La première ligne contient les cours de programmation, et la deuxième de communication:

let cours = [ ['Langage du web', 'Algorithmique'] , ['SIC', 'Sociologie'] ];

Voici un exemple de tableau avec quatre lignes deux case (des Numbers) stocké dans la variable mesNotes (une ligne par cours)

let mesNotes = [ [15 , 18], [ 16 , 12] , [13.5, 12] , [18,20] ];

Voici un exemple de tableau avec quatre cases et deux lignes (des chaines de caractères) stocké dans la variable prenoms et noms:

let prenom1 = "Lauren";

let prenom2 = "Morgan";

let prenom4 = "Camille";

let prenoms = [prenom1 , prenom2, "Martine" , prenom4 ];

let nom1 = "Thevin";

let nom2 = "Lee";

let nom3 = "Martin";

let noms = [nom1 , nom2, nom3 , "Smith" ];

let tableauNomPrenom= [noms, prenoms]

Exercice 1 : Création de tableau

Question 1: Créer en Javascript un tableau menu avec le nom de 5 plats, puis afficher-le dans un alert

let menu=["Raclette", "Soupe de potiron", "Pates bolognese", "Salade de tomates", "Crème brulée" ];

alert(menu);

Question 2: Créer en Javascript un tableau distance avec 3 kilométrages pour aller de chez vous au campus, de chez-vous au supermarché et de chez-vous à la mer, puis afficher-le dans un alert

let distance=[25, 0.3, 1.2 ];

alert(distance);

Question 3: Créer en Javascript un tableau etudiants avec en ligne les personnes et en colonne leurs noms et prénoms. Faites et tableau pour 3 étudiants imaginaires

let etudiants= [ ["Dupont", "Martine" ], ["Jane", "Doe" ], ["Smith", "Williams" ]]

Récupérer les éléments d'un tableau Array en JavaScript

Tableau à une dimension (ligne)

Syntaxe

Si une variable maVariable contient un tableau, il suffit d'utiliser des crochets avec l'index:

maVariable[0]; //la première case

maVariable[1]; //la deuxieme case

maVariable[maVariable.length-1]; //la dernière case

Exemples

Voici un exemple pour afficher le premier cours de coursProg:

let coursProg = ['Langage du web', 'Algorithmique'];

alert( "Premier cours: " + coursProg[0] );

Voici un exemple de tableau affcher la troisième notes de mesNotes:

let mesNotes = [15 , 18, 16 , 12 , 13.5 ];

alert( "Troisième note: " +mesNotes[2] );

Tableau à deux dimensions (table)

Syntaxe

Si une variable maVariable contient un tableau, il suffit d'utiliser des crochets avec l'index. Le premier crochet récupère la ligne, le deuxième la colonne.

maVariable = [ [case1ligne1, case 2ligne1, case3igne1], [case1ligne2, case 2ligne2, case3igne2] ];

maVariable[0]; //la première ligne [case1ligne1, case 2ligne1, case3igne1]

maVariable[1]; //la deuxième ligne [case1ligne2, case 2ligne2, case3igne2]

maVariable[0][0]; //la première ligne première case case1ligne1

maVariable[1][2]; //la deuxième ligne troisième case case3igne2

Exemples

Voici comment récupérer la note 15 dans le tableau suivant:

let mesNotes = [ [15 , 18], [ 16 , 12] , [13.5, 12] , [18,20] ];

alert ( mesNotes[0][0])

Voici comment récupérer les notes du deuxième cours dans le tableau suivant:

let mesNotes = [ [15 , 18], [ 16 , 12] , [13.5, 12] , [18,20] ];

alert ( mesNotes[1])

Exercice 2 : Récuperer les valeurs d'un tableau

Question 1: Afficher le deuxième plat d'un tableau menu avec le nom de 5 plats,

let menu=["Raclette", "Soupe de potiron", "Pates bolognese", "Salade de tomates", "Crème brulée" ];

alert(menu[1]);

Question 2: Afficher la dernière distance avec 3 kilométrages pour aller de chez vous au campus, de chez-vous au supermarché et de chez-vous à la mer

let distance=[25, 0.3, 1.2 ];

alert(distance[distance.length-1]);

Question 3: Afficher le prénom du premier étudiant et le nom et prénom du deuxième dans etudiants avec en ligne les personnes et en colonne leurs noms et prénoms.

let etudiants= [ ["Dupont", "Martine" ], ["Jane", "Doe" ], ["Smith", "Williams" ]]

alert(etudiants[0][1]);

alert(etudiants[1]);

Ajouter un élément ou supprimer un élément

Pour ajouter un élement à la fin d'un tableau monTableau, il suffit de faire:

monTableau.push(maNouvelleValeur);

Pour supprimer un élement à la fin d'un tableau monTableau, il suffit de faire:

monTableau.pop()

Exercice 3 : Ajouter les valeurs d'un tableau

Question 1: Ajouter un sixième plat d'un tableau menu avec le nom de 5 plats

let menu=["Raclette", "Soupe de potiron", "Pates bolognese", "Salade de tomates", "Crème brulée" ];

menu.push("Omelette");

Question 2: Ajouter un nouvel étudiant dans le tableau etudiants

let etudiants= [ ["Dupont", "Martine" ], ["Jane", "Doe" ], ["Smith", "Williams" ]]

nouvelEtudiant=["Thevin","Lauren"];

etudiants.push(nouvelEtudiant);

Question 3: Ajouter un prénom au deuxième étudiant dans le tableau etudiants

let etudiants= [ ["Dupont", "Martine" ], ["Doe", "Jane" ], ["Smith", "Williams" ]]

etudiants[1].push("Tarzan");

Modifier des valeurs

Pour modifier des valeurs, il suffit de récupérer la case du tableau que l'on veut changer et d'y affecter une nouvelle valeur:

Tableau à une dimension (ligne)

Syntaxe

Si une variable maVariable contient un tableau :

maVariable[0]=nouvelleValeur; //la première case prend une nouvelle valeur

maVariable[1]=nouvelleValeur; //la deuxième case prend une nouvelle valeur

maVariable[maVariable.length-1]=nouvelleValeur; //la dernière case prend une nouvelle valeur

Exemples

Voici un exemple pour modifier le premier cours de coursProg:

let coursProg = ['Langage du web', 'Algorithmique'];

coursProg[0]="Cours PhP";

alert( "Premier cours: " + coursProg[0] );

Voici un exemple de tableau pour modifier la troisième notes de mesNotes:

let mesNotes = [15 , 18, 16 , 12 , 13.5 ];

mesNotes[2]=10;

alert( "Troisième note: " +mesNotes[2] );

Tableau à deux dimensions (table)

Syntaxe

Si une variable maVariable contient un tableau:

maVariable[0][0]=nouvelleValeur; //la première ligne première case case1ligne1 prend la valeur nouvelleValeur

maVariable[1][2]=nouvelleValeur; //la deuxième ligne troisième case case3igne2 prend la valeur nouvelleValeur

Exemples

Voici comment modifier la note 15 dans le tableau suivant:

let mesNotes = [ [15 , 18], [ 16 , 12] , [13.5, 12] , [18,20] ];

mesNotes[0][0]=17;

alert ( mesNotes[0][0])

Voici comment modifier les notes du deuxième cours dans le tableau suivant:

let mesNotes = [ [15 , 18], [ 16 , 12] , [13.5, 12] , [18,20] ];

mesNotes[1]=[7,20];

alert ( mesNotes[1])

Exercice 4 : Modifier les valeurs des tableaux

Question 1: Modifier le deuxième plat d'un tableau menu avec le nom de 5 plats par la valeur "en rupture"

let menu=["Raclette", "Soupe de potiron", "Pates bolognese", "Salade de tomates", "Crème brulée" ];

menu[1]="en rupture";

Question 2: changer un nom d'un étudiant, un prénom d'un autre et l'ensemble nom prénom d'un autre.

let etudiants= [ ["Dupont", "Martine" ], ["Doe", "Jane" ], ["Smith", "Williams" ]]

etudiants[0][0]=["Nouveau Nom seulement"];

etudiants[2][1]=["Nouveau Prénom Nom seulement"];

etudiants[1]=["Nouveau Nom", "Nouveau prénom"];

Page updated

Report abuse