Nouvelles fonctionnalités de JavaScript ES6

Modulaire

Dans ES6, la modularité devient une fonctionnalité standard de JavaScript. La modularité ES6 offre un moyen plus élégant et plus maintenable d'organiser et de gérer le code JavaScript, ce qui peut efficacement éviter la pollution des variables globales et les conflits de noms. Voici quelques-unes des principales fonctionnalités de la modularité ES6 :

Exporter :export vous pouvez exporter une variable, une fonction ou une classe vers un module via des mots-clés pour une utilisation dans d'autres modules.

Par exemple, le code suivant exporte un carré de fonction en tant que module :

// module.js
export function square(x) {
    
    
  return x * x;
}

Importer : vous pouvez importer une variable, une fonction ou une classe depuis d'autres modules via importdes mots-clés et l'utiliser dans le module actuel.

Par exemple, le code suivant importe la fonction carrée du module module.js et l'utilise :

// app.js
import {
    
     square } from './module.js';

console.log(square(5)); // 25

Exportation par défaut : Une variable, une fonction ou une classe peut export defaultêtre exportée en tant que module par défaut via la syntaxe.

Par exemple, le code suivant exporte par défaut une fonction add en tant que module :

// module.js
export default function add(x, y) {
    
    
  return x + y;
}

Importation par défaut : Une variable, une fonction ou une classe peut importêtre importée par défaut depuis d'autres modules via la syntaxe et utilisée dans le module actuel.

Par exemple, le code suivant importe la fonction add du module module.js par défaut et l'utilise :

// app.js
import add from './module.js';

console.log(add(2, 3)); // 5

En bref, la modularité d'ES6 offre un moyen plus flexible et plus maintenable d'organiser et de gérer le code JavaScript, ce qui peut efficacement éviter la pollution des variables globales et les conflits de noms.

Classe de classe

ES6 a introduit classdes mots-clés pour fournir une manière plus concise et orientée objet de définir et d'utiliser des objets. classIl peut être considéré comme une fonction spéciale en JavaScript, qui peut définir une classe et créer des instances de la classe. Voici classquelques-unes des principales fonctionnalités d’ES6 :

Définition de classe : utilisez classdes mots-clés pour définir une classe.

Par exemple, le code suivant définit une classe nommée Person :

class Person {
    
    
  constructor(name, age) {
    
    
    this.name = name;
    this.age = age;
  }

  sayHello() {
    
    
    console.log(`Hello, my name is ${
      
      this.name}, I'm ${
      
      this.age} years old.`);
  }
}

Constructeur : utilisez la méthode constructor pour définir le constructeur d'une classe.

Par exemple, le code suivant définit un constructeur pour la classe Person :

class Person {
    
    
  constructor(name, age) {
    
    
    this.name = name;
    this.age = age;
  }
}

Méthodes de classe : utilisez des méthodes de classe pour définir les méthodes d'une classe.

Par exemple, le code suivant définit une méthode sayHello de la classe Person :

class Person {
    
    
  constructor(name, age) {
    
    
    this.name = name;
    this.age = age;
  }

  sayHello() {
    
    
    console.log(`Hello, my name is ${
      
      this.name}, I'm ${
      
      this.age} years old.`);
  }
}

Héritage de classe : utilisez le mot-clé extends pour implémenter l'héritage de classe.

Par exemple, le code suivant définit une classe Student, qui hérite de la classe Person :

class Person {
    
    
  constructor(name, age) {
    
    
    this.name = name;
    this.age = age;
  }

  sayHello() {
    
    
    console.log(`Hello, my name is ${
      
      this.name}, I'm ${
      
      this.age} years old.`);
  }
}

class Student extends Person {
    
    
  constructor(name, age, grade) {
    
    
    super(name, age);
    this.grade = grade;
  }

  study() {
    
    
    console.log(`${
      
      this.name} is studying in grade ${
      
      this.grade}.`);
  }
}

super mot-clé : utilisez le super mot-clé pour appeler le constructeur et les méthodes de la classe parent.

Par exemple, le code suivant appelle le constructeur de la classe Person à l'aide du mot-clé super :

class Student extends Person {
    
    
  constructor(name, age, grade) {
    
    
    super(name, age);
    this.grade = grade;
  }
}

En bref, ES6 classoffre une manière plus concise et orientée objet de définir et d'utiliser des objets, ce qui peut grandement simplifier l'écriture et la maintenance du code JavaScript. Dans le même temps, ES6 classprend également en charge des fonctionnalités importantes de la programmation orientée objet telles que l'héritage et le polymorphisme, rendant le code JavaScript plus flexible et évolutif.

