Unlimited Power: ES6 Generators

Unlimited Power: ES6 Generators

For JSConf China 2015.


Brian Holt

June 20, 2015


  1. U N L I M I T E D P

    O W E R E S 6 G E N E R A T O R S B R I A N H O LT T W I T T E R : H O LT B T G I T H U B : B T H O LT
  2. E S 6 ? • ECMAScript 6. The latest version

    of JavaScript. • More correctly known as ES2015. • Includes features such as arrow functions, symbols, classes, enhanced object literal syntax, template strings, and …
  3. G E N E R AT O R S •

    Generators are a new construct to JavaScript that enables new patterns of asynchronous programming that looks synchronous. • Can greatly reduce the complexity of some problems. • Can be confusing due to their versatility in how they handle input and output
  4. C A N I U S E I T N

    O W ? • Yes! • An engineer formerly of Facebook and currently of Meteor named Benjamin Newman emulated generator behavior using ES5, giving us the opportunity to use it now! • Babel uses Regenerator under the hood to give generator support. If you’re not using Babel now, you really should. Babel is a JS preprocessor that allows you to process ES6 files into ES5 compatible files. • iojs works out of the box with no preprocessing.
  5. L O L O K , W H AT I

    S A G E N E R AT O R ? • A generator is a function that returns a generator object. This object is an iterable; that is, you can iterate over it. • Generators can generate output, process input, or both; however I would suggest where possible to either process input or generate output. It simplifies things a lot. • Let’s look at a few examples.
  6. None
  7. None
  8. O K AY, B I G D E A L

    . N O W S H O W M E S O M E T H I N G C O O L • co is the name of a library put out by TJ Holowaychuk (same guy as Stylus, Mocha, Express, Koa, and half the other things you use.) • co allows you to simulate ES7’s async/await functionality today using generators. async/await is going to change the way we do a lot of things with JavaScript.
  9. None
  10. None
  11. Y I E L D * • I heard you

    like generators so now you can call generator functions from your generator functions. • yield* is a keyword that calls another generator and adds all its content to the current generator.
  12. None
  13. G E N E R AT O R S A

    S O B S E R V E R S • Think of a function you can call a bunch of times with different parameters and preserve the state between calls. • Can be done other ways but a large point of generators to simplify code and make it look more synchronous despite being asynchronous.
  14. None
  15. L O L O K , N O W D

    O S O M E T H I N G C O O L • Ideal for situations where you can receive input multiple times at asynchronous intervals. • Conducive to reactive (ie RxJS, Bacon, etc) programming. • Awesome for WebSockets / polling
  16. None
  17. G E N E R AT O R S A

    S C O - R O U T I N E S • As I was saying earlier, I prefer to take generators and compose them into either data producing or data consuming, not both. • Seeing a generator both produce and consume takes the advantage of generators away for me: simplifying asynchronous code.
  18. . T H R O W ( ) , .

    R E T U R N ( ) , T RY, C AT C H , A N D F I N A L LY • Calling `.return()` (instead of `.next()`) executes a return at where ever your generator is paused. This can be useful if you need to terminate your generator. • Calling `.throw()` is similar: it throws an error there and allows you to deal with it using a `catch` statement. • `finally` statements are interesting because if you `.return()` you can clean up your generator by putting code into a finally block. • `.return()` doesn’t work out-of-the-box with iojs.
  19. None
  20. B U T WA I T ! I WA S

    N ’ T D O N E !
  21. None
  22. T H R O W W O R K S

    A B O U T T H E S A M E B U T W I L L J U S T H I T T H E ` C AT C H ` B L O C K I N S T E A D
  23. None
  24. T L ; D R • Generators make async easy

    by making your async code look synchronous. • Generators can accept input, give output, or both. • Generators can be used to model things like observables, iterables, csp, lazily evaluated infinite arrays, and much more fun stuff. • Use generators. They give you power.
  25. B R I A N H O LT T W

    I T T E R : H O LT B T G I T H U B : B T H O LT G I T H U B . C O M / B T H O LT / G E N E R AT O R - E X A M P L E S U N L I M I T E D P O W E R : E S 6 G E N E R AT O R S