js awesomeness or how will es6 help me build better apps ?
TRANSCRIPT
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
JS awesomeness!
or How will ES6 help me build better apps ?
2
Plamen StoevSenior Front-end Developer @ MentorMate
@pstoevPlamen Stoev
April 4, 2015
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
Agenda
Brief history of JavaScript
Why EcmaScript 6 ?
Environments to run ES6
Give me the new stuff ?
3 April 4, 2015
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
Brief History of JavaScript
Notable figures
Brendan Eich
- Co-founder of Mozilla Foundation
- CTO @ Mozilla (resigned)
- CEO @ Mozilla (resigned)
- Creator of JavaScript - 1995
4 April 4, 2015
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
Brief History of JavaScript
Notable figures
Douglas Crockford
aka (The JavaScript Guy)
- JSON
- JSLint
5 April 4, 2015
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
Brief History of JavaScript
Glossary
EcmaScript – synonym for JavaScript
Ecma International – standards organization
Ecma-262 – The official EcmaScript specification
EcmaScript5 – 5th edition of Ecma-262
Timeline:
EcmaScript 3 – Dec 1999
EcmaScript 5 - Dec 2009
EcmaScript 6 (ES.next) – Publication process starts March 2015
EcmaScript 7 (TBA)
6 April 4, 2015
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
Brief History of JavaScript
Why “Harmony” ?
What is “Harmony” ?
7 April 4, 2015
Photo by Alberto Giorgio
A superset of ES6
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
Why EcmaScript 6 ?
Overview
Why a new version ?
What problem does it solve ?
“The purpose of a programming language is to aid programmers in
producing error-free programs”
-- D. Crockford
8 April 4, 2015
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
Agenda
So far
Brief history of JavaScript
Why EcmaScript 6 ?
Environments to run ES6
So what’s new ?
9 February 13, 2015
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
Environments to run ES6
Overview
Server-side environments
Client-side environments
Transpilers
Note: ES6 currently runs in strict mode only
10 April 4, 2015
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
Environments to run ES6
Server-side
11 April 4, 2015
node –-harmony app.js
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
Environments to run ES6
Client-side
12 April 4, 2015
chrome://flags/
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
Environments to run ES6
Transpilers
13 April 4, 2015
npm install babelCheck out the
online transpiler!
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
So what’s new ?
Overview
Arrow function syntax
Operators let, const
Weak maps
Generators
Destructuring
Object.observe
Other interesting ES6 features
14 April 4, 2015
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
So what’s new ?
Arrow function syntax
Note: ‘this’ is preserving context of the containing method
15 April 4, 2015
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
So what’s new ?
let, const
Operators let and const – the new ‘var’.
They are “visible” in the current block scope only
Prevents hoisting and global scope pollution
16 April 4, 2015
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
So what’s new ?
Weak maps
Weird naming :)
17 April 4, 2015
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
So what’s new ?
Generators
18 April 4, 2015
Allows function execution to be “paused”
You write synchronous code
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
So what’s new ?
Destructuring - Arrays
19 April 4, 2015
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
So what’s new ?
Destructuring - Objects
20 April 4, 2015
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
So what’s new ?
Object.observe
It’s a ES7 feature!
21 April 4, 2015
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
So what’s new ?
Other features worth mentioning
More object-related methods – String.includes, parseInt goes in Number,
Array.from, more Math.* methods for precise computing
Default values for params – i.e. function(foo, bar = 7, baz = true);
Rest params: function(foo, bar, …everythingElse)
Template strings (multi-line strings)
Modules
Promises
Proxies
Tail calls
Class syntax
22 April 4, 2015
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
Useful Links
Overview
http://wiki.ecmascript.org
https://developer.mozilla.org/en-
US/docs/Web/JavaScript/New_in_JavaScript
http://kangax.github.io/compat-table/es6/
http://babel.io/
http://iojs.org/
https://google.github.io/traceur-compiler/demo/repl.html
23 April 4, 2015
CONFIDENTIAL © MobCon Bulgaria. All rights reserved.
Thank you!
Plamen Stoev
Questions?
Senior Front-end Developer
MentorMate
@pstoevPlamen Stoev
24 April 4, 2015