Symbole

ES6 introduit un nouveau type de données primitif Symbol, qui est une valeur primitive immuable qui peut être utilisée comme identifiant unique pour les propriétés d'un objet. Chaque Symbolvaleur est unique, elles ne seront pas répétées. SymbolEst un type de données similaire à une chaîne, mais sa valeur est unique, immuable et ne sera pas automatiquement convertie en d'autres types.

Vous pouvez utiliser Symbol()la fonction pour créer une nouvelle Symbolvaleur, qui peut accepter une chaîne de description facultative comme paramètre pour décrire l' Symbolobjectif de la valeur, mais cette chaîne de description n'affectera pas Symbolle caractère unique de la valeur.

Voici Symbolquelques fonctionnalités de :

SymbolLa valeur peut être utilisée comme nom d'attribut de l'objet. Comme chaque Symbolvaleur est unique, il n'y aura pas de problème de conflit de nom. Dans les littéraux d'objet, Symbolles propriétés peuvent être définies à l'aide de la syntaxe entre crochets.

const mySymbol = Symbol();
const obj = {
    
    
  [mySymbol]: 'value'
};

console.log(obj[mySymbol]); // 输出 'value'

SymbolLes valeurs ne sont pas automatiquement converties en chaînes et ne peuvent donc pas être utilisées dans les noms de propriétés d'objet, sinon TypeErrorune erreur sera générée.

const mySymbol = Symbol();
const obj = {
    
    };

// 正确做法：将 Symbol 作为属性名
obj[mySymbol] = 'value';

// 错误做法：将 Symbol 转换成字符串作为属性名
obj[mySymbol.toString()] = 'value'; // 抛出 TypeError 错误

Les valeurs intégrées Symbolont des significations spéciales, telles que Symbol.iterator, Symbol.hasInstanceetc., qui sont utilisées pour spécifier l'itérateur par défaut de l'objet, instanceofle comportement personnalisé, etc.

const arr = [1, 2, 3];
const iter = arr[Symbol.iterator]();

console.log(iter.next()); // 输出 { value: 1, done: false }
console.log(iter.next()); // 输出 { value: 2, done: false }
console.log(iter.next()); // 输出 { value: 3, done: false }
console.log(iter.next()); // 输出 { value: undefined, done: true }

SymbolLes valeurs peuvent être utilisées comme constantes pour éviter les conflits de noms. Par exemple, vous pouvez utiliser une Symbolvaleur comme nom d'événement pour vous assurer qu'elle n'entre pas en conflit avec d'autres noms d'événement.

const EVENT_A = Symbol('event_a');
const EVENT_B = Symbol('event_b');

// 发送事件 A
eventEmitter.emit(EVENT_A);

// 监听事件 B
eventEmitter.on(EVENT_B, () => {
    
    
  // do something
});

Pour résumer, Symbolil s'agit d'un identifiant unique qui peut être utilisé comme nom de propriété d'objet, et peut être utilisé pour définir des constantes, spécifier des itérateurs par défaut, etc. Son émergence rend la dénomination des noms de propriétés d'objets en JavaScript plus flexible et plus riche.

fonction flèche

ES6 introduit les fonctions fléchées comme nouvelle syntaxe de définition de fonction. Les fonctions fléchées ont une syntaxe et un comportement spéciaux par rapport aux méthodes traditionnelles de définition de fonctions.

Les fonctionnalités sont les suivantes :

Syntaxe concise : les fonctions fléchées =>sont définies à l'aide de flèches ( ), en omettant functionles mots-clés et les accolades dans le corps de la fonction. Si le corps de la fonction n'a qu'une seule instruction, le mot-clé return peut être omis et le résultat de l'expression est renvoyé implicitement.
```
// 传统函数定义
function add(a, b) {
      
      
  return a + b;
}

// 箭头函数定义
const add = (a, b) => a + b;
```

Les fonctions fléchées n'ont pas leur propre this, arguments, superou new.target. Ils héritent des valeurs correspondantes de la portée externe. Cela signifie qu'à l'intérieur de la fonction flèche, thisl'objet contextuel pointé est l'objet contextuel lorsque la fonction est définie, et non l'objet lorsqu'elle est appelée.

