ES3 — 1999
ES5 — 2009
ES6 — 2014 2015
ES3 - RegExp + try/catch
ES5 - Array Methods + strict mode
ES6 feature frozen aug 2014
Hva består ES6 av?
Block scoped vars
Array comprehensions
Template strings
Lambda (=> functions)
Promises
Destructuring
Classes
Rest + Spread operators
Proxy
Generators
(Modules)
…
Array Comprehensions
var squared = [ for (i of [1, 2, 3]) i * i ];
// [1, 4, 9]
[ for (x of [1, 2, 3]) for (y of [4, 5, 6]) (x * y) ];
// [4, 5, 6, 8, 10, 12, 12, 15, 18]
Lambda Expressions
var people = [
{ firstName: "April", lastName: "O'Neil", human: true },
// …
];
// Før
people.filter(function(p) {
return p.human;
});
// Nå
people.filter( p => p.human );
Lambda Expressions II
people.map((p) => {
return { fullName: p.firstName + p.lastName };
});
Destructuring
var [a, [b], c, d] = ['Hello', [', ', 'junk'], ['JavaZone!']];
console.log(a + b + c);
// Hello, JavaZone!
Nytting for bytting av to var,
flere returverdier fra en funksjon
Destructuring II
var people = [
{ firstName: "April", lastName: "O'Neil", human: true },
// …
];
people.map(({ firstName, lastName }) => {
return { fullName: firstName + lastName }
});
Destructuring III
function foo(requiredParam, { option1, option2 = 'bar' }) {
console.log(requiredParam, option1, option2);
};
foo(1, { option1: 'baz' });
foo(2, { option1: 'baz', option2: 'qux' });
Rest Parameters
function withFirstNames(data, ...firstNames) {
return data.filter(p => {
return firstNames.indexOf(p.firstName) > -1;
});
}
withFirstNames(people, 'April', 'Raphael');
Erstatter bruk av arguments objektet
Spread
var toBeAdded = [
{ firstName: 'Donatello' },
{ firstName: 'Raphael' }
];
people.push(...toBeAdded);
Erstatter Function.prototype.apply
Generators (iterators)
function* fibonacci() {
var [ prev, curr ] = [ 0, 1 ];
while (true) {
yield curr;
[ prev, curr ] = [ curr, prev + curr ];
}
}
var fib = fibonacci();
fib.next(); // { value: 1, done: false }
fib.next(); // { value: 1, done: false }
fib.next(); // { value: 2, done: false }
// …
Generators + Promises = task.js
spawn(function*() {
var data = yield $.ajax(url);
$('#result').html(data);
var status = $('#status').text('Download complete.');
yield status.fadeIn().promise();
yield sleep(2000);
status.fadeOut();
});
www.taskjs.org