Déstructuration des tableaux en JavaScript

Dans cette leçon, nous analyserons l'opération de déstructuration des tableaux. Cette opération est destinée à enregistrer en masse les éléments d'un tableau dans des variables en une seule ligne de code.

La syntaxe de cette opération est la suivante :

javascriptlet [variable1, variable2, variable3] = tableau;

Comme vous le voyez, à gauche du signe = dans des crochets sont listés les noms des variables. Ces variables sont déclarées en masse via let, qui se trouve avant le crochet ouvrant.

À la suite de l'opération, dans la première variable sera enregistré le premier élément du tableau (c'est-à-dire avec la clé zéro), dans la deuxième variable - le deuxième, dans la troisième variable - le troisième.

Regardons un exemple pratique. Supposons que nous ayons un tableau stockant l'année, le mois et le jour :

javascriptlet arr = [2025, 12, 31];

Enregistrons l'année, le mois et le jour dans les variables correspondantes, en utilisant la déstructuration :

javascriptlet arr = [2025, 12, 31];
let [year, month, day] = arr;

Regardons le contenu de nos variables :

javascriptconsole.log(year);  // affichera 2025
console.log(month); // affichera 12
console.log(day);   // affichera 31

Pour comparaison, regardez à quel point le code serait incommode et long sans la déstructuration :

javascriptlet arr = [2025, 12, 31];

let year  = arr[0];
let month = arr[1];
let day   = arr[2];

console.log(year);  // affichera 2025
console.log(month); // affichera 12
console.log(day);   // affichera 31

javascriptlet arr = ['John', 'Smit', 'development', 'programmer', 2000];

let name       = arr[0];
let surname    = arr[1];
let department = arr[2];
let position   = arr[3];
let salary     = arr[4];