ES10的13個(gè)新特性示例(小結(jié))
介紹
ES10是與2019年相對(duì)應(yīng)的ECMAScript版本。這個(gè)版本中的新功能沒有ES6(2015)中的那么多。但是,也不乏一些有用的功能。
本文在簡(jiǎn)單的代碼示例中介紹了ES10提供的功能。這樣,您無需復(fù)雜的解釋即可快速了解新功能。
當(dāng)然,需要具備JavaScript的基礎(chǔ)知識(shí)才能完全理解所介紹的新功能。
ES2019中的JavaScript新功能包括:
- Array#{flat,flatMap}
- Object.fromEntries
- String#{trimStart,trimEnd}
- Symbol#description
- try { } catch {} // 可選的錯(cuò)誤參數(shù)綁定
- JSON ⊂ ECMAScript
- 格式良好的 JSON.stringify
- 穩(wěn)定的排序 Array#sort
- 新版 Function#toString
- 新增 BigInt 原始類型 (stage 3).
- 動(dòng)態(tài)引入模塊(stage 3).
- 標(biāo)準(zhǔn)的 globalThis 對(duì)象 (stage 3).
- ES10 Class: private, static & public (stage 3).
Array.flat() & Array.flatMap()
兩個(gè)新的數(shù)組方法:
Array.flat() 方法創(chuàng)建一個(gè)新數(shù)組,所有子數(shù)組元素都以遞歸方式合并到該數(shù)組中,直至達(dá)到指定深度。
Array.flatMap() 方法首先使用map函數(shù)轉(zhuǎn)換每個(gè)元素,然后將結(jié)果展平為新數(shù)組。它與map()后再調(diào)用深度為1的flat() 效果相同,但是flatMap()將兩者合并為一種方法,效率更高。
Object.fromEntries()
把鍵值對(duì)數(shù)組為元素的二維數(shù)組轉(zhuǎn)換為一個(gè)對(duì)象。
String.protype.matchAll()
matchAll() 方法返回所有與正則表達(dá)式匹配字符串的結(jié)果的迭代器,包括捕獲組。
String.trimStart() & String.trimEnd()
有兩種新的String方法可從字符串中刪除空格:
trimStart() 方法從字符串的開頭刪除空格。
trimEnd() 方法從字符串末尾刪除空格。
Symbol.Description
當(dāng)創(chuàng)建符號(hào)時(shí),可以提供一個(gè)字符串作為描述。在ES10中,有一個(gè)獲取描述的訪問器。
可選的 Catch 參數(shù)變量
過去,try / catch語句中的catch子句需要一個(gè)變量?,F(xiàn)在,它允許開發(fā)人員使用try / catch而不創(chuàng)建未使用的error變量綁定。
JSON⊂ECMAScript
在ES10之前的版本中,不接受非轉(zhuǎn)義的行分隔符U+2028和段落分隔符U+2029。
U+2028是段落分隔符。
U+2029是行分隔符。
格式良好的 JSON.stringify()
JSON.stringify() 可能返回U+D800和U+DFFF之間的字符,來作為沒有等效UTF-8字符的值。但是,JSON格式需要UTF-8編碼。解決方案是,將未配對(duì)的替代代碼點(diǎn)表示為JSON轉(zhuǎn)義序列,而不是將其作為單個(gè)UTF-16代碼單元返回。
Array.prototype.sort()
V8的先前實(shí)現(xiàn),對(duì)包含10個(gè)以上項(xiàng)的數(shù)組使用了不穩(wěn)定的快速排序算法。
一種穩(wěn)定的排序算法是,當(dāng)兩個(gè)具有相同鍵的對(duì)象在排序輸出中出現(xiàn)的順序,與未排序輸入中出現(xiàn)的順序相同。
新版 Function.toString()
toString() 方法返回一個(gè)表示函數(shù)源代碼的字符串。在ES6中,當(dāng)在函數(shù)上調(diào)用toString時(shí),它將根據(jù)ECMAScript引擎返回該函數(shù)的字符串表示形式。如果可能,它將返回源代碼,否則-一個(gè)標(biāo)準(zhǔn)化的占位符。
BigInt — 任意精度的整數(shù)
BigInt是第7個(gè)原始類型,它是一個(gè)任意精度的整數(shù)。而不僅僅是在9007199254740992處的最大值。
動(dòng)態(tài)引入
動(dòng)態(tài)import()返回所請(qǐng)求模塊的Promise。因此,可以使用async/await 將導(dǎo)入的模塊分配給變量。
標(biāo)準(zhǔn) globalThis 對(duì)象
全局 this 在ES10之前尚未標(biāo)準(zhǔn)化。在生產(chǎn)代碼中,您可以通過編寫下邊代碼來“標(biāo)準(zhǔn)化”它:
ES10 Class: private, static & public 成員變量,函數(shù)
現(xiàn)在,新的語法字符#(哈希標(biāo)簽)用于直接在類中定義變量,函數(shù),getter和setter,以及構(gòu)造函數(shù)和類方法。
總結(jié)
自2015年ES6出現(xiàn)以來,這個(gè)語言就一直處于高速發(fā)展的狀態(tài)。在這篇文章中,我們回顧了ES10(2019)中出現(xiàn)的功能,并介紹了一些在ES11(2020)中將保持穩(wěn)定的功能,因?yàn)樗鼈兲幱跔顟B(tài)3,并且可能最終會(huì)在下一版中實(shí)現(xiàn)標(biāo)準(zhǔn)化。
盡管這些功能中的許多功能對(duì)于Web應(yīng)用程序的開發(fā)可能不是必需的,但是它們提供了通過技巧或大量冗長(zhǎng)代碼才能實(shí)現(xiàn)的可能性。
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
JavaScript數(shù)據(jù)可視化:ECharts制作地圖
這篇文章主要介紹了Echarts實(shí)現(xiàn)可視化地圖,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-08-08js正則表達(dá)式驗(yàn)證密碼強(qiáng)度【推薦】
本文主要介紹了js利用正則表達(dá)式驗(yàn)證密碼強(qiáng)度的實(shí)例,具有很好的參考價(jià)值。下面跟著小編一起來看下吧2017-03-03BootStrap Table實(shí)現(xiàn)server分頁(yè)序號(hào)連續(xù)顯示功能(當(dāng)前頁(yè)從上一頁(yè)的結(jié)束序號(hào)開始)
這篇文章主要介紹了BootStrap Table實(shí)現(xiàn)server分頁(yè)序號(hào)連續(xù)顯示功能(當(dāng)前頁(yè)從上一頁(yè)的結(jié)束序號(hào)開始),需要的朋友可以參考下2017-09-09JavaScript高級(jí)程序設(shè)計(jì) 閱讀筆記(十二) js內(nèi)置對(duì)象Math
js內(nèi)置對(duì)象Math使用介紹, 需要的朋友可以參考下2012-08-08JavaScript設(shè)計(jì)模式之職責(zé)鏈模式應(yīng)用示例
這篇文章主要介紹了JavaScript設(shè)計(jì)模式之職責(zé)鏈模式,結(jié)合實(shí)例形式分析了javascript責(zé)任鏈模式的概念、原理、使用方法及相關(guān)操作注意事項(xiàng),需要的朋友可以參考下2018-08-08javascript跑馬燈抽獎(jiǎng)實(shí)例講解
這篇文章主要為大家介紹了javascript跑馬燈抽獎(jiǎng)特效,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-01-01JS使用ajax方法獲取指定url的head信息中指定字段值的方法
這篇文章主要介紹了JS使用ajax方法獲取指定url的head信息中指定字段值的方法,實(shí)例分析了Ajax操作URL中head信息的技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-03-03原生JS實(shí)現(xiàn)匯率轉(zhuǎn)換功能代碼實(shí)例
這篇文章主要介紹了原生JS實(shí)現(xiàn)匯率轉(zhuǎn)換功能代碼實(shí)例,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-05-05