You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+22Lines changed: 22 additions & 0 deletions
Original file line number
Diff line number
Diff line change
@@ -58,6 +58,8 @@ This change in behavior highlights that we need to be careful when refactoring l
58
58
59
59
> **Best Practice**: Leave **var** declarations inside of legacy code to denote that it needs to be carefully refactored. When working on a new codebase, use **let** for variables that will change their value over time, and **const** for variables that will be immutable over time.
60
60
61
+
<sup>[(back to table of contents)](#table-of-contents)</sup>
62
+
61
63
## Replacing IIFEs with Blocks
62
64
63
65
> A common use of **Immediately Invoked Function Expressions** is to enclose values within its scope. In ES6, we now have the ability to create block-based scopes and therefore are not limited purely to function-based scope.
@@ -78,6 +80,8 @@ Using ES6 Blocks:
78
80
console.log(food); // Reference Error
79
81
```
80
82
83
+
<sup>[(back to table of contents)](#table-of-contents)</sup>
84
+
81
85
## Arrow Functions
82
86
83
87
Often times we have nested functions in which we would like to preserve the context of **this** from it's lexical scope. An example is shown below:
@@ -136,6 +140,8 @@ const squares = arr.map(x => x * x); // Arrow Function for terser implementation
136
140
137
141
> **Best Practice**: Use **Arrow Functions** in place of function expressions when possible.
138
142
143
+
<sup>[(back to table of contents)](#table-of-contents)</sup>
144
+
139
145
## Strings
140
146
141
147
With ES6, the standard library has grown immensely. Along with these changes are new methods which can be used on strings, such as **.includes()** and **.repeat()**.
@@ -240,6 +246,8 @@ let today = new Date()
240
246
let text =`The time and date is ${today.toLocaleString()}`
241
247
```
242
248
249
+
<sup>[(back to table of contents)](#table-of-contents)</sup>
250
+
243
251
## Destructuring
244
252
245
253
Destructuring allows us to extract values from arrays and objects (even deeply nested) and store them in variables with a more convient syntax.
<sup>[(back to table of contents)](#table-of-contents)</sup>
287
+
278
288
## Modules
279
289
280
290
Prior to ES6, we used libraries such as [Browserify](http://browserify.org/) to create modules on the client-side, and [require](https://nodejs.org/api/modules.html#modules_module_require_id) in **Node.js**. With ES6, we can now directly use modules of all types (AMD and CommonJS).
@@ -377,6 +387,8 @@ import * as util from 'math/addition'
377
387
378
388
> **Note**: Values that are exported are **bindings**, not references. Therefore, changing the binding of a variable in one module will affect the value within the exported module. Avoid changing the public interface of these exported values.
379
389
390
+
<sup>[(back to table of contents)](#table-of-contents)</sup>
391
+
380
392
## Parameters
381
393
382
394
In ES5, we had varying ways to handle functions which needed **default values**, **indefinite arguments**, and **named parameters**. With ES6, we can accomplish all of this and more using more concise syntax.
@@ -466,6 +478,8 @@ We can use the spread operator to pass an array of values to be used as paramete
466
478
Math.max(...[-1, 100, 9001, -32]) // 9001
467
479
```
468
480
481
+
<sup>[(back to table of contents)](#table-of-contents)</sup>
482
+
469
483
## Classes
470
484
471
485
Prior to ES6, we implemented Classes by creating a constructor function and adding properties by extending the prototype:
@@ -534,6 +548,8 @@ class Personal extends Person {
534
548
535
549
> **Best Practice**: While the syntax for creating classes in ES6 obscure how implementation and prototypes work under the hood, it is a good feature for beginners and allows us to write cleaner code.
536
550
551
+
<sup>[(back to table of contents)](#table-of-contents)</sup>
552
+
537
553
## Symbols
538
554
539
555
Symbols have existed prior to ES6, but now we have a public interface to using them directly. One such example is to create unique property keys which will never collide:
0 commit comments