066 ES2015

06 Mar 2016

ES2015 is the next version of standardised JavaScript. In this episode, we will use Babel JS as the transpiler to code in ES2015. We will go through some features like const, let, map, set, array and string functions as well as promises. Refer to the book Exploring ES6 for an in-depth overview.

Download video: mp4

Sample code: Github

Version: 2015

Background on ES2015

  1. ECMAScript 2015 language specification

Things to learn with ES2015

Setup to watch compilation to ES2015

  1. create a package.json

json { "name": "es2015", "version": "1.0.0", "description": "Learn ES2015", "dependencies": {}, "devDependencies": { "babel-preset-es2015": "^6.3.13" }, "scripts": { "compile": "babel in.js -o out.js", "start": "node out.js" }, "babel": { "presets": [ "es2015" ] }, "plugins": [] } - install packages npm i - in the command line see the various babel commands babel -h - create a file in.js

```js const pi = 3.14 console.log(pi)

pi = 2.16 console.log(pi) ``` - compile it with npm run compile or babel in.js - o out.js - note the error as you cannot change a const - comment / remove line pi = 2.16 - re-compile it with npm run compile or babel in.js - o out.js - run the compiled file with npm start or node out.js

Various ES2015 features

Refer to the code

  1. const
    • let
    • binary, octal, hexadecimal
    • string functions startsWith, endsWith, includes, repeat and interpolation ${string}
    • destructuring
    • function params
    • arrow function
    • class and subclass
    • for-of
    • arrays functions keys, find, findIndex, fill
    • map
    • set
    • promise

Try it online

Credits

  1. Exploring ES6

Axel’s blog on 2ality