O que já era bom, com todas as adições do ECMA5 e da comunidade, ficou muito melhor com as adições do ECMA2015

1. "Agora Nervoso"
"Agora Nervoso"

2. Luís Fernando VendrameLuís Fernando Vendrame
lvendrame@gmail.com
@lvendrame

3. O que era bom ficouO que era bom ficou
melhor ainda!melhor ainda!

4. ECMAScript 2015ECMAScript 2015
let, const, class
modules (export, import)
Destructing arrays e objects
Spread operator
promises (nativo)
Arrow functions
Generators + coroutines
Default parameter values
String templates
Property e método shorthand

5. Lembra do Hooking
Let
Const

6. ConstConst
const myConst = "Meu valor";
myConst = "Novo valor"; //Uncaught TypeError: Assignment to constant varia
//But
const myObj = { prop: 'valor' };
myObj.prop = "Novo valor";// Vai de boas

7. LetLet
function main(){
let a = 10;
for(let i = 0; i < a; i++){
let d = a + i;
}
console.log(d);//Uncaught ReferenceError: d is not defin
}

8. ClassClass
class Shape {
constructor (id, x, y) {
this.id = id
this.move(x, y)
}
move (x, y) {
this.x = x
this.y = y
}
}
class Rectangle extends Shape {
constructor (id, x, y, width, height) {
super(id, x, y)
this.width = width
this.height = height
}
}

9. Arrow FunctionsArrow Functions
x => x * 2;
(x, y) => x + y;
odds = evens.map(v => v + 1);
pairs = evens.map(v => ({ even: v, odd: v + 1 }));
nums = evens.map((v, i) => v + i);

10. Destructuring ArrayDestructuring Array
var list = [ 1, 2, 3 ];
var [ a, , b ] = list; //a = 1, b = 3
[ b, a ] = [ a, b ];

11. Destructuring ObjectDestructuring Object
function getASTNode(){
return {
op: "Olá",
omg: "Nem",
rhs: 35,
lhs: 26,
children: []
};
}
var { op, lhs, rhs } = getASTNode();

12. ModulesModules
// lib/math.js
export function sum (x, y) { return x + y }
export var pi = 3.141593
// someApp.js
import * as math from "lib/math"
console.log("2π = " + math.sum(math.pi, math.pi))
// otherApp.js
import { sum, pi } from "lib/math"
console.log("2π = " + sum(pi, pi))

13. Spread OperatorSpread Operator
var params = [ "hello", true, 7 ]
var other = [ 1, 2, ...params ] // [ 1, 2, "hello", true, 7 ]
//Function with Rest Parameter
function f (x, y, ...a) {
return (x + y) * a.length
}
f(1, 2, ...params) === 9
var str = "foo"
var chars = [ ...str ] // [ "f", "o", "o" ]

14. PromisesPromises
Agora existe uma implementação nativa
compatível com Promises A+.
“
Mas ainda prefiro o Bluebird

15. IteratorsIterators
{
next: function(){
return {
value: ???,
done: true|false;
}
}
myObject[Symbol.iterator]
for(let value of myObject);
//Exemplo
function makeIterator(array){
var nextIndex = 0;
return {
next: function(){
return nextIndex < array.length ?
{value: array[nextIndex++], done: false} :
{done: true};
}
}
}

16. GeneratorsGenerators
function *contar(max){
let i = 0;
while(i<max){
yield i;
i++;
}
return i;
}
var contar10 = contar(10);
console.log(contar.next());//{value: 0, done: false}
console.log(contar.next());//{value: 1, done: false}
console.log(contar.next());//{value: 2, done: false}
console.log(contar.next());//{value: 3, done: false}
console.log(contar.next());//{value: 4, done: false}
console.log(contar.next());//{value: 5, done: false}
console.log(contar.next());//{value: 6, done: false}
console.log(contar.next());//{value: 7, done: false}
console.log(contar.next());//{value: 8, done: false}
console.log(contar.next());//{value: 9, done: false}
console.log(contar.next());//{value: 10, done: true}
console.log(contar.next());//{value: undefined, done: tru

17. GeneratorsGenerators
function* foo(x) {
var y = 2 * (yield (x + 1));
var z = yield (y / 3);
return (x + y + z);
}
var it = foo( 5 );
console.log( it.next() ); // { value:6, done:false }
console.log( it.next( 12 ) ); // { value:8, done:false }
console.log( it.next( 13 ) ); // { value:42, done:true }

18. CoroutinesCoroutines
'use strict'
const co = require('co');
const marked = require('marked');
const fs = require('fs-promise');
const handlebars = require('handlebars');
co(function *() {
let md = yield fs.readFile('README.md');
let html = marked(md.toString());
let template = yield fs.readFile('layout.hbs');
let output = handlebars.compile(template.toString())({
title: 'README',
contents: html
});
yield fs.writeFile('index.html', output);
}).catch(function(err) {
console.error(err.stack);
});

19. Default parameter valueDefault parameter value
function f (x, y = 7, z = 42) {
return x + y + z
}
f(1) === 50
//ECMAScript 5
function f (x, y, z) {
y = y || 7;
if (z === undefined){
z = 42;
}
return x + y + z;
};
f(1) === 50;

20. String templateString template
var customer = { name: "Foo" };
var card = { amount: 7, product: "Bar", unitprice: 42 };
var message = `Hello ${customer.name},
want to buy ${card.amount} ${card.product} for
a total of ${card.amount * card.unitprice} bucks?`;

21. Property & method shorthandProperty & method shorthand
var x = 10;
var y = "eita";
var obj = { x, y };// { x: 10, y: "eita" }
let otherObj = {
foo (a, b) {
…
},
bar (x, y) {
…
},
*quux (x, y) {
…
}
};

22. ReferênciasReferências
http://es6-features.org/
https://developer.mozilla.org/bm/docs/Web/JavaScript
https://davidwalsh.name/es6-generators
http://tobyho.com/2015/12/27/promise-based-coroutines-nodejs/
https://x.st/javascript-coroutines/

23. GO BACK