JavaScript

Tableaux

Raconté par Vincent Jugé
sur la base d'un cours créé par Rémi Forax

Tableau

Un tableau en Javascript se déclare entre [ et ].
Les éléments sont séparés par des virgules.

[1, 2, 3];
['a', 'b', 'c'];
[true, 'hello', 4.5];
[]	    /* empty array */

Les tableaux sont hétérogènes : ils peuvent contenir des valeurs de types différents.

Index de tableau

Les cases d'un tableau sont accessibles par un index.

Un accès hors des bornes (0, length-1) du tableau
renvoie undefined.

const array = [1, 2, 3];
array.length;
array[0];
array[2];
array[3];
array[-1];

La première case d'un tableau est à l'index 0.

Modfier un élément d'un tableau

Les cases d'un tableau sont accessibles en lecture et en écriture.

const array = ['a', 'b', 'c'];
array[0];
array[1] = 'bb8';
array;

Boucle sur un tableau (1/2)

Une boucle for de 0 à length-1 permet de
parcourir tous les éléments.

const printAll = function(array) {
  for(let i = 0; i < array.length; i++) {
    let element = array[i];
    console.log(element);
  }
};
printAll([42, true]);

Boucle sur un tableau (2/2)

La syntaxe for(let…of…) permet d'indiquer une boucle sans écrire l'incrémentation.

const printAll = function(array) {
  for(let element of array) {
    console.log(element);
  }
};
printAll([42, true]);

Cette boucle est plus lisible mais l'index n'est pas disponible !

Fonction avec plusieurs valeurs de retour

On renvoie un tableau si on a plusieurs valeurs de retour.

const sortPair = function(a,b) {
  return a < b ? [a,b] : [b,a];
};
console.log(sortPair(0,3));
console.log(sortPair(4,1));

Fonction à nombre variable d'arguments

Si le dernier paramètre est déclaré avec '…' (rest), les arguments sont mis dans un tableau.

const logAll = function(text, ...args) {
  for(let arg of args) {
    console.log(text + arg);
  }
};
logAll("val ", 1, 4);
logAll("empty");

Appel de fonction avec un tableau

Lors de l'appel de fonction, l'opérateur '…' (spread) transfère les valeurs d'un tableau en tant qu'arguments.

const array = [40, 2];
const min = Math.min(7, ...array);
console.log(min);

Création de tableau + spread

L'opérateur spread '…' marche aussi pour la création de tableau.

const array = [1, 2, 3, 4];
const array2 = [0, ...array];

Assignation multiple (1/2)

On peut assigner plusieurs variables avec
la syntaxe [var1, var2, …] = array.

const array = [40, 2];
let a;
let b;
[a, b] = array;
console.log(a + b);

Assignation multiple (2/2)

On peut ignorer des valeurs avec une virgule sans nom et on peut indiquer que le reste va dans un tableau.

const array = [1, 2, 3, 4, 5];
let first, rest;
[first, , ...rest] = array;
console.log(first);
console.log(rest);

Assignation déstructurée

On peut combiner la declaration et l'assignation multiple
avec la syntaxe let (ou const) [var1, var2, …] = array.

const array = [40, 2];
const [a, b] = array;
console.log(a + b);