JavaScript ES6

Qu'est-ce que l'ECMAScript 6 ?

ECMAScript 6 est également appelé ES6 et ECMAScript 2015.

Certains l'appellent JavaScript 6.

Ce chapitre présente certaines nouvelles fonctionnalités de l'ES6.

  • JavaScript let
  • JavaScript const
  • Puissance (**)
  • Valeurs par défaut des arguments
  • Array.find()
  • Array.findIndex()

Prise en charge des navigateurs pour ES6 (ECMAScript 2015)

Safari 10 et Edge 14 sont les premiers navigateurs à prendre en charge pleinement ES6 :

Chrome 58 Edge 14 Firefox 54 Safari 10 Opera 55
Janvier 2017 Août 2016 Mars 2017 Juillet 2016 Août 2018

JavaScript let

La directive let permet de déclarer des variables avec portée de bloc.

Exemple

var x = 10;
// Ici x est 10
{ 
  let x = 2;
  // Ici x est 2
}
// Ici x est 10

Essayez-le vous-même

JavaScript const

const Les instructions permettent de déclarer des constantes (variables JavaScript avec des valeurs constantes).

Les constantes sont similaires à let Les variables, mais pas la valeur.

Exemple

var x = 10;
// Ici x est 10
{ 
  const x = 2;
  // Ici x est 2
}
// Ici x est 10

Essayez-le vous-même

Veuillez consulter nos JavaScript Let / Const En savoir plus sur let et const du contenu.

opérateur exponentiel

L'opérateur de puissance (**）Lève le premier opérande à la puissance du second opérande.

Exemple

var x = 5;
var z = x ** 2;          // Le résultat est 25

Essayez-le vous-même

x ** y le résultat est Math.pow(x,y) Même :

Exemple

var x = 5;
var z = Math.pow(x,2);   // Le résultat est 25

Essayez-le vous-même

Valeurs par défaut des arguments

ES6 Les arguments des fonctions peuvent avoir des valeurs par défaut.

Exemple

function myFunction(x, y = 10) {
  // y est 10 si non passé ou undefined
  return x + y;
}
myFunction(5); // Retournera 15

Essayez-le vous-même

Array.find()

find() La méthode renvoie la valeur du premier élément d'un tableau passé au test de la fonction.

Cet exemple recherche (renvoie) le premier élément (valeur) supérieur à 18 :

Exemple

var numbers = [4, 9, 16, 25, 29];
var first = numbers.find(myFunction);
function myFunction(value, index, array) {
  return value > 18;
}

Essayez-le vous-même

Veuillez noter que cette fonction accepte 3 paramètres :

  • La valeur de l'élément
  • L'index de l'élément
  • L'array lui-même

Array.findIndex()

findIndex() La méthode renvoie l'index du premier élément d'un tableau passé au test de la fonction.

Cet exemple détermine l'index du premier élément supérieur à 18 :

Exemple

var numbers = [4, 9, 16, 25, 29];
var first = numbers.findIndex(myFunction);
function myFunction(value, index, array) {
  return value > 18;
}

Essayez-le vous-même

Veuillez noter que cette fonction accepte 3 paramètres :

  • La valeur de l'élément
  • L'index de l'élément
  • L'array lui-même

Nouvelles propriétés numériques

ES6 a ajouté les propriétés suivantes à l'objet Number :

  • EPSILON
  • MIN_SAFE_INTEGER
  • MAX_SAFE_INTEGER

Exemple

var x = Number.EPSILON;

Essayez-le vous-même

Exemple

var x = Number.MIN_SAFE_INTEGER;

Essayez-le vous-même

Exemple

var x = Number.MAX_SAFE_INTEGER;

Essayez-le vous-même

Nouvelles méthodes numériques

ES6 a ajouté 2 nouvelles méthodes à l'objet Number :

  • Number.isInteger()
  • Number.isSafeInteger()

La méthode Number.isInteger()

Si le paramètre est un entier, alors Number.isInteger() La méthode retourne true.

Exemple

Number.isInteger(10);        // Retourne true
Number.isInteger(10.5);      // Retourne false

Essayez-le vous-même

La méthode Number.isSafeInteger()

Un entier sécurisé peut être représenté avec précision comme un nombre double.

Si le paramètre est un entier sécurisé, alors Number.isSafeInteger() La méthode retourne true.

Exemple

Number.isSafeInteger(10);    // Retourne true
Number.isSafeInteger(12345678901234567890);  // Retourne false

Essayez-le vous-même

Un entier sécurisé est un entier allant de -(253 - 1) à +(253 - 1).

C'est sécurisé : 9007199254740991. C'est non sécurisé : 9007199254740992.

Nouvelles méthodes globales

ES6 a ajouté 2 nouvelles méthodes globales numériques :

  • isFinite()
  • isNaN()

La méthode isFinite()

Si le paramètre est Infinity Ou NaNsi global isFinite() La méthode retourne false.

Sinon, retourne true :

Exemple

isFinite(10/0);       // Retourne false
isFinite(10/1);       // Retourne true

Essayez-le vous-même

La méthode isNaN()

si le paramètre est NaNsi global isNaN() La méthode retourne true. Sinon retourne false:

Exemple

isNaN("Hello");       // Retourne true

Essayez-le vous-même

Fonction fléchée (Arrow Function)

Les fonctions fléchées permettent d'utiliser une syntaxe courte pour écrire des expressions de fonction.

Vous n'avez pas besoin function mots-clés,return mots-clés etaccolades.

Exemple

// ES5
var x = function(x, y) {
   return x * y;
}
// ES6
const x = (x, y) => x * y;

Essayez-le vous-même

La fonction fléchée n'a pas de this. Ils ne conviennent pas à la définitionMéthode d'objet.

La fonction fléchée n'est pas elevatee. Elle doit etre utiliseeAvant.

definir const par rapport à l'utilisation var plus sécurisée, car l'expression de fonction est toujours une valeur constante.

Si la fonction est une seule instruction, alors elle ne peut être omise que return Mots-clés et accolades. Par conséquent, il peut être une bonne habitude de les conserver :

Exemple

const x = (x, y) => { return x * y };

Essayez-le vous-même