ECMAScript 2017
La convention de dénomination JavaScript a commencé par ES1, ES2, ES3, ES5 et ES6.
Mais ECMAScript 2016 et 2017 ne s'appelaient pas ES7 et ES8.
Depuis 2016 les nouvelles versions sont nommées par année (ECMAScript 2016 / 2017 / 2018).
Nouvelles fonctionnalités dans ECMAScript 2017
Ce chapitre présente les nouvelles fonctionnalités d'ECMAScript 2017 :
- Remplissage de chaîne JavaScript
- JavaScript Object.entries
- JavaScript Object.values
- Fonctions asynchrones JavaScript
- Mémoire partagée JavaScript
Remplissage de chaîne JavaScript
ECMAScript 2017 a ajouté deux méthodes String : padStart
et padEndpour prendre en charge le remplissage au début et à la fin d'une chaîne.
Exemple
let str = "5";
str = str.padStart(4,0);
// result is 0005
Exemple
let str = "5";
str = str.padEnd(4,0);
// result is 5000
Le remplissage de chaîne n'est pas pris en charge dans Internet Explorer.
Firefox et Safari ont été les premiers navigateurs prenant en charge le remplissage de chaînes JavaScript :
| Chrome 57 | Edge 15 | Firefox 48 | Safari 10 | Opera 44 |
| Mar 2017 | Apr 2017 | Aug 2016 | Sep 2016 | Mar 2017 |
Entrées d'objet JavaScript
ECMAScript 2017 ajoute une nouvelle Object.entriesméthode aux objets.
La méthode Object.entries() renvoie un tableau des paires clé/valeur dans un objet :
Exemple
const person = {
firstName : "John",
lastName : "Doe",
age : 50,
eyeColor : "blue"
};
document.getElementById("demo").innerHTML =
Object.entries(person);
Object.entries() simplifie l'utilisation d'objets dans des boucles :
Exemple
const fruits = {Bananas:300, Oranges:200, Apples:500};
let text = "";
for (let [fruit, value] of Object.entries(fruits)) {
text += fruit + ": " + value + "
";
}
Object.entries() simplifie également la conversion d'objets en cartes :
Exemple
const fruits = {Bananas:300, Oranges:200, Apples:500};
const myMap = new Map(Object.entries(fruits));
Chrome et Firefox ont été les premiers navigateurs prenant en charge
Object.entries:
| Chrome 47 | Edge 14 | Firefox 47 | Safari 10.1 | Opera 41 |
| Jun 2016 | Aug 2016 | Jun 2016 | Mar 2017 | Oct 2016 |
Valeurs d'objet JavaScript
Object.valuessont similaires à Object.entries, mais renvoient un tableau à une seule dimension des valeurs d'objet :
Exemple
const person = {
firstName : "John",
lastName : "Doe",
age : 50,
eyeColor : "blue"
};
document.getElementById("demo").innerHTML =
Object.values(person);
Firefox et Chrome ont été les premiers navigateurs prenant en charge
Object.values:
| Chrome 54 | Edge 14 | Firefox 47 | Safari 10.1 | Opera 41 |
| Oct 2016 | Aug 2016 | Jun 2016 | Mar 2017 | Oct 2016 |
Fonctions JavaScript asynchrones
Attente d'un délai d'attente
async function myDisplay() {
let myPromise = new Promise(function(myResolve, myReject) {
setTimeout(function() { myResolve("I love You !!"); }, 3000);
});
document.getElementById("demo").innerHTML = await myPromise;
}
myDisplay();
Firefox et Chrome ont été les premiers navigateurs prenant en charge les fonctions JavaScript asynchrones :
| Chrome 55 | Edge 15 | Firefox 52 | Safari 11 | Opera 42 |
| Dec 2016 | Apr 2017 | Mar 2017 | Sep 2017 | Dec 2016 |