このすみノート

Webエンジニアが技術や趣味を書くブログです。

ES2015・ES2016・ES2017・ES2018を手早く学習するTHE ES Guide

技術書同人誌博覧会(技書博)向けのNode.js同人誌を書いてる際に、オススメのサイトを見つけたのでご紹介します。

@flaviocopesさんの「THE ES Guide」です。

ES2015(ES6)

ES2015はlet・const・class・Promiseをはじめとする重要な構文や機能が目白押しなので、とても重要度が高いです。

flaviocopes.com

  • Arrow Functions
  • A new this scope
  • Promises
  • Generators
  • let and const
  • Classes
    • Constructor
      • Super
      • Getters and setters
  • Modules
    • Importing modules
    • Exporting modules
  • Template Literals
  • Default parameters
  • The spread operator
  • Destructuring assignments
  • Enhanced Object Literals
    • Simpler syntax to include variables
    • Prototype
    • super()
    • Dynamic properties
  • For-of loop
  • Map and Set
  • New String methods
  • New Object methods

ES2016

ES2016は小粒の修正なので、5分でさらっと見れる分量です。

flaviocopes.com

  • Array.prototype.includes()
  • Exponentiation Operator

f:id:konosumi:20190721220534j:plain

ES2017

ES2017はなんといってもasync/awaitです。 非同期プログラミングやコールバック地獄の解消にも役立ります。

flaviocopes.com

  • String padding
  • Object.values()
  • Object.entries()
  • getOwnPropertyDescriptors()
    • In what way is this useful?
  • Trailing commas
  • Async functions
    • Why they are useful
    • A quick example
    • Multiple async functions in series
  • Shared Memory and Atomics

ES2018

ES2018は「Asynchronous iteration」がオススメで、これがNode.jsのStreamプログラミングでも使えます。 Node.jsのStreamは難しいと言われることもありますが、これをシンプルに扱える点が魅力的です。

const fs = require('fs');

(async () => {
  try {
    const stream = fs.createReadStream('data.txt', 'utf8');

    // for-await-of
    for await (const data of stream) {
      console.log(data);
    }
  } catch(error) {
    console.error(error);
  }
})();

そして地味にPromiseのfinally()の役立ちそうです。

flaviocopes.com

  • Rest/Spread Properties
  • Asynchronous iteration
  • Promise.prototype.finally()
  • Regular Expression improvements
    • RegExp lookbehind assertions: match a string depending on what precedes it
    • Unicode property escapes \p{…} and \P{…}
    • Named capturing groups
    • The s flag for regular expressions

さいごに

@flaviocopesさんの「THE ES Guide」は、ES2015・ES2016・ES2017・ES2018について簡潔に要点がまとまっています。 英語ではありますが、英語も比較的読みやすく書かれています。

ES2015〜ES2018のJavaScriptについて一通りキャッチアップできますので、とてもオススメです。