ES2020中Javascript10個(gè)新功能是怎樣的

這期內(nèi)容當(dāng)中小編將會(huì)給大家?guī)?lái)有關(guān)ES2020中Javascript10個(gè)新功能是怎樣的，文章內(nèi)容豐富且以專業(yè)的角度為大家分析和敘述，閱讀完這篇文章希望大家可以有所收獲。

好消息 - ES2020 新功能已經(jīng)落地！這就意味著，現(xiàn)在對(duì) ES2020 中 Javascript 的新增和改進(jìn)要有一個(gè)完整的了解。

1、BigInt

BigInt，Javascript 中最期待的新功能終于落地。它允許開(kāi)發(fā)者在 JS 中使用更大的整數(shù)進(jìn)行數(shù)據(jù)處理。之前，Javascript 中最大的整數(shù)是 pow(2, 53) - 1。但是，BigInt 不受此限制。

然而，就如你在上面看到，你需要在數(shù)字后面添加一個(gè) n。這個(gè) n 說(shuō)明這是一個(gè) BigInt，Javascript 引擎應(yīng)該特殊處理（不管是 V8，還是其它引擎）。因?yàn)閭鹘y(tǒng)的數(shù)字系統(tǒng)是 IEEE754（它不支持這種大數(shù)字），因此，這個(gè)改進(jìn)并不會(huì)向后兼容。

2、動(dòng)態(tài)引入

Javascript  的動(dòng)態(tài)引入，允許你把 JS 文件作為一個(gè)模塊動(dòng)態(tài)的引入到你的應(yīng)用中。這就像你使用 webpack 和 Babel  一樣。這個(gè)功能可以幫助你處理按需加載的代碼，拆分代碼，而且，并不需要 webpack 或者其它模塊處理器。如果，你喜歡也可以在 if-else  塊中加載代碼。在 if-else 塊中引入一個(gè)模塊，這樣的好處是：不會(huì)污染全局命名空間。

3、 空值合并

空值合并可以真正的檢查  nullish 值，而不是 falsely 值。你或許會(huì)問(wèn)：nullish 和 falsely 之間有什么不同呢？在 Javascript  中有很多值都是 falsely。比如：空字符串、數(shù)字 0、undefined 、null、 false 、NaN  等。然而，很多情況下你只想檢測(cè)一個(gè)變量是否為空值 -- undefined 或者  null，就像變量可以是一個(gè)空字符串甚至是一個(gè)假值。在這個(gè)示例中，你將會(huì)看到新的空值合并操作符：??。

你可以清楚的看到 OR 操作符總是返回一個(gè)真值，但是，空值操作符返回一個(gè)非空值。

4、可選鏈

可選鏈語(yǔ)法允許你訪問(wèn)嵌套更深的對(duì)象屬性，而不用擔(dān)心屬性是否存在。如果，存在很好。反之，會(huì)返回 undefined。它不僅僅可操作對(duì)象屬性，也可以操作函數(shù)的調(diào)用或者數(shù)組。這樣更加方便！以下是個(gè)演示：

5、Promise.allSettled

Promise.allSettled  方法接收一組 Promise，并且會(huì)返回所有的結(jié)果 - 而不管是 resolved 還是  rejected。在之前，這是不可能的，盡管有些類似的實(shí)現(xiàn)比如：race 和 all。它只會(huì)“運(yùn)行所有的 promise -  而不關(guān)心它們的結(jié)果”。

6、String#matchAll

matchAll 是 String 原型鏈上的一個(gè)新增的方法，它可以關(guān)聯(lián)正則表達(dá)式。它返回一個(gè)迭代器，一個(gè)接一個(gè)的返回所有匹配的組。我們來(lái)看一個(gè)演示：

7、 globalThis

如果，你寫(xiě)過(guò)那些可以運(yùn)行在  Node、瀏覽器或者 web-workers 等跨平臺(tái)的 JS  代碼，你就會(huì)花費(fèi)很多的時(shí)間去處理全局對(duì)象的問(wèn)題。這是因?yàn)椴煌脚_(tái)全局對(duì)象也不同，瀏覽器中是 window，Node 中是 global，web  workers 中是 self。如果，還有更多的運(yùn)行環(huán)境，這個(gè)對(duì)象也會(huì)有不同。因此，你自己必要檢查運(yùn)行環(huán)境來(lái)決定使用正確是全局對(duì)象。ES2020  給我們帶來(lái)了 globalThis 對(duì)象，它始終會(huì)引用著全局對(duì)象，而不用關(guān)系代碼在哪運(yùn)行：

8、導(dǎo)出模塊的命名空間

Javascript 模塊中，一直都可以使用以下這種語(yǔ)法：

import * as utils from './utils.mjs'

然而，直到現(xiàn)在還不可以像以下這樣使用 export 語(yǔ)法：

注：目前是支持的（2020-04-24）

export * as utils from './utils.mjs'

以上和以下結(jié)果相同：

import * as utils from './utils.mjs'export { utils }

9、明確定義 for-in 的順序

ECMA 規(guī)范中并沒(méi)有明確定義 for (x in y) 的順序。盡管，在此之前瀏覽器實(shí)現(xiàn)了一致的順序，但是，現(xiàn)在已經(jīng)被納入到 ES2020 的官方規(guī)范中了。

10、 import.meta

import.meta 是由 ECMAScript 創(chuàng)建實(shí)現(xiàn)的，默認(rèn)為 null。

考慮一下這個(gè)模塊，module.js ：

<script type="module" src="module.js"></script>

你可以通過(guò) import.meta 對(duì)象訪問(wèn)模塊的相關(guān) meta 信息：

console.log(import.meta); // { url: "file:///home/user/module.js" }

它返回一個(gè)包含 url 屬性的對(duì)象，該屬性代表著模塊的 URL。它可能是獲取腳本的 URL（對(duì)于外部腳本來(lái)說(shuō)），或者是包含模塊文檔的基礎(chǔ)URL（對(duì)于內(nèi)聯(lián)腳本來(lái)說(shuō)）。

我喜歡 Javascript 社區(qū)不斷發(fā)展的一致性和速度。看看 Javascript 如何從一種經(jīng)過(guò)十年的噓聲演變成如今這種最強(qiáng)大、最靈活和最通用的語(yǔ)言，真的很神奇。

上述就是小編為大家分享的ES2020中Javascript10個(gè)新功能是怎樣的了，如果剛好有類似的疑惑，不妨參照上述分析進(jìn)行理解。如果想知道更多相關(guān)知識(shí)，歡迎關(guān)注億速云行業(yè)資訊頻道。