"Si un ouvrier veut bien faire son travail, il doit d'abord affûter ses outils." - Confucius, "Les Entretiens de Confucius. Lu Linggong"
Page de garde > La programmation > Notes de version JavaScript ES : Libérer la puissance du JavaScript moderne

Notes de version JavaScript ES : Libérer la puissance du JavaScript moderne

Publié le 2024-11-06
Parcourir:225

JavaScript ESelease Notes: Unleashing the Power of Modern JavaScript

JavaScript ES6, officiellement connu sous le nom d'ECMAScript 2015, a introduit des améliorations significatives et de nouvelles fonctionnalités qui ont transformé la façon dont les développeurs écrivent JavaScript. Voici les 20 principales fonctionnalités qui définissent ES6 et ont rendu la programmation en JavaScript plus efficace et plus agréable.

Top 20 des fonctionnalités de JavaScript ES6

1 Laisser et Const

  • let permet la déclaration de variables à portée de bloc.
  • const crée des constantes de portée bloc, empêchant la réaffectation.

2 Fonctions fléchées

  • Syntaxe plus courte pour les expressions de fonction, en conservant la valeur lexicale de celle-ci.
   const add = (a, b) => a   b;

3 Modèles littéraux

  • Littéraux de chaîne améliorés prenant en charge l'interpolation et les chaînes multilignes.
   const name = 'World';
   const greeting = `Hello, ${name}!`;

4 Mission de déstructuration

  • Une syntaxe pour décompresser les valeurs de tableaux ou les propriétés d'objets en variables distinctes.
   const arr = [1, 2, 3];
   const [x, y, z] = arr;

5 Paramètres par défaut

  • Les paramètres de fonction peuvent avoir des valeurs par défaut, ce qui rend les fonctions plus flexibles.
   function multiply(a, b = 1) {
       return a * b;
   }

6 Opérateurs de repos et de propagation

  • ... peut être utilisé pour agrandir ou rassembler des éléments.
   const sum = (...numbers) => numbers.reduce((a, b) => a   b, 0);
   const arr = [1, 2, 3];
   const newArr = [...arr, 4, 5];

7 Modules

  • ES6 introduit un système de modules pour une meilleure organisation du code.
   // export
   export const pi = 3.14;
   // import
   import { pi } from './math.js';

8 Cours

  • Sucre syntaxique par rapport à l'héritage existant basé sur un prototype de JavaScript, permettant des définitions de classe plus faciles.
   class Animal {
       constructor(name) {
           this.name = name;
       }
       speak() {
           console.log(`${this.name} makes a noise.`);
       }
   }

9 Promesses

  • Une manière native de gérer les opérations asynchrones, offrant une alternative plus propre aux rappels.
   const fetchData = () => new Promise((resolve, reject) => {
       // async operation
   });

10 Littéraux d'objet améliorés
- Syntaxe plus concise pour définir les propriétés et les méthodes des objets.

    const name = 'John';
    const person = {
        name,
        greet() {
            console.log(`Hello, ${this.name}`);
        }
    };

11 Type de données de symbole
- Un nouveau type de données primitif pour les identifiants uniques.

    const sym = Symbol('description');

12 Collections de cartes et d'ensembles
- Nouvelles structures de données pour stocker des valeurs uniques ou des paires clé-valeur.

    const mySet = new Set([1, 2, 3]);
    const myMap = new Map([[1, 'one'], [2, 'two']]);

13 WeakMap et WeakSet
- Collections qui permettent le garbage collection de leurs clés.

    const weakMap = new WeakMap();

14 Itérateurs et générateurs
- Objets itérables personnalisés utilisant Symbol.iterator et fonctions pouvant être suspendues à l'aide de la fonction *.

    function* generator() {
        yield 1;
        yield 2;
    }

15 pour...de boucle
- Une nouvelle construction de boucle pour itérer sur des objets itérables, tels que des tableaux et des chaînes.

    for (const value of [1, 2, 3]) {
        console.log(value);
    }

16 Array.prototype.find() et Array.prototype.findIndex()
- Méthodes pour rechercher dans les tableaux et renvoyer la première correspondance ou son index.

    const arr = [5, 12, 8, 130, 44];
    const found = arr.find(element => element > 10);

17 String.prototype.includes()
- Une méthode pour vérifier si une chaîne contient une sous-chaîne spécifiée.

    const str = 'Hello, world!';
    console.log(str.includes('world')); // true

18 Object.assign()
- Une méthode pour copier les valeurs d'un ou plusieurs objets source vers un objet cible.

    const target = { a: 1 };
    const source = { b: 2 };
    Object.assign(target, source);

19 Object.entries() et Object.values()
- Méthodes pour récupérer les entrées ou les valeurs d'un objet sous forme de tableaux.

    const obj = { a: 1, b: 2 };
    console.log(Object.entries(obj)); // [['a', 1], ['b', 2]]

20 Promise.all() et Promise.race()
- Méthodes pour gérer plusieurs promesses simultanément.

    Promise.all([promise1, promise2]).then(results => {
        // handle results
    });

Conclusion

JavaScript ES6 a fondamentalement amélioré le langage, le rendant plus puissant et plus convivial pour les développeurs. En utilisant ces fonctionnalités, les développeurs peuvent écrire un code plus propre, plus efficace et plus maintenable. Profitez de la puissance d'ES6 dans votre prochain projet !

Déclaration de sortie Cet article est réimprimé à: https://dev.to/engrsakib/unlocking-the-power-of-javascript-es6-a-comprehensive-guide-to-its-top-20-features-2hpc?1 s'il y a une violation, veuillez contacter [email protected] pour le supprimer.
Dernier tutoriel Plus>

Clause de non-responsabilité: Toutes les ressources fournies proviennent en partie d'Internet. En cas de violation de vos droits d'auteur ou d'autres droits et intérêts, veuillez expliquer les raisons détaillées et fournir une preuve du droit d'auteur ou des droits et intérêts, puis l'envoyer à l'adresse e-mail : [email protected]. Nous nous en occuperons pour vous dans les plus brefs délais.

Copyright© 2022 湘ICP备2022001581号-3