const person = {
      
      
  name: 'John',
  sayHello: function () {
      
      
    setTimeout(() => {
      
      
      console.log(`Hello, ${
        
        this.name}!`);
    }, 1000);
  }
};

person.sayHello(); // 输出 "Hello, John!"

Les fonctions fléchées ne peuvent pas être utilisées comme constructeurs et newles objets ne peuvent pas être instanciés à l'aide de mots-clés. Les fonctions fléchées n'ont pas prototypede propriétés, newles instances d'objet ne peuvent donc pas être créées à l'aide de mots-clés.
```
const Person = (name) => {
      
      
  this.name = name; // 错误：箭头函数不能用作构造函数
};

const john = new Person('John'); // 错误：无法使用new关键字实例化对象
```

Si la fonction flèche n'a qu'un seul paramètre, vous pouvez omettre les parenthèses du paramètre ; s'il n'y a pas de paramètres ou plusieurs paramètres, vous devez utiliser des parenthèses.

// 一个参数
const greet = name => console.log(`Hello, ${
        
        name}!`);

// 没有参数
const sayHello = () => console.log('Hello!');

// 多个参数
const add = (a, b) => a + b;

Les fonctions fléchées simplifient la définition des fonctions dans de nombreux scénarios et sont particulièrement utiles pour gérer les fonctions de rappel, gérer la liaison de contexte et simplifier l'imbrication des fonctions. Cependant, il existe des différences entre les fonctions fléchées et les fonctions traditionnelles qui doivent être notées, notamment dans thisleur comportement face au contexte.

Mission de déstructuration

L'affectation de déstructuration d'ES6 est une syntaxe pratique pour extraire des valeurs d'un tableau ou d'un objet et les affecter à des variables. Cela nous permet d'écrire du code de manière concise et d'extraire rapidement les valeurs requises de structures de données complexes.

L'affectation de déstructuration peut être appliquée aux tableaux et aux objets. Les deux cas sont expliqués en détail ci-dessous :

Mission de déstructuration de tableau :

L'affectation de déstructuration de tableau nous permet d'extraire les valeurs d'un tableau selon un modèle spécifique et de les affecter à des variables. La correspondance de modèles est basée sur la position du tableau.
```
const [a, b, ...rest] = [1, 2, 3, 4, 5];
console.log(a); // 1
console.log(b); // 2
console.log(rest); // [3, 4, 5]
```
Dans l'exemple ci-dessus, nous utilisons l'affectation de déstructuration de tableau pour [1, 2, 3, 4, 5]attribuer les valeurs du tableau aux variables a, bet respectivement rest. aet breçoit respectivement le premier et le deuxième éléments du tableau, tout en restrecevant les éléments restants en tant que nouveau tableau.
Déstructuration et affectation d'objets :

L'affectation de déstructuration d'objet nous permet d'extraire les valeurs d'attribut de l'objet et de les attribuer à des variables, en les faisant correspondre par nom d'attribut.
```
const person = {
      
      
  name: 'Alice',
  age: 25,
  address: {
      
      
    city: 'New York',
    country: 'USA'
  }
};

const {
      
       name, age, address: {
      
       city, country } } = person;
console.log(name); // 'Alice'
console.log(age); // 25
console.log(city); // 'New York'
console.log(country); // 'USA'
```
Dans l'exemple ci- dessus , nous utilisons l'affectation de déstructuration d'objet personpour extraire les propriétés name, et de l'objet et les affecter aux variables correspondantes.ageaddress.cityaddress.country

Notez que les deux-points :peuvent être utilisés pour spécifier des alias pour déstructurer les propriétés attribuées. Dans l'exemple ci-dessus, nous person.addressattribuons la valeur de à une variable addresset déconstruisons addressensuite cityand à partir d'elle country.

L'affectation de déstructuration prend également en charge les valeurs par défaut, les structures imbriquées, ignorant certains éléments et autres fonctions, qui peuvent être utilisées de manière flexible en fonction des besoins spécifiques. Il peut améliorer la lisibilité du code et l’efficacité de l’écriture lorsqu’il s’agit de structures de données complexes.

paramètres de repos

ES6 introduit le concept de paramètres de repos (paramètres restants), qui nous permettent de représenter un nombre indéfini de paramètres sous forme de tableau. Dans les déclarations de fonctions, les paramètres restants sont représentés par trois points (…) suivis d'un nom de paramètre. Cela facilite la gestion des paramètres supplémentaires transmis à la fonction.

Ce qui suit est une explication détaillée de certaines caractéristiques et de l'utilisation des paramètres de repos :

grammaire:
```
function functionName(...rest) {
      
      
  // 函数体
}
```
Dans la déclaration de fonction, utilisez ...restle formulaire pour définir les paramètres de repos. restest un tableau contenant tous les paramètres supplémentaires transmis lorsque la fonction est appelée.
Gestion des paramètres redondants :
lorsque plusieurs paramètres sont transmis lors de l'appel d'une fonction et que seuls quelques paramètres sont définis dans la déclaration de la fonction, les paramètres redondants seront capturés dans les paramètres restants.
```
function sum(...rest) {
      
      
  let total = 0;
  for (let num of rest) {
      
      
    total += num;
  }
  return total;
}

console.log(sum(1, 2, 3, 4, 5)); // 15
```
Dans l'exemple ci-dessus, sumil n'y a qu'un seul paramètre rest dans la liste des paramètres de la fonction rest, mais nous pouvons transmettre n'importe quel nombre de paramètres à sumla fonction et restcalculer la somme en itérant sur le tableau dans le corps de la fonction.
Le paramètre rest est utilisé en combinaison avec d'autres paramètres :
dans une déclaration de fonction, le paramètre rest peut coexister avec d'autres paramètres, mais le paramètre rest doit être le dernier paramètre.
```
function foo(a, b, ...rest) {
      
      
  console.log(a); // 1
  console.log(b); // 2
  console.log(rest); // [3, 4, 5]
}

foo(1, 2, 3, 4, 5);
```
Dans l'exemple ci-dessus, aand bsont des paramètres ordinaires, restmais des paramètres de repos, qui reçoivent des paramètres supplémentaires transmis à la fonction.
Application des paramètres de repos :
- Collecter les paramètres restants : lorsque nous ne sommes pas sûrs du nombre de paramètres qui seront transmis lors de l'appel de la fonction, nous pouvons utiliser le paramètre rest pour collecter les paramètres restants à traiter dans le corps de la fonction.
- Objet d'arguments alternatifs : Les paramètres rest dans ES6 sont plus intuitifs et plus faciles à utiliser. En revanche, argumentsl'objet est un objet de type tableau, et le paramètre rest est un véritable tableau, et diverses méthodes du tableau peuvent être utilisées.
- Flexibilité des paramètres de fonction : en utilisant des paramètres de repos, nous pouvons déclarer des fonctions qui reçoivent n'importe quel nombre de paramètres sans spécifier à l'avance un nombre fixe de paramètres.

Résumé : Les paramètres de repos d'ES6 nous offrent un moyen de gérer un nombre indéfini de paramètres, de les collecter dans un tableau et de les exploiter dans le corps de la fonction. Cela rend la déclaration de fonction plus flexible, rendant la gestion des paramètres redondants plus pratique et plus lisible.

Définir/Carte

ES6 introduit deux nouvelles structures de données, Setet , qui offrent un moyen plus pratique et plus efficace de gérer les collections de données et les paires clé-valeur.Map

Ensemble:
- Set est une collection de données non ordonnée et non répétitive.
- Ses valeurs membres sont uniques et ne seront pas répétées.
- Tout type de valeur peut être stocké, y compris les valeurs primitives et les valeurs de référence.
- Les éléments d'un ensemble ne sont pas indexés et ne sont pas accessibles par index.
- Les principaux scénarios d'application concernent la déduplication et la détermination de l'existence d'un élément.
```
const set = new Set();
set.add(1);
set.add(2);
set.add(3);
set.add(2); // 添加重复元素，但不会生效

console.log(set.size); // 3
console.log(set.has(2)); // true

set.delete(3);
console.log(set.size); // 2

set.clear();
console.log(set.size); // 0
```

Carte:

La carte est une collection de paires clé-valeur, semblable à un objet.
Ses clés et valeurs peuvent être n'importe quel type de données, y compris des valeurs primitives et des valeurs de référence.
Les paires clé-valeur dans Map sont ordonnées.
Vous pouvez utiliser la clé pour obtenir la valeur correspondante.

const map = new Map();
const key1 = 'key1';
const key2 = {
      
       name: 'John' };

map.set(key1, 'value1');
map.set(key2, 'value2');

console.log(map.size); // 2
console.log(map.get(key1)); // 'value1'

map.delete(key2);
console.log(map.size); // 1

console.log(map.has(key2)); // false

map.clear();
console.log(map.size); // 0

