Intro to ES6 / ES2015
1 like565 views
The document is an introduction to ES6/2015 presentation that covers new features in the ECMAScript specification including let and const, template strings, arrow functions, classes, iterators, promises, and generators. It provides a brief history of JavaScript and explains what ES6 is and why developers should use it. The presentation does not cover all new features in ES6 and notes some are not fully supported in current JavaScript engines.
Intro to ES6 / ES2015
- 1. INTRO TO ES6/2015 MEAN STACK NYC | INTRO TO ES6/2015 Jamal O’Garro Software Engineer + Instructor
- 2. WHAT’S BEING COVERED TODAY • Let and Const • Block Scoping • Template Strings • Iterators • Fat Arrow Syntax • Class Syntax • Promises • Generators MEAN STACK NYC | INTRO TO ES6/2015
- 3. BRIEF HISTORY OF JAVASCRIPT • Created by Netscape as a browser scripting language • Node.js allows JS to be run on the server • ES6 standard is announced MEAN STACK NYC | INTRO TO ES6/2015
- 4. WHAT IS ECMASCRIPT? • Specification that JavaScript is developed against MEAN STACK NYC | INTRO TO ES6/2015
- 5. WHAT IS ES6? • Most recent version of the ECMAScript specification • Introduces powerful new features and new syntax • Is available for use now in most modern browsers MEAN STACK NYC | INTRO TO ES6/2015
- 6. WHY USE ES6? • Allows us to write “safer” JavaScript • Get to use a “nicer” syntax • It’s the future and the future is now! MEAN STACK NYC | INTRO TO ES6/2015
- 7. NEW LANGUAGE FEATURES MEAN STACK NYC | INTRO TO ES6/2015
- 8. LET + CONST MEAN STACK NYC | INTRO TO ES6/2015
- 9. LET + CONST RECAP • “let” and “const” allow us to have block scoping • “const” allows us to create immutable data • We also have the ability to create blocks on-the-fly MEAN STACK NYC | INTRO TO ES6/2015
- 10. TEMPLATE STRINGS MEAN STACK NYC | INTRO TO ES6/2015
- 11. TEMPLATE STRINGS RECAP • Allow us to perform string interpolation in JavaScript • Prevents us from having to concat strings • Get a performance boost over string concatenation MEAN STACK NYC | INTRO TO ES6/2015
- 12. FAT ARROW FUNCTIONS MEAN STACK NYC | INTRO TO ES6/2015
- 13. FAT ARROW RECAP • Provide a new syntax to represent lambda functions • Give us a lexical “this” in functions that aren’t direct properties of objects MEAN STACK NYC | INTRO TO ES6/2015
- 14. NEW OBJECT SYNTAX MEAN STACK NYC | INTRO TO ES6/2015
- 15. NEW OBJECT SYNTAX RECAP • Syntactic sugar for creating properties of objects MEAN STACK NYC | INTRO TO ES6/2015
- 16. CLASSES MEAN STACK NYC | INTRO TO ES6/2015
- 17. CLASSES RECAP • Syntax “sugar” for constructor functions • Easy inheritance • Super keyword • Clean way to create static methods MEAN STACK NYC | INTRO TO ES6/2015
- 18. NEW DATA TYPES MEAN STACK NYC | INTRO TO ES6/2015
- 19. ITERATORS MEAN STACK NYC | INTRO TO ES6/2015
- 20. ITERATOR VS. ITERABLE • Iterator - allows us to produce a sequence of values (Generators, etc.) • Iterable - Means an object can be iterated (String, Array, Map, Set, etc.) MEAN STACK NYC | INTRO TO ES6/2015
- 21. PROMISES MEAN STACK NYC | INTRO TO ES6/2015
- 22. PROMISE RECAP • Allow us to work with Promises natively in the language MEAN STACK NYC | INTRO TO ES6/2015
- 23. GENERATORS MEAN STACK NYC | INTRO TO ES6/2015
- 24. WHY ARE GENERATORS USEFUL? • Allow us to pause a function • Control of the function’s execution externally • Can pass data to the paused execution • Can be used for asynchronous coding that “looks” synchronous MEAN STACK NYC | INTRO TO ES6/2015
- 25. SUMMARY MEAN STACK NYC | INTRO TO ES6/2015
- 26. WHAT DID WE NOT COVER TODAY? • Symbols • Maps • Weak Maps • Sets • Weak Sets • Some features that are not ready (at least not in V8 and Node) MEAN STACK NYC | INTRO TO ES6/2015
- 27. WHAT’S CURRENTLY NOT AVAILABLE? • Destructured assignment • Parameter Default Values • Rest • Spread • Modules • Proxies • Typed Array MEAN STACK NYC | INTRO TO ES6/2015
- 28. HOW TO USE WHAT’S NOT READY? • Polyfills • Transpilers • Babel.js • Tracuer • TypeScript MEAN STACK NYC | INTRO TO ES6/2015
- 29. THANK YOU!!! Jamal O’Garro Software Engineer + Instructor MEAN STACK NYC | INTRO TO ES6/2015