A quick overview of the decorator proposal for JavaScript,

1. @decorators
Ben McCormick
Windsor Circle
Twitter: @ben336
Blog: http://benmccormick.org

2. Classes in JavaScript
(History)
• Prototypical inheritance
• Variety of approaches

4. Lots of MVC Libraries
Use Classes
• Backbone
• React
• Ember
• Angular

5. Backbone
React
Ember

6. ES6 Classes
• Standard clean syntax
• Fundamentally the same thing as
older inheritance models
• Browser support coming! (but use
Babel for now)

8. Problems with ES6
Classes
• You lose the flexibility of previous
approach
• No properties, just methods
• Strict patterns for child classes

11. So how does this get better?

12. Proposed JavaScript
Decorators

13. Decorators
• Allow customization of classes and
functions at class creation
• Restore flexibility and
expressiveness to class syntax
• Similar to python decorators

14. Class Level Decorators

15. Method Decorators

16. Decorators are
• Just functions
• Take a class or method and act on it
at creation time
• Declarative! No messy code

17. Decorators Allow For
• Cleaner interfaces
• Class properties
• Mixins

18. Cleaner Interface For
Backbone

19. …

20. https://github.com/benmccormick/backbone-decorators/
`on` decorator from

21. Current Status
• Proposed for inclusion in ES2016
(ES7)
• Already available in TypeScript
• Usable with Babel (experimental flag)
• Key part of Angular 2 and Aurelia
• Plans for using them for Ember/React

22. Angular2
Aurelia

23. Next
• ES2016 will get a draft by ~January
• Released next June (possibly with
decorators)

24. More info
• https://github.com/wycats/
javascript-decorators
• https://babeljs.io/docs/usage/
experimental/

25. Ben McCormick
Windsor Circle
Twitter: @ben336
Blog: http://benmccormick.org