ECMAScript 2017
JavaScript のバージョン番号
古いJSバージョンは、ES5(2009)およびES6(2015)という番号で名前が付けられています。
2016年以降、バージョンはECMAScript 2016、2017、2018、2019のように年によって名前が付けられます。
ECMAScript 2017 の新機能
この章では、ECMAScript 2017の新機能を紹介します。
- JavaScript String padding
- JavaScript Object entries()
- JavaScript Object values()
- JavaScript async and await
- JavaScript Object.getOwnPropertyDescriptors
JavaScript String padding
ECMAScript 2017では、JavascritにpadStartとpadEndの2つのStringメソッドが追加されました。
文字列の先頭と末尾のパディングをサポートします。
JavaScript String paddingは、2017年4月以降、最新のすべてのブラウザーでサポートされています。
| Chrome 57 | Edge 15 | Firefox 48 | Safari 10 | Opera 44 |
| 2017年3月 | 2017年4月 | 2016年8月 | 2016年9月 | 2017年3月 |
JavaScript オブジェクトのエントリ
ECMAScript 2017では、Object.entries()オブジェクトにメソッドが追加されました。
Object.entries()オブジェクト内のキーと値のペアの配列を返します。
例
const person = {
firstName : "John",
lastName : "Doe",
age : 50,
eyeColor : "blue"
};
let text = Object.entries(person);
Object.entries()ループ内でのオブジェクトの使用が簡単になります。
例
const fruits = {Bananas:300, Oranges:200, Apples:500};
let text = "";
for (let [fruit, value] of Object.entries(fruits)) {
text += fruit + ": " + value + "<br>";
}
Object.entries()また、オブジェクトをマップに変換することも簡単になります。
例
const fruits = {Bananas:300, Oranges:200, Apples:500};
const myMap = new Map(Object.entries(fruits));
Object.entries()は、2017年3月以降、最新のすべてのブラウザーでサポートされています。
| Chrome 47 | Edge 14 | Firefox 47 | Safari 10.1 | Opera 41 |
| 2016年6月 | 2016年8月 | 2016年6月 | 2017年3月 | 2016年10月 |
JavaScript オブジェクトの値
Object.values()に似ているObject.entries()、がありますがオブジェクト値の1次元配列を返します。
例
const person = {
firstName : "John",
lastName : "Doe",
age : 50,
eyeColor : "blue"
};
let text = Object.values(person);
Object.values()2017年3月以降、最新のすべてのブラウザーでサポートされています。
| Chrome 54 | Edge 14 | Firefox 47 | Safari 10.1 | Opera 41 |
| 2016年10月 | 2016年8月 | 2016年6月 | 2017年3月 | 2016年10月 |
JavaScriptの非同期関数
タイムアウト待ち
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とChromeは、非同期JavaScript 関数をサポートする最初のブラウザです。
| Chrome 55 | Edge 15 | Firefox 52 | Safari 11 | Opera 42 |
| 2016年12月 | 2017年4月 | 2017年3月 | 2017年9月 | 2016年12月 |
プログラミング学習を加速させる
プログラミングをプロの講師に教えてもらいませんか。