Map fournit également des méthodes d'itérateur (Iterator), telles que keys(), values()et entries(), qui peuvent être utilisées pour parcourir les clés, les valeurs et les paires clé-valeur de Map.

const map = new Map();
map.set('a', 1);
map.set('b', 2);
map.set('c', 3);

for (let key of map.keys()) {
      
      
  console.log(key); // 'a', 'b', 'c'
}

for (let value of map.values()) {
      
      
  console.log(value); // 1, 2, 3
}

for (let [key, value] of map.entries()) {
      
      
  console.log(key, value); // 'a' 1, 'b' 2, 'c' 3
}

Map peut également accepter un tableau comme paramètre à initialiser.

const array = [['a', 1], ['b', 2], ['c', 3]];
const map = new Map(array);

console.log(map.get('a')); // 1

Set et Map fournissent des méthodes de traitement de données efficaces et conviennent aux scénarios dans lesquels des collections et des paires clé-valeur doivent être gérées. Ils sont conçus et utilisés de manière à rendre le fonctionnement plus intuitif et efficace, tout en permettant de meilleures performances et évolutivité. ## laisser/const

chaîne de modèle

ES6 introduit les chaînes modèles (Template Strings), qui offrent un moyen plus pratique et plus flexible de traiter les chaînes.

Une chaîne de modèle est une chaîne entourée de backticks (`) et prend en charge les fonctionnalités suivantes :

Interpolation de chaînes :
utilisez ${}la syntaxe pour insérer des variables ou des expressions dans des chaînes de modèles.
```
const name = 'John';
const age = 30;

const message = `My name is ${
        
        name} and I'm ${
        
        age} years old.`;
console.log(message); // "My name is John and I'm 30 years old."
```
En interne, ${}il peut s'agir de n'importe quelle expression JavaScript, y compris des variables, des appels de fonction, des opérateurs, etc.
Chaînes multilignes :
les chaînes de modèle peuvent s'étendre sur plusieurs lignes sans utiliser de caractères d'échappement ni d'opérateurs de concaténation.
```
const multiline = `
  This is
  a multiline
  string.
`;

console.log(multiline);
/*
  "This is
  a multiline
  string."
*/
```
Les chaînes multilignes préservent l'indentation et les nouvelles lignes dans les chaînes du modèle, rendant le code plus lisible.

Chaînes de modèle imbriquées :
d'autres chaînes de modèle peuvent être imbriquées dans des chaînes de modèle pour créer des chaînes plus complexes.

const name = 'John';
const message = `Welcome to our website, ${
        
        name}!

Today's special offer:
Buy 1 get 1 free!
Offer valid until ${
        
        new Date().toLocaleDateString()}.`;

console.log(message);
/*
  "Welcome to our website, John!

  Today's special offer:
  Buy 1 get 1 free!
  Offer valid until 5/11/2023."
*/

Dans l'exemple ci-dessus, ${name}imbriqué dans la chaîne de modèle externe, ${new Date().toLocaleDateString()}imbriqué dans la chaîne de modèle interne.

Chaînes brutes :
préfixer une chaîne de modèle String.rawcrée une chaîne brute qui n'échappe pas aux barres obliques inverses.
```
const path = String.raw`C:\Users\John\Documents\file.txt`;
console.log(path); // "C:\Users\John\Documents\file.txt"
```
Dans l'exemple ci-dessus, la barre oblique inverse reste inchangée dans la chaîne d'origine et n'est pas échappée en tant que caractère spécial.

Les chaînes de modèle offrent un moyen plus intuitif et plus pratique de travailler avec des chaînes, en particulier lorsque vous devez insérer des variables ou créer du texte complexe. Son utilisation peut améliorer la lisibilité et la maintenabilité du code, et réduire les opérations fastidieuses de concaténation et d'échappement de chaînes.

opérateur de propagation

L'opérateur de propagation (Spread Operator) dans ES6 est constitué de trois points consécutifs (...) utilisés pour répartir des objets itérables (tels que des tableaux, des chaînes ou des objets de type tableau).

L’opérateur de spread a les principales utilisations et fonctionnalités suivantes :

Expansion du tableau :
l'opérateur de propagation peut étendre un tableau en plusieurs éléments indépendants.
```
const arr = [1, 2, 3];
console.log(...arr); // 1 2 3
```
Cela facilite la transmission d'éléments d'un tableau à une fonction ou la fusion de plusieurs tableaux.
Expansion de chaîne :
l'opérateur de propagation peut développer une chaîne en caractères individuels.
```
const str = 'hello';
console.log(...str); // "h" "e" "l" "l" "o"
```
Ceci est utile pour les opérations qui nécessitent un traitement des chaînes caractère par caractère.
Expansion d'objet :
l'opérateur de propagation peut étendre un objet en plusieurs paires clé-valeur.
```
const obj = {
      
       x: 1, y: 2 };
console.log({
      
       ...obj }); // { x: 1, y: 2 }
```
Cela peut être utilisé pour copier des objets, fusionner des objets ou créer de nouveaux objets.
Passage de paramètres lors de l'appel d'une fonction :
l'opérateur de propagation peut transmettre des éléments d'un tableau ou d'un objet de type tableau en tant que paramètres de la fonction.
```
function sum(x, y, z) {
      
      
  return x + y + z;
}

const numbers = [1, 2, 3];
console.log(sum(...numbers)); // 6
```
Cela évite apply()les tracas liés à l’utilisation ou à la déstructuration manuelle des paramètres.
Copies superficielles de tableaux et d'objets :
l'opérateur spread peut être utilisé pour créer des copies superficielles de tableaux et d'objets.
```
const arr = [1, 2, 3];
const arrCopy = [...arr];

const obj = {
      
       x: 1, y: 2 };
const objCopy = {
      
       ...obj };
```
Cela crée des copies des tableaux et objets d'origine plutôt que de référencer les mêmes données.

L'opérateur spread fournit un moyen concis et flexible de travailler avec des tableaux, des chaînes et des objets, rendant le code plus lisible et maintenable. Il est très utile dans des scénarios tels que l'appel de fonctions, la fusion de tableaux et la copie d'objets, et peut grandement simplifier le code des opérations associées.

Itérateur/Générateur

ES6 introduit les concepts d'itérateur et de générateur, qui sont utilisés pour traiter des objets itérables et des fonctions qui génèrent des objets itérables.

Itérateur :
un itérateur est un objet qui permet d'accéder séquentiellement à une collection de données. Il possède une next()méthode qui renvoie un objet contenant valueet donedes propriétés à chaque appel.
- value: Indique la valeur actuellement renvoyée par l'itérateur.
- done: Indique si l'itérateur a parcouru tous les éléments. Si c'est le cas, truecela signifie que l'itérateur est terminé, sinon false.
Les itérateurs peuvent être implémentés manuellement ou vous pouvez utiliser les itérateurs intégrés fournis par ES6 pour les objets itérables (tels que les tableaux, les chaînes, les ensembles, les cartes, etc.).
```
const arr = [1, 2, 3];
const iterator = arr[Symbol.iterator]();

console.log(iterator.next()); // { value: 1, done: false }
console.log(iterator.next()); // { value: 2, done: false }
console.log(iterator.next()); // { value: 3, done: false }
console.log(iterator.next()); // { value: undefined, done: true }
```

Itérable :
un itérable est un objet avec un itérateur, une collection de données qui peuvent être itérées (parcourues). Les objets itérables doivent avoir une Symbol.iteratorméthode nommée qui renvoie un objet itérateur.

Les objets itérables intégrés incluent des tableaux, des chaînes, des ensembles, des cartes, etc.

const arr = [1, 2, 3];
const str = 'hello';
const set = new Set([1, 2, 3]);
const map = new Map([['a', 1], ['b', 2], ['c', 3]]);

console.log(arr[Symbol.iterator]); // [Function: values]
console.log(str[Symbol.iterator]); // [Function: [Symbol.iterator]]
console.log(set[Symbol.iterator]); // [Function: values]
console.log(map[Symbol.iterator]); // [Function: entries]

Générateur :
un générateur est une fonction spéciale définie à l'aide function*de mots-clés et qui utilise yielddes instructions dans le corps de la fonction pour suspendre l'exécution de la fonction et renvoyer un objet itérateur.

La fonction génératrice peut générer progressivement des valeurs via un itérateur. Chaque fois que la méthode de la fonction génératrice est appelée next(), l'instruction suivante sera exécutée yieldet un objet contenant valueet donedes attributs sera renvoyé.
```
function* generator() {
      
      
  yield 1;
  yield 2;
  yield 3;
}

const iterator = generator();

console.log(iterator.next()); // { value: 1, done: false }
console.log(iterator.next()); // { value: 2, done: false }
console.log(iterator.next()); // { value: 3, done: false }
console.log(iterator.next()); // { value: undefined, done: true }
```