Add some ES2018 examples to the cheatsheets (#889)
* Add some ES2018 examples to the cheatsheets * Add examples of string methods: padStart, padEnd * Add examples of extracting Object values
This commit is contained in:
parent
75740e2658
commit
117e9905d8
|
@ -0,0 +1,5 @@
|
||||||
|
---
|
||||||
|
title: ES2018
|
||||||
|
category: JavaScript
|
||||||
|
redirect_to: /es6
|
||||||
|
---
|
45
es6.md
45
es6.md
|
@ -6,7 +6,7 @@ tags: [Featured]
|
||||||
updated: 2017-10-21
|
updated: 2017-10-21
|
||||||
weight: -10
|
weight: -10
|
||||||
intro: |
|
intro: |
|
||||||
A quick overview of new JavaScript features in ES2015, ES2016, ES2017 and beyond.
|
A quick overview of new JavaScript features in ES2015, ES2016, ES2017, ES2018 and beyond.
|
||||||
---
|
---
|
||||||
|
|
||||||
### Block scoping
|
### Block scoping
|
||||||
|
@ -69,6 +69,9 @@ See: [Binary and octal literals](https://babeljs.io/learn-es2015/#binary-and-oct
|
||||||
"hello".repeat(3)
|
"hello".repeat(3)
|
||||||
"hello".includes("ll")
|
"hello".includes("ll")
|
||||||
"hello".startsWith("he")
|
"hello".startsWith("he")
|
||||||
|
"hello".padStart(8) // " hello"
|
||||||
|
"hello".padEnd(8) // "hello "
|
||||||
|
"hello".padEnd(8, '!') // hello!!!
|
||||||
"\u1E9B\u0323".normalize("NFC")
|
"\u1E9B\u0323".normalize("NFC")
|
||||||
```
|
```
|
||||||
|
|
||||||
|
@ -154,6 +157,20 @@ promise
|
||||||
```
|
```
|
||||||
{: data-line="2,3"}
|
{: data-line="2,3"}
|
||||||
|
|
||||||
|
|
||||||
|
### Using promises with finally
|
||||||
|
|
||||||
|
```js
|
||||||
|
promise
|
||||||
|
.then((result) => { ··· })
|
||||||
|
.catch((error) => { ··· })
|
||||||
|
.finally(() => { // logic independent of success/error })
|
||||||
|
```
|
||||||
|
{: data-line="4"}
|
||||||
|
|
||||||
|
The handler is called when the promise is fulfilled or rejected.
|
||||||
|
|
||||||
|
|
||||||
### Promise functions
|
### Promise functions
|
||||||
|
|
||||||
```js
|
```js
|
||||||
|
@ -273,6 +290,17 @@ for (let {title, artist} of songs) {
|
||||||
|
|
||||||
The assignment expressions work in loops, too.
|
The assignment expressions work in loops, too.
|
||||||
|
|
||||||
|
|
||||||
|
### Object destructuring
|
||||||
|
|
||||||
|
```js
|
||||||
|
const { id, ...detail } = song;
|
||||||
|
```
|
||||||
|
{: data-line="1"}
|
||||||
|
|
||||||
|
Extract some individually and others objects in the group using "rest (...) operator"
|
||||||
|
|
||||||
|
|
||||||
Spread
|
Spread
|
||||||
------
|
------
|
||||||
|
|
||||||
|
@ -450,6 +478,21 @@ let handlers = {
|
||||||
|
|
||||||
See: [Object literal enhancements](https://babeljs.io/learn-es2015/#enhanced-object-literals)
|
See: [Object literal enhancements](https://babeljs.io/learn-es2015/#enhanced-object-literals)
|
||||||
|
|
||||||
|
|
||||||
|
### Extract values
|
||||||
|
|
||||||
|
```js
|
||||||
|
const fatherJS = { age: 57, name: "Brendan Eich" }
|
||||||
|
|
||||||
|
Object.values(fatherJS)
|
||||||
|
// [57, "Brendan Eich"]
|
||||||
|
Object.entries(fatherJS)
|
||||||
|
// [["age", 57], ["name", "Brendan Eich"]]
|
||||||
|
```
|
||||||
|
|
||||||
|
{: data-line="3,5"}
|
||||||
|
|
||||||
|
|
||||||
Modules
|
Modules
|
||||||
-------
|
-------
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue