The document discusses the future of JavaScript, focusing on ECMAScript 6 (ES6). Key new features in ES6 include arrow functions, default function arguments, destructuring, block scoping, string interpolation, classes, iterators, modules, and promises. While browser support for ES6 is still developing, transpilers like Babel and Traceur can convert new JavaScript syntax to ES5 for broader compatibility. ES6 aims to modernize JavaScript and make it a "real" programming language.

1. The Future of JavaScript
Rob Schley
rob@oseberg.io
RobSchley on Twitter and GitHub

2. Background
The current version of JavaScript is called
ECMAScript 5 or ES5. Why? It’s complicated.
The next version is ES6 (AKA ES.next, ES2015,
ES6 Harmony).
Motivation: JavaScript has blown up in popularity
and is being used in ways that were never imagined
when it was first designed.
It’s time for JavaScript to grow up and become a
“real” language.

3. Features
Arrow Functions
Default Function Arguments
Destructuring
Block Scoping
String Interpolation (aka template strings)
Classes
Iterators
Modules
Promises
And a lot more. The spec is 600+ pages long.

4. Arrow Functions
Should seem familiar if you’ve programmed in Ruby,
Scala, CoffeeScript, and many other languages.
var log = (msg) => console.log(msg)
var log = function(msg) {
console.log(msg)
}

5. Default Function Arguments
function hello(who = 'world') {
console.log('Hello ' + who);
}
hello() // Hello world

6. Destructuring
var [a, b] = ['hello', 'world'];
console.log(a === 'hello'); // true
console.log(b === 'world'); // true

7. Block Scoping
function foo(bar) {
if (!bar) {
let baz = 'baz';
return baz;
}
return 'foo';
}

8. String Interpolation
var foo = 'Foo';
var bar = 'Baz';
console.log(
`Hey ${foo}, check out ${bar}`
);

9. Classes
class Person {
constructor(name) {
this.name = name;
}
introduce() {
console.log(`I'm ${this.name}`);
}
}
var rob = new Person('Rob');
rob.introduce(); // I’m Rob

10. Modules
-- models.js
class Person {...}
class Developer extends Person {...}
export {Person, Developer}
-- app.js
import {Developer} from './models';
var dev = new Developer();

11. Browser Support

12. Transpilers
Not all features are transpile-able. (Sub-classing
built-ins, Proxies, typed-arrays, etc.)
Requires a build process but that’s simple to
implement with modern tooling. (You should
probably have a build process anyway)
Two major contenders: Babel and Traceur with 78%
and 66% feature coverage respectively.
They’re pretty similar, Babel aims to make readable
ES5 code. It also support JSX, if you’re into that.

13. Resources
http://kangax.github.io/compat-table/es6/
https://github.com/lukehoban/es6features
https://github.com/thoughtram/es6-babel-
browserify-boilerplate
https://www.youtube.com/watch?v=mPq5S27qWW8