ECMAScript 2017

Les conventions de nommage JavaScript commencent avec ES1, ES2, ES3, ES5 et ES6.

Mais ECMAScript 2016 et 2017 ne sont pas appelés ES7 et ES8.

Depuis 2016, les nouvelles versions sont nommées par année (ECMAScript 2016/2017/2018).

Nouvelles fonctionnalités de ECMAScript 2017

Ce chapitre présente les nouvelles fonctionnalités de ECMAScript 2017 :

  • Remplissage des chaînes de caractères JavaScript
  • Object.entries JavaScript
  • Object.values JavaScript
  • Fonctions asynchrones JavaScript
  • Mémoire partagée JavaScript

Remplissage des chaînes de caractères JavaScript

ECMAScript 2017 a ajouté deux nouvelles méthodes String :padStart et padEndpour permettre le remplissage à la tête et à la queue des chaînes de caractères.

une instance

let str = "5";
str = str.padStart(4,0);
// Le résultat est : 0005

Essayez-le vous-même

une instance

let str = "5";
str = str.padEnd(4,0);
// Le résultat est : 5000

Essayez-le vous-même

Internet Explorer ne prend pas en charge le remplissage des chaînes.

Firefox et Safari sont les premiers navigateurs à prendre en charge le remplissage des chaînes JavaScript :

Chrome IE Firefox Safari Opera
Chrome 57 Edge 15 Firefox 48 Safari 10 Opera 44
Mars 2017 Avril 2017 août 2016 septembre 2016 Mars 2017

EmptyEntries JavaScript

ECMAScript 2017 a ajouté de nouvelles Object.entries méthode.

Object.entries() retourne un tableau des paires clé/valeur de l'objet :

une instance

const person = {
  firstName : "Bill",
  lastName : "Gates",
  age : 50,
  eyeColor : "blue"
};
document.getElementById("demo").innerHTML = Object.entries(person);

Essayez-le vous-même

Object.entries() rend plus simple l'utilisation des objets dans les boucles :

une instance

const fruits = {Bananas:300, Oranges:200, Apples:500};
let text = "";
for (let [fruit, value] of Object.entries(fruits)) {
text += fruit + ": " + value + "
";
}

Essayez-le vous-même

Object.entries() rend simple la conversion d'un objet en une carte :

une instance

const fruits = {Bananas:300, Oranges:200, Apples:500};
const myMap = new Map(Object.entries(fruits));

Essayez-le vous-même

Chrome et Firefox sont les premiers navigateurs à prendre en charge Object.entries des navigateurs :

Chrome IE Firefox Safari Opera
Chrome 47 Edge 14 Firefox 47 Safari 10.1 Opera 41
juin 2016 août 2016 juin 2016 Mars 2017 Octobre 2016

valeurs des objets JavaScript

Object.values similaire Object.entriesmais retourne un tableau à une dimension des valeurs de l'objet :

une instance

const person = {
  firstName : "Bill",
  lastName : "Gates",
  age : 50,
  eyeColor : "blue"
};
document.getElementById("demo").innerHTML = Object.values(person);

Essayez-le vous-même

Firefox et Chrome sont les premiers navigateurs à prendre en charge Object.values des navigateurs :

Chrome IE Firefox Safari Opera
Chrome 54 Edge 14 Firefox 47 Safari 10.1 Opera 41
Octobre 2016 août 2016 juin 2016 Mars 2017 Octobre 2016

Fonction asynchrone JavaScript

Attente de dépassement du délai

async function myDisplay() {
  let myPromise = new Promise(function(myResolve, myReject) {
    setTimeout(function() { myResolve("Je t'aime !!"); }, 3000);
  });
  document.getElementById("demo").innerHTML = await myPromise;
}
myDisplay();

Essayez-le vous-même

Firefox et Chrome sont les premiers navigateurs à soutenir les fonctions JavaScript asynchrones :

Chrome IE Firefox Safari Opera
Chrome 55 Edge 15 Firefox 52 Safari 11 Opera 42
Décembre 2016 Avril 2017 Mars 2017 Septembre 2017 Décembre 2016