The Amazing ES6

The Amazing ES6

The next-generation of javascript also known as ECMAScript 6 (also called ES6 or Harmony), is bringing us lots of amazing features that you probably will need to know. This talks shows how apply this features in your daily basis.

Slides strongly based in this talk: https://speakerdeck.com/pazguille/es6-in-production

Ed35943d3199ea37b1b60c39615e8163?s=128

Raphael Amorim

July 25, 2015
Tweet

Transcript

  1. The Amazing ES6 ‘Cause the future straight ahead is beautiful

  2. RAPHAEL AMORIM as raphamorim

  3. ES6 Today

  4. Why?

  5. None
  6. The Code

  7. Even better: Still JavaScript

  8. #ES6 Modules

  9. AMD define(‘Slideout’, // Deps [‘inherit’,’Emitter’], // Slideout function (inherit, Emitter)

    {
 function Slideout (options) {…} // Export return Slideout;
 });
  10. CommonJS // Deps var inherit = require(‘inherit’); var Emitter =

    require(‘emitter’); // Slideout
 function Slideout (options) {…} // Export module.exports = Slideout;
  11. ES6 // Deps import inherit from ‘inherit’; import Emitter from

    ‘emitter’; // Slideout
 function Slideout (options) {…} // Export export default Slideout;
  12. #ES6 Classes

  13. ES5 // Slideout
 function Slideout (options) {…} // Inherit from

    Emitter inherit(Slideout, Emitter); // Extend prototype Slideout.prototype.open = function() { … };
  14. ES6 // Slideout
 class Slideout extends Emitter { constructor(options={}) {

    … } open() { … } …
  15. #ES6 let/const

  16. #ES6 Arrows

  17. #ES6 Destructuring Assignment

  18. #ES6 Default Parameters

  19. #ES6 is much more

  20. How?

  21. ES6 to ES5

  22. v5.8.3

  23. None
  24. Hey, show me this (ES6 FIX: let)

  25. raphamorim/ amazing-es6

  26. lukehoban/ es6features

  27. tc39/ test262

  28. Always remember: ES6 exists to help you code better

  29. Thanks and till next time <3