ECMAScript 2017
The JavaScript naming convention started with ES1, ES2, ES3, ES5 and ES6.
But, ECMAScript 2016 and ECMAScript 2017 was not called ES7 and ES8.
Since 2016 new versions are named by year (ECMAScript 2016 / 2017 / 2018).
New Features in ECMAScript 2017
This chapter introduces the new features in ECMAScript 2017:
- JavaScript String padding
- JavaScript Object.entries
- JavaScript Object.values
- JavaScript async functions
- JavaScript shared memory
JavaScript String Padding
ECMAScript 2017 added two String methods: padStart and padEnd to support padding at the beginning and at the end of a string.
String Padding is not supported in Internet Explorer.
Firefox and Safari were the first browsers with support for JavaScript string padding:
| Chrome 57 | Edge 15 | Firefox 48 | Safari 10 | Opera 44 |
| Mar 2017 | Apr 2017 | Aug 2016 | Sep 2016 | Mar 2017 |
JavaScript Object Entries
ECMAScript 2017 adds a new Object.entries method to objects.
The Object.entries() method returns an array of the key/value pairs in an object:
Example
const person = {
firstName : "John",
lastName : "Doe",
age : 50,
eyeColor : "blue"
};
document.getElementById("demo").innerHTML = Object.entries(person);
Try it Yourself »
Object.entries() makes it simple to use objects in loops:
Example
const fruits = {Bananas:300, Oranges:200, Apples:500};
let text = "";
for (let [fruit, value] of Object.entries(fruits)) {
text += fruit + ": " + value + "
";
}
Try it Yourself »
Object.entries() also makes it simple to convert objects to maps:
Example
const fruits = {Bananas:300, Oranges:200, Apples:500};
const myMap = new Map(Object.entries(fruits));
Try it Yourself »
Chrome and Firefox were the first browsers with support for Object.entries:
| Chrome 47 | Edge 14 | Firefox 47 | Safari 10.1 | Opera 41 |
| Jun 2016 | Aug 2016 | Jun 2016 | Mar 2017 | Oct 2016 |
JavaScript Object Values
Object.values are similar to Object.entries, but returns a single dimension array of the object values:
Example
const person = {
firstName : "John",
lastName : "Doe",
age : 50,
eyeColor : "blue"
};
document.getElementById("demo").innerHTML = Object.values(person);
Try it Yourself »
Firefox and Chrome were the first browsers with support for Object.values:
| Chrome 54 | Edge 14 | Firefox 47 | Safari 10.1 | Opera 41 |
| Oct 2016 | Aug 2016 | Jun 2016 | Mar 2017 | Oct 2016 |
JavaScript Async Functions
Waiting for a Timeout
async function myDisplay() {
let myPromise = new Promise(function(myResolve, myReject) {
setTimeout(function() { myResolve("I love You !!"); }, 3000);
});
document.getElementById("demo").innerHTML = await myPromise;
}
myDisplay();
Try it Yourself »
Firefox and Chrome were the first browsers with support for async JavaScript functions:
| Chrome 55 | Edge 15 | Firefox 52 | Safari 11 | Opera 42 |
| Dec 2016 | Apr 2017 | Mar 2017 | Sep 2017 | Dec 2016 |
