JavaScript InnovationsEcmaScript 6 & 7

JavaScript InnovationsEcmaScript 2015 & 2016

Today

const, let, default parameters, rest parameter, spread operator, destructuring, arrows, object literals, classes, proxy, iterators, for..of, generators, promise, unicode, normalize, modules, import, export, symbols, subclassing, reflection api, map, set, weakmap, weakset, typed arrays, template strings, string, number, array, math, binaryliterals, octal literals, regexp, exponentiationoperator, object observe, async function...

What?

• What is removed?

• What is added?

Use today

• Internet Explorer?

• Edge?

• FireFox?

• Chrome?

• Node?

• Babel? Babel???????

Use today

• ES 2015: http://kangax.github.io/compat-table/es6/

• ES 2016: http://kangax.github.io/compat-table/es7/

Current browser

• Shims• https://github.com/paulmillr/es6-shim/

• Transpilers• Babel: https://babeljs.io/

• Traceur: https://github.com/google/traceur-compiler

Limitations of transpilers

• ES5

Why is JavaScript Hard?

• JavaScript Jabber podcast: http://devchat.tv/js-jabber/159-jsj-why-javascript-is-hard

Why is JavaScript Hard?

• Different implementations(browsers/transpilers/node/etc.)

• Scope

• This

• Prototype

• Verbose syntax

• DOM/Array objects are not JavaScriptobjects

DEMO

Demo

• GitHub:https://github.com/rickbeerendonk/ECMAScript-2015-2016-Demos

QUIZ

Valid variable declarations

a) const

b) var

c) set

d) let

a, b, d

Valid function declarations

a) function (x) { return x + x; };

b) (x) => { return x + x; };

c) [Method:] toString() { return "Hello"; }

d) x => x + x;

all

Not transpilable features

a) Modules

b) let

c) Proxies

d) Subclassing built-ins

e) Iterators

c, d (partly)

Criticism

• Add only = More complexity

ES 2016

• Exponential operator

• Object.observe

• Async functions

• Draft | Proposal | Strawman

Rick Beerendonk

rick@nforza.nl

twitter.com/rickbeerendonk

Simple. Clear. Software.