理解 ES6+(Understanding ECMAScript 6+)

es7(2016)

Observalbe

https://derickbailey.com/2017/06/06/3-features-of-es7-and-beyond-that-you-should-be-using-now/

es8(2017)

Obect.values()

Object.entries()

String.padding

Object.getOwnPropertyDescriptors()

SharedArrayBuffer

Atomics 对象

Atomics.add()

Atomics.and()

Atomics.compareExchange()

Atomics.exchange()

Atomics.load()

Atomics.or()

Atomics.store()

Atomics.sub()

Atomics.xor()

Atomics.wait()

Atomics.wake()

Atomics.isLockFree(size)

es9(2018)

for await (let i of array) 异步迭代

Promise.finally()

Rest/Spread

正则

命名捕获组

反向断言

dotAll 模式

Unicode 转义

非转义序列的模板字符串

es10(2019)

Array

Array.prototype.flat

Array.prototype.flatMap

globalThis

当前环境下的全局对象。

浏览器:

img

Node.js:

img

Promise

Promise.allSettled(promises)

Promise.all() 所有的都 resolved 了结果才是 resolved,否则就 rejected。

Promise.race() 只要有一个 resolved 了结果就是 resolved。

但是并没有一个接口可以表示状态都 settled 的(而不用关心他们其中谁 resolved 或
rejected 了)。

现在 Promise.allSettled(promise) 就是干这个用的,只要所有的 promise 状态都
settled 了就 resolved 否则 rejected。

环境话说,所有任务一旦开始了,我关心是不是都被正确完成了,只要状态结束了那就OK了。

1
2
3
4
Promise.allSettled([
Promise.resolve('first resolved'),
Promise.reject('second resolved')
]).then((msg) => console.log(msg, 'allSettled resolved'))

结果:

img

Promise.allSettled 一定会 resolved 因为它不关心数组里面的 promises 是否是
resolved。只要两个状态完成了就会 resolved。

输出显示,传递给 then.resolve 参数 msg 其实是包含所有 promsies 执行的结果对象。

status : 表示 promise 是 fulfilled 还是 rejected。

value: 是 promise resolved 的结果值。

reason: 是 promise resolved 的原因。

Promise.any(promises)

只要有一个 promise 状态 settled 了就OK。

Symbol

Symbol.prototype.description

Object

Object.fromEntries -> Object.entries

String

String.prototype.trimStart

String.prototype.trimEnd

String.prototype.matchAll(regex)

循环匹配出字符串中的所有匹配的结果。

之前的方式:

1
2
3
while (matchAll = regex.exec(string)) {
console.log(matchAll)
}

使用 string.matchAll(regex) 直接就能匹配出结果:

img

Integer

BigInt

Module

import() 动态引入

支持模块化脚本: <script type="module"></script>

1
2
3
4
5
6
<script type="module">
import * as module from './modules/utils.js';

module.default();
module.doStuff();
</script>

动态加载模块:

1
2
3
4
5
6
7
8
<script>
// 动态导入方式 import()
import('./modules/utils.js')
.then(module => {
module.default('dynamic');
module.doStuff('dynamic');
})
</script>

异步动态加载模块:

1
2
3
4
5
6
7
8
<script>
// 异步动态导入
(async () => {
const module = await import('./modules/utils.js');
module.default('async...await');
module.doStuff('async...awai');
})()
</script>

Function

Function.prototype.toString 返回精确字符,包含空格和注释

try…catch

try {} catch(e) {} 现在可以简写成 try {} catch {} ,不需要 e 的时候将其
省略。

本文标题:理解 ES6+(Understanding ECMAScript 6+)

文章作者:ZhiCheng Lee

发布时间:2019年10月20日 - 22:29:20

最后更新:2019年11月27日 - 10:08:25

原始链接:http://blog.gcl666.com/2019/10/20/understanding-es6+/

许可协议: 署名-非商业性使用-禁止演绎 4.0 国际 转载请保留原文链接及作者。

0%