What's Coming After ES6

Slide 1

Slide 1 text

W H AT ’ S C O M I N G A F T E R E S 6 B R I A N H O LT – @ H O LT B T – N E T F L I X

Slide 2

Slide 2 text

No content

Slide 3

Slide 3 text

No content

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

H O W D O E S J AVA S C R I P T E V O LV E ? • TC39 – Technical Committee 39 • The committee who meets to standardize ECMAScript • ECMA-262 • The actual document that defines what’s in the ECMAScript language • Ecma – formerly European Manufacturer Association, now just Ecma • A group who oversees the standardization of many things, not just JS

Slide 7

Slide 7 text

H O W D O E S J AVA S C R I P T E V O LV E ? • ECMAScript • JavaScript is an implementation of ES. They’re could be other implementations; they’re just aren’t any of note. • ES3, ES5, ES6/ES2015, ES2016, ES2017, etc. • Major revisions of the language. With ES6/ES2015 we changed to a yearly release cycle. • We skipped ES4 for many reasons but chiefly lack of consensus. • Features are now added in stages.

Slide 8

Slide 8 text

E S 3 • Regex • String methods • Try / catch

Slide 9

Slide 9 text

E S 5 • JSON • Getters / setters • Strict mode • Reflection

Slide 10

Slide 10 text

E S 4 ? • Classes • Modules • Algebraic Data Types • Generators / Iterators • Destructuring • JSX lol (E4X) • Also the kitchen sink

Slide 11

Slide 11 text

No content

Slide 12

Slide 12 text

T H E E 4 X S TA N D A R D WA S D E P R E C AT E D B Y T H E M O Z I L L A F O U N D AT I O N I N 2 0 1 4

Slide 13

Slide 13 text

W H AT M A K E S I T I N T O J S • Enables new things you could not do before (e.g. generators) • Extremely common patterns that could interop with other features if added (e. g. promises) • Such common patterns that it makes sense to add to the language, especially if large or performance sensitive (e.g. JSON.stringify) • Everything else should be added by libraries / userland

Slide 14

Slide 14 text

S TA G E 0 • Strawman • Anyone can propose features to be added to JS • A member of TC39 must be one of the champions of the feature for it to make stage 1 • Many stage 0 proposals never make it to stage 1

Slide 15

Slide 15 text

S TA G E 1 • Proposal • High level API and example usage outlined • Not concrete yet, to be hammered out in committee and discussed how it will interact with other features • Still expected to change majorly before landing as a feature • Definitely still not a guarantee that it’s going to make it into JS

Slide 16

Slide 16 text

S TA G E 2 • Draft • Needs an draft document now, covers most use cases • The committee will start expecting this feature to land and adapt other feature accordingly • Incremental changes still expected • Expected to be a functioning Babel plugin • Far more likely now to make it into JS (still not guaranteed)

Slide 17

Slide 17 text

S TA G E 3 • Candidate • Spec must be exhaustive of every use case • Little-to-no changes expected; only those pushed by implementers (e. g. tail call recursion) • Expected to be implemented in one browser • Almost guaranteed at this point to make it in JS

Slide 18

Slide 18 text

S TA G E 4 • Finished • Test262 (the testing suite to test the spec) tests expected • Two browsers now implement it and been in the wild for a bit • No changes at this point

Slide 19

Slide 19 text

N E W V E R S I O N O F E S 2 0 X X • Every March a new version of ES20XX is cut with all the proposals that are at stage 4 • Miss the deadline? You wait until next March • From March to July only editorial changes are made • In July the spec is finalized and released

Slide 20

Slide 20 text

E S 2 0 1 7 • Object.entries / Object.values • async / await • str.padStart / str.padEnd • Object.getOwnPropertyDescriptors • Trailing commas in params • Shared memory / atomics

Slide 21

Slide 21 text

E S 2 0 1 8 • Lifting Template Literal Restriction

Slide 22

Slide 22 text

No content

Slide 23

Slide 23 text

No content

Slide 24

Slide 24 text

! P R O P O S A L S I ’ M S T O K E D A B O U T "

Slide 25

Slide 25 text

O B J E C T R E S T / S P R E A D – S TA G E 3

Slide 26

Slide 26 text

R E G E X I M P R O V E M E N T S – S TA G E 3 • Lookbehind • Named Capture Groups • Better Unicode support • Supports features like matching only Greek characters

Slide 27

Slide 27 text

D Y N A M I C M O D U L E S – S TA G E 3 • System.import() • Many of you will have seen this before due to Webpack code splitting • Semantically similar to require.ensure()

Slide 28

Slide 28 text

G L O B A L – S TA G E 3 • Instead of const globalObj = window ? window : global; you can just reference global and it will refer to window in browser and global in Node.

Slide 29

Slide 29 text

N E W A S Y N C C A PA B I L I T I E S • Async Iterator – Stage 3 • Since both the next value in the sequence and the "done" state of the data source must be known at the time that the iterator method returns, iterators are only suitable for representing synchronous data sources. • Observable – Stage 1 • Similar to iterators but instead of you pulling data of an iterator, an observable pushes data at you • Think promises with multiple returns at different times

Slide 30

Slide 30 text

A S Y N C I T E R AT O R

Slide 31

Slide 31 text

N E W C L A S S S E M A N T I C S • Public class fields – Stage 2 • Private fields – Stage 2 • Class and property decorators – Stage 2

Slide 32

Slide 32 text

C L A S S P R O P E R T I E S

Slide 33

Slide 33 text

D E C O R AT O R S

Slide 34

Slide 34 text

I N T L . S E G M E N T E R • An API to separate strings into graphemes • Surprisingly hard and computationally intensive • Examples: • Io parlo italiano • ฉันพูดภาษาไทย • #

Slide 35

Slide 35 text

G E N E R AT O R S • Generator arrow functions – Stage 1 • function.sent

Slide 36

Slide 36 text

No content

Slide 37

Slide 37 text

N U L L P R O PA G AT I O N O P E R AT O R

Slide 38

Slide 38 text

T E M P O R A L • Ever used Moment.js for dates? • Temporal would give you most of what’s commonly used built into the language!

Slide 39

Slide 39 text

No content

Slide 40

Slide 40 text

S TA G E 0 WA R N I N G : T H E R E B E D R A G O N S H E R E

Slide 41

Slide 41 text

B I N D O P E R AT O R ( U N A RY )

Slide 42

Slide 42 text

B I N D O P E R AT O R ( B I N A RY )

Slide 43

Slide 43 text

F U N C T I O N E X P R E S S I O N D E C O R AT O R S

Slide 44

Slide 44 text

PA R A M E T E R D E C O R AT O R S

Slide 45

Slide 45 text

D E A D P R O P O S A L S

Slide 46

Slide 46 text

O B J E C T. O B S E R V E

Slide 47

Slide 47 text

S I M D

Slide 48

Slide 48 text

H O W D O I H E L P ? • Use the new features, break them, abuse them • Tweet / talk about them • Follow the tc39/proposals repo on GitHub • Propose your ideas • Contribute to Babel