Quoi de neuf dans JavaScript es6?
JavaScript ES6 est une norme pour assurer l'interopérabilité de la page Web dans divers navigateurs Web. ES6 est le 6e Version du langage de programmation JavaScript. C'est une amélioration majeure de la langue JavaScript, ajoutant plus de fonctionnalités pour faciliter le développement de logiciels à grande échelle. Peu de fonctionnalités du script ES6 ne sont pas prises en charge par tous les navigateurs, mais la plupart sont pris en charge; Presque tous les navigateurs Web célèbres prennent en charge toutes les fonctionnalités d'ES6.
Le logiciel de transpiler peut être utilisé pour transformer le code ES6 en ES5, qui est l'ancienne version de JavaScript et donc plus compatible avec les navigateurs.
Dans cet article, nous examinons certains changements ES6 apportés en JavaScript.
Caractéristiques de ES6 JavaScript
Constantes connues sous le nom de variables immuables: ES6 soutient désormais la notion de variables constantes. La valeur de ces variables ne peut pas être modifiée. Une erreur sera déclenchée si quelqu'un essaie de redéfinir la variable dans la portée similaire:
const pi = mathématiques.PI;// Sortie: valeur de pi
console.log (pi);
pi = 4;
// TypeError: affectation à une variable constante.
console.log (pi);
const pi = mathématiques.PI;
// Sortie: valeur de pi
console.log (pi);
const pi = 4;
// Sortie: 4 (sans aucune erreur car elle est hors de portée)
console.log (pi);
Si un objet a été déclaré utiliser const, ses clés ne peuvent pas être changées. Cependant, ses valeurs peuvent être modifiées:
const user =Nom: "Steve",
Âge: 13
user =
Nom d'utilisateur: "Harry",
Grade: "3e"
// TypeError: affectation à une variable constante. const user =
Nom: "Steve",
Âge: 13
utilisateur.name = "Harry";
console.log (utilisateur);
Règles des fonctions et variables de portée bloquée
Une autre nouvelle caractéristique importante de l'ES6 est que les variables peuvent être déclarées à travers laisser et const qui suivent les règles de blocage en bloc. Grâce à cette règle de blocage, la variable maintient sa valeur jusqu'à la fin du bloc. La valeur du bloc extérieur sera restaurée après le bloc intérieur:
Soit a = 5;// Sortie: 5
console.journal (a);
Soit a = 4;
// Sortie: 4
console.journal (a);
// Sortie: 5
console.journal (a);
Fonctions flèches
ES6 prend également en charge les fonctions flèches qui sont presque les mêmes que les fonctions traditionnelles JavaScript mais plus compactes. Dans l'exemple ci-dessous, nous avons fait une fonction flèche qui prend un nombre comme argument et renvoie la valeur de son carré:
sq = a => a * a;console.log (Sq (5));
Les fonctions de flèche ont leurs limites et ne peuvent pas être utilisées partout.
Gestion des paramètres de fonction
ES6 nous donne la possibilité de définir des valeurs par défaut pour les paramètres d'une fonction. Si aucun argument n'est donné lors de l'appel de la fonction, les paramètres par défaut sont utilisés:
fonction sq (a = 5, b = 3)console.log (a + "+" + b + "=" + (a + b));
SQ (5, 9);
SQ ();
Paramètres de la fonction de repos
La fonction des paramètres de repos est une autre caractéristique de l'ES6. Cette fonctionnalité vous aide à recevoir un certain nombre d'arguments chaque fois que la fonction est appelée. La syntaxe ci-dessous vous permet de capturer les arguments restants après l'argument défini dans un tableau:
fonction restparams (a, b,… params)console.journal (a);
console.journal (b);
console.log (params);
RESTPARAMS (1,2,3,4,5,6,7,8,9);
Modèle littéraux
Un modèle de chaîne ou un modèle littéral fait référence aux variables et expressions interpolées comme des cordes à l'aide d'une syntaxe Perl. En mots plus simples, une chaîne peut être enfermée en backticks (') et ces chaînes peuvent inclure des expressions (interpolées) en utilisant le $ ··· syntaxe:
var firstname = 'John';var lastname = 'Doe';
console.Log ('Mon nom est $ FirstName $ LastName');
Propriétés de l'objet
ES6 a fourni une nouvelle syntaxe pour la création d'objets. Voici l'exemple:
var firstname = 'John';var lastname = 'Doe';
var id = 03;
Var Department = 'Education';
var Employeedata = FirstName, LastName, Id, Department;
console.Log (Employeedata);
Syntaxe de la définition de classe formelle
JavaScript ES6 prend en charge la syntaxe de définition de classe formelle. C'est un sucre syntaxtique simple pour les classes basées sur le prototype qui sont déjà disponibles, mais cela aide à améliorer la clarté du code. Cela signifie que cela n'a pas ajouté de nouveau modèle d'objet.
classe Circleconstructeur (rayon)
ce.rayon = rayon;
var c = nouveau cercle (8);
Déclaration de méthodes
ES6 JavaScript fournit un moyen plus simple de déclarer des méthodes. Plus tôt, dans ES5, nous devions mentionner le mot-clé «fonction» avec le nom de la fonction tout en le définissant. Cependant, dans ES6, nous pouvons utiliser la fonction Arrow et nous ne sommes pas obligés d'écrire le mot-clé «fonction». Voici l'exemple:
Dans ES5
var diamètre = fonction (rayon)Soit dia = 2 * rayon;
DIA RETOUR;
;
diamètre (8);
Dans ES6
var diamètre = (rayon) =>Soit dia = 2 * rayon;
DIA RETOUR;
;
diamètre (8);
Pour / des boucles
En utilisant pour / de, vous pouvez itérer sur des structures de données itérables telles que des tableaux, des chaînes, des cartes, etc.:
var num = [5, 6, 7, 8, 9];pour (soit d de num)
console.journal (d);
Conclusion
ES6 est la deuxième révision majeure de JavaScript qui a été publiée en 2015. Il y a eu des ajouts annuels à JavaScript dans ES7, ES8, ES9 et ainsi de suite, mais ces nouvelles versions n'ont apporté aucun changement significatif. Dans cet article, nous avons brièvement expliqué ce qu'est JavaScript ES6, les avantages de la version ES6 et certaines des nouvelles fonctionnalités introduites dans la version ES6.