Scribd
Importer
26 vues3 pages

Spread Operator

Le document présente des notions clés en JavaScript, notamment la déstructuration, les opérateurs Rest et Spread, ainsi que l'import/export de modules. Il explique comment extraire des valeurs d'objets et de tableaux, fusionner des tableaux et copier des objets, ainsi que l'utilisation de JSON.stringify() et JSON.parse() pour manipuler des objets JSON. Des exemples pratiques illustrent chaque concept pour faciliter la compréhension.

Transféré par

elyahfrisco7
Copyright
© © All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
26 vues3 pages

Spread Operator

Le document présente des notions clés en JavaScript, notamment la déstructuration, les opérateurs Rest et Spread, ainsi que l'import/export de modules. Il explique comment extraire des valeurs d'objets et de tableaux, fusionner des tableaux et copier des objets, ainsi que l'utilisation de JSON.stringify() et JSON.parse() pour manipuler des objets JSON. Des exemples pratiques illustrent chaque concept pour faciliter la compréhension.

Transféré par

elyahfrisco7
Copyright
© © All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd

Notions Clés en JavaScript : Modules, JSON, Déstructuration et

Operateurs ...

1. Déstructuration (Destructuring)
La déstructuration permet d’extraire facilement des valeurs depuis un objet ou un tableau.

Exemple avec un objet

1 const personne = { nom: "Alice", age: 30, ville: "Paris" };


2
3 // déstructuration
4 const { nom, age } = personne;
5
6 [Link](nom); // "Alice"
7 [Link](age); // 30

Exemple avec un tableau

1 const nombres = [1, 2, 3];


2

3 // déstructuration
4 const [a, b] = nombres;
5
6 [Link](a); // 1
7 [Link](b); // 2

2. L’opérateur ... : Rest et Spread


A. Rest operator (collecter le reste)
Il permet de récupérer ce qui reste après déstructuration.
Avec un objet :

1 const personne = { nom: "Alice", age: 30, ville: "Paris" };


2
3 const { nom, ...autresInfos } = personne;
4
5 [Link](nom); // "Alice"
6 [Link](autresInfos); // { age: 30, ville: "Paris" }

Avec un tableau :

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


2

3 const [x, ...reste] = nombres;


4

1
5 [Link](x); // 1
6 [Link](reste); // [2, 3, 4]

B. Spread operator (copier/répartir)


Il permet de copier ou combiner des objets/tableaux.
Fusion de tableaux :

1 const a = [1, 2];


2 const b = [3, 4];
3 const c = [...a, ...b]; // [1, 2, 3, 4]

Copie d’un objet :

1 const p1 = { nom: "Alice", age: 30 };


2 const p2 = { ...p1, ville: "Paris" };
3 // { nom: "Alice", age: 30, ville: "Paris" }

Résumé rapide : déstructuration et opérateurs

Tableau récapitulatif

Syntaxe Nom Sert à...


{ nom } Déstructuration Extraire une clé d’un objet
[a, b] Déstructuration Extraire des éléments d’un tableau
...rest Rest operator Récupérer le reste
...objet Spread operator Copier ou fusionner

3. Import / Export (Modules JavaScript)


Les modules permettent de séparer le code en plusieurs fichiers.

Exemple : fichier [Link]

1 export const PI_mod = 3.14159;


2
3 export function additionnerMod(a, b) {
4 return a + b;
5 }
6

7 export default class CalculetteMod {


8 soustraire(a, b) {
9 return a - b;
10 }
11 }

Exemple : fichier [Link]

1 import CalculetteMod, { PI_mod, additionnerMod as sum } from './[Link]';


2
3 [Link](PI_mod); // 3.14159
4 [Link](sum(5, 3)); // 8

2
5
6 const calc_mod = new CalculetteMod();
7 [Link](calc_mod.soustraire(10, 4)); // 6

4. [Link]() et [Link]()
[Link]() — Objet Texte JSON

1 const objetJS = { nom: "Alice", age: 30, ville: "Paris" };


2 const chaineJSON = [Link](objetJS);
3
4 [Link](chaineJSON);
5 // {"nom":"Alice","age":30,"ville":"Paris"}

[Link]() — Texte JSON Objet JS

1 const objetParse = [Link](chaineJSON);


2
3 [Link]([Link]); // "Alice"
4 [Link]([Link]); // "Paris"

Résumé JSON
• [Link]() : transforme un objet en texte JSON

• [Link]() : transforme une chaîne JSON en objet JS

Vous aimerez peut-être aussi