Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
From ES6 to Javascript 2.0 
What use today ? 
Jonathan Rivalan
From ES6 to Javascript 2.0 
● Introduction / a brief history 
→ What is the difference between EcmaScript and JS ? 
● Meth...
From ES6 to Javascript 2.0 
● Introduction / a brief history 
→ EcmaScript creation in 1996 
→ ES5 standard submission in ...
From ES6 to Javascript 2.0 
● Methods compatibility 
→ a rich version with more than 100 new features 
_ http://kangax.git...
From ES6 to Javascript 2.0 
● Use case : promises 
→ ES6 star feature, allows the rigging of 
asynchronous scenarios 
→ a ...
From ES6 to Javascript 2.0 
● Use case : promises, .then 
● Cas d'usage : les promises 
function asyncFunction () { 
funct...
From ES6 to Javascript 2.0 
● Use case : promises, .catch 
function asyncFunction () { 
function asyncFunction () { 
retur...
From ES6 to Javascript 2.0 
- then 
- catch 
- then 
- catch 
OWF 2014 – 31 Octobre 2014 8
From ES6 to Javascript 2.0 
● Use case : promises, .race 
● Cas d'usage : les promises 
function asyncFunction () { 
funct...
From ES6 to Javascript 2.0 
● Use case : promises, .all 
● Cas d'usage : les promises 
var p = new Promise(function(resolv...
From ES6 to Javascript 2.0 
● Use case : promises 
→ standard exploration : 
_https://promisesaplus.com/ 
→ strong polyfil...
From ES6 to Javascript 2.0 
● Next ? 
Numerous interesting features regarding classes, 
generators, modules… and so on ! 
...
From ES6 to Javascript 2.0 
Jonathan Rivalan 
> jonathan.rivalan@alterway.fr 
> jonathan.rivalan@gmail.com 
OWF 2014 – 31 ...
Upcoming SlideShare
Loading in …5
×

Open World Forum 2014 : From ES6 to Javascript 2.0. What use today ? par Jonathan Rivalan

1,150 views

Published on

Ecma script 6 - Javascript 2.0 : Promises, générateurs, variables locales, découvrez comment l'ECMA SCript 6 va transformer vos applicatifs *.js.

Vous n'avez jamais entendu parler d'"Harmony" ni d'"Es.next" et vous êtes développeur web ? Fatigué des fonctions callbacks, vous envisagez de passer vos requêtes ajax en synchrone ? Il est temps de vous intéresser à l'ECMA Script 6. Partiellement implémenté, le futur standard Javascript 2.0 fournit son lot de nouveautés (Promises, générateurs, variables scopables) et autres subtilités programmatoires pour le plus grand plaisir de vos SPA.

Cette conférence se propose dans un premier temps de parcourir les différents aspects de la spécification puis, dans un second, de s'attarder à travers le développement de modules sur les points clés du standard Javascript 2.0. Elle a pour objectifs :

d'éclairer les auditeurs sur les caractéristiques de l'ECMA Script 6
l'approfondissement des aspects phares (promise et un autre sujet en fonction de l'état d'implémentation lors de l'atelier)
de mesurer leur implémentation navigateur à date et explorer les polyfills

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Open World Forum 2014 : From ES6 to Javascript 2.0. What use today ? par Jonathan Rivalan

  1. 1. From ES6 to Javascript 2.0 What use today ? Jonathan Rivalan
  2. 2. From ES6 to Javascript 2.0 ● Introduction / a brief history → What is the difference between EcmaScript and JS ? ● Methods compatibility → What is the global browser support ? ● Use Cases - promises ● Next OWF 2014 – 31 Octobre 2014 2
  3. 3. From ES6 to Javascript 2.0 ● Introduction / a brief history → EcmaScript creation in 1996 → ES5 standard submission in 2009 ● What is the difference between EcmaScript and Javascript ? → EcmaScript is the language when Javascript, jscript and as3 are dialects of it → today mostly none, except for the browser support OWF 2014 – 31 Octobre 2014 3
  4. 4. From ES6 to Javascript 2.0 ● Methods compatibility → a rich version with more than 100 new features _ http://kangax.github.io/compat-table/es6/ → currently limited support with a bit less than 50 features, mostly oriented around the number, math objects and collections (~30 features) → mostly no support on IE11- and Opera last version → various and numerous ES5 polyfills _http://addyosmani.com/blog/ecmascript-6-resources-for-the-curious-javascripter/ OWF 2014 – 31 Octobre 2014 4
  5. 5. From ES6 to Javascript 2.0 ● Use case : promises → ES6 star feature, allows the rigging of asynchronous scenarios → a promise represents the maybe result of an asynchronous operation, usable through the .then method, which will return the value of the resolved promise, or the reason in a revoked case. Promises = linear programming + readability OWF 2014 – 31 Octobre 2014 5
  6. 6. From ES6 to Javascript 2.0 ● Use case : promises, .then ● Cas d'usage : les promises function asyncFunction () { function asyncFunction () { return new Promise(function(resolve,reject) { return new Promise(function(resolve,reject) { /*asynchronous actions*/ resolve(successObj) //WIN reject(errorMsg) //FAIL /*asynchronous actions*/ resolve(successObj) //WIN reject(errorMsg) //FAIL }) }) } var successHandler = function(successObj){ } var successHandler = function(successObj){ console.log("I launch if won !"); console.log("I launch if won !"); } var errorHandler = function(errorMsg){ } var errorHandler = function(errorMsg){ console.log("I launch if failed !"); console.log("I launch if failed !"); } asyncFunction.then(successHandler,errorHandler); } asyncFunction.then(successHandler,errorHandler); OWF 2014 – 31 Octobre 2014 6
  7. 7. From ES6 to Javascript 2.0 ● Use case : promises, .catch function asyncFunction () { function asyncFunction () { return new Promise(function(resolve,reject) { return new Promise(function(resolve,reject) { /*asynchronous actions*/ resolve(successObj) //WIN reject(errorMsg) //FAIL /*asynchronous actions*/ resolve(successObj) //WIN reject(errorMsg) //FAIL ● Cas d'usage : les promises }) }) } var successHandler = function(successObj){ } var successHandler = function(successObj){ /*stuff*/ /*stuff*/ } var errorHandler = function(errorMsg){ } var errorHandler = function(errorMsg){ /*stuff*/ /*stuff*/ } var correctError = function(obj){ } var correctError = function(obj){ /*recovery try*/ return obj ; /*recovery try*/ return obj ; } asyncFunction.then(successHandler) .catch(correctError) .then(successHandler) .catch(errorHandler); } asyncFunction.then(successHandler) .catch(correctError) .then(successHandler) .catch(errorHandler); OWF 2014 – 31 Octobre 2014 7
  8. 8. From ES6 to Javascript 2.0 - then - catch - then - catch OWF 2014 – 31 Octobre 2014 8
  9. 9. From ES6 to Javascript 2.0 ● Use case : promises, .race ● Cas d'usage : les promises function asyncFunction () { function asyncFunction () { return new Promise(function(resolve,reject) { return new Promise(function(resolve,reject) { /*asynchronous actions*/ resolve(successObj) //WIN reject(errorMsg) //FAIL /*asynchronous actions*/ resolve(successObj) //WIN reject(errorMsg) //FAIL }) }) } var PromiseA = asyncFunction(someParams); var PromiseB = asyncFunction(otherParams); Promise.race([PromiseA, PromiseB]) .then(function(obj){console.log(obj+'was served first!')}); } var PromiseA = asyncFunction(someParams); var PromiseB = asyncFunction(otherParams); Promise.race([PromiseA, PromiseB]) .then(function(obj){console.log(obj+'was served first!')}); OWF 2014 – 31 Octobre 2014 9
  10. 10. From ES6 to Javascript 2.0 ● Use case : promises, .all ● Cas d'usage : les promises var p = new Promise(function(resolve, reject) { resolve(3); }); Promise.all([true, p]).then(function(values) { // values == [ true, 3 ] }); var p = new Promise(function(resolve, reject) { resolve(3); }); Promise.all([true, p]).then(function(values) { // values == [ true, 3 ] }); OWF 2014 – 31 Octobre 2014 10
  11. 11. From ES6 to Javascript 2.0 ● Use case : promises → standard exploration : _https://promisesaplus.com/ → strong polyfill : _https://github.com/tildeio/rsvp.js/ OWF 2014 – 31 Octobre 2014 11
  12. 12. From ES6 to Javascript 2.0 ● Next ? Numerous interesting features regarding classes, generators, modules… and so on ! To go further : → have a peek at the standard _http://www.ecma-international.org/ → full es6 nowadays features review _http://code.tutsplus.com/articles/use-ecmascript-6-today--net-31582 OWF 2014 – 31 Octobre 2014 12
  13. 13. From ES6 to Javascript 2.0 Jonathan Rivalan > jonathan.rivalan@alterway.fr > jonathan.rivalan@gmail.com OWF 2014 – 31 Octobre 2014 13

×