CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements...
Transcript of CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements...
![Page 1: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/1.jpg)
SPRING 2019CS 498RK
ES6
new features for JavaScript
![Page 2: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/2.jpg)
WHAT IS ES6?
ES (ECMAScript) is a scripting language standard.
JavaScript implements ECMAScript.
ES6 means the 6th Edition of ECMAScript.
![Page 3: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/3.jpg)
Timeline
2019
1998: ES2 2000: ES4 (Abandoned)
1997: ES1 1999: ES3
Started in 1997, yearly updates up to 2000
![Page 4: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/4.jpg)
Timeline
2019
1998: ES2 2000: ES4 (Abandoned)
1997: ES1 1999: ES3 2009: ES5
10 years later, ES5. Not much new stuff.
![Page 5: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/5.jpg)
Timeline
2019
1998: ES2 2000: ES4 (Abandoned)
2015: ES6
1997: ES1 1999: ES3 2009: ES5
6 years later, ES6! Plethora of new features!
![Page 6: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/6.jpg)
Timeline
2019
1998: ES2 2000: ES4 (Abandoned)
2015: ES6 2017: ES8
1997: ES1 1999: ES3 2009: ES5 2016: ES7 2018: ES9
Yearly updates since ES6.
![Page 7: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/7.jpg)
New, Exciting Features Every Year!
![Page 8: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/8.jpg)
ES6 FEATURESLet & Const
Arrow Functions
Default Parameters
Template Literals
Destructuring
Rest & Spread
New Array Methods
Classes
Modules
and more!
![Page 9: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/9.jpg)
LET
before after
![Page 10: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/10.jpg)
CONST
before after
![Page 11: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/11.jpg)
ARROW FUNCTIONS
before
after
![Page 12: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/12.jpg)
ARROW FUNCTIONSbefore
after
![Page 13: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/13.jpg)
DEFAULT PARAMETERS
before after
![Page 14: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/14.jpg)
TEMPLATE LITERALS
before
after
![Page 15: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/15.jpg)
TEMPLATE LITERALS
before after
![Page 16: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/16.jpg)
DESTRUCTURING
![Page 17: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/17.jpg)
REST
accessing the "rest" of the arguments
![Page 18: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/18.jpg)
SPREAD
before after
![Page 19: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/19.jpg)
SPREAD
copying an array
![Page 20: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/20.jpg)
NEW ARRAY METHODS
and more…
![Page 21: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/21.jpg)
CLASSES
before after
![Page 22: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/22.jpg)
CLASSES
before
after
![Page 23: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/23.jpg)
MODULESbefore after
![Page 24: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/24.jpg)
MODULES
before after
![Page 25: CS 498RK SPRING 2019 - GitHub Pages › sp19 › slides › es6_06.pdf · JavaScript implements ECMAScript. ES6 means the 6th Edition of ECMAScript. Timeline 2019 1998: ES2 2000:](https://reader030.fdocuments.in/reader030/viewer/2022040411/5ed792d867b53e06555d28d6/html5/thumbnails/25.jpg)
RESOURCES
http://exploringjs.com/es6/
https://github.com/lukehoban/es6features
http://es6-features.org