10 új JavaScript funkció az ES2020-ban, amelyeket tudnia kell

Jó hír - most elkészültek az új ES2020 funkciók! Ez azt jelenti, hogy most már teljes elképzelésünk van az ES2020 változásairól, a JavaScript új és továbbfejlesztett specifikációjáról. Tehát nézzük meg, melyek ezek a változások.

# 1: BigInt

Végre itt van a BigInt, a JavaScript egyik legjobban várt funkciója. Ez valójában lehetővé teszi a fejlesztők számára, hogy JS kódjukban sokkal nagyobb egész ábrázolás legyen az adatkezeléshez szükséges adatfeldolgozáshoz.

Jelenleg a JavaScriptben egész számként tárolható maximális szám pow(2, 53) - 1. De a BigInt valójában még ezen is túlmutat.  

Ugyanakkor na szám legvégén csatolnia kell, amint az fent látható. Ez nazt jelzi, hogy ez egy BigInt, és a JavaScript-motornak (v8-as motornak vagy bármilyen más motornak) másként kell kezelnie.

Ez a fejlesztés nem kompatibilis visszafelé, mert a hagyományos számrendszer az IEEE754 (amely egyszerűen nem képes támogatni az ekkora számokat).

# 2: Dinamikus importálás

A dinamikus importálás a JavaScript-ben lehetővé teszi a JS fájlok dinamikus importálását modulként az alkalmazásban natív módon. Ez pontosan olyan, mint ahogyan ezt a Webpack és a Babel használatával végzi.

Ez a szolgáltatás segítséget nyújt Önnek igény szerinti kód, vagyis a kód felosztásának elküldésében, a webpack vagy más modulcsomagolók nélkül. Ha akarja, feltételesen betöltheti a kódot egy if-else blokkba is.

A jó dolog az, hogy valóban importál egy modult, és így soha nem szennyezi a globális névteret.

# 3: Nullás összeforrás

A semmibe vett koalszfúzió hozzáadja az nullishértékek valóban ellenőrzésének lehetőségét az értékek helyett falsey. Mi a különbség nullishés falseyértékek, lehet kérni?

A JavaScript, sok értékek falsey, mint az üres húrok száma 0 undefined, null, false, NaN, és így tovább.

Sokszor érdemes ellenőrizni, hogy egy változó semmissé vált-e - ez akkor, ha ez vagy az, undefinedvagy nullpéldául akkor, ha rendben van, ha egy változónak üres karaktersorozata van, vagy akár hamis értéke.

Ebben az esetben az új nullás koalíziós operátort fogja használni, ??

Jól láthatja, hogy az OR operátor hogyan ad vissza mindig true értéket, míg a nullable operátor nem null értéket ad vissza.

# 4: Opcionális láncolás

Az opcionális láncolási szintaxis lehetővé teszi a mélyen beágyazott objektumtulajdonságok elérését anélkül, hogy aggódna, hogy a tulajdonság létezik-e vagy sem. Ha létezik, nagyszerű! Ha nem, undefinedakkor visszaküldik.

Ez nem csak az objektum tulajdonságain, hanem a függvényhívásokon és tömbökön is működik. Szuper kényelmes! Íme egy példa:

# 5: Promise.allSettled

A Promise.allSettledmódszer elfogadja az ígéretek tömbjét, és csak akkor oldódik fel, ha mindegyik rendeződik - vagy megoldva, vagy elutasítva.

Ez korábban nem volt natív módon elérhető, annak ellenére, hogy néhány szoros megvalósítás tetszett raceés allelérhető volt. Ez a "Csak futtasd be az összes ígéretet - nem érdekel az eredmények" natív módon a JavaScript-be kerül.

# 6: String # matchAll

matchAllegy új módszer a Stringprototípushoz, amely a reguláris kifejezésekhez kapcsolódik. Ez egy olyan iterátort eredményez, amely az összes egyező csoportot egymás után adja vissza. Nézzünk meg egy gyors példát:

# 7: globális

Ha olyan platformokon átívelő JS-kódot írt, amely a Node-on, a böngésző környezetében és a webmunkásokon belül is futtatható, nehezen tudná megszerezni a globális objektumot.

Ez azért van, mert windowa böngészők, globala Node és selfaz internetes dolgozók számára készült. Ha több futási idő van, akkor a globális objektum más lesz számukra is.

Tehát saját végrehajtással kellett volna rendelkeznie a futásidejű detektáláshoz, majd a megfelelő globális - vagyis mostanáig - használatához.

Az ES2020 elhozza nekünk, globalThisamely mindig a globális objektumra utal, függetlenül attól, hogy hol hajtja végre a kódot:

# 8: A modul névtér-exportja

A JavaScript modulokban már lehetséges volt a következő szintaxis használata:

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

Szimmetrikus exportszintaxis azonban eddig nem létezett:

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

Ez egyenértékű a következőkkel:

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

# 9: Jól meghatározott for-in sorrend

Az ECMA specifikációja nem határozta meg, hogy melyik sorrendben for (x in y)  kell futni. Annak ellenére, hogy a böngészők már korábban önállóan hajtottak végre egységes sorrendet, ezt hivatalosan szabványosították az ES2020-ban.

# 10: import.meta

Az import.metaobjektumot az ECMAScript implementáció hozta létre, nullprototípussal.

Vegyünk egy modult module.js:

Az import.metaobjektum használatával elérheti a modul metaadatait :

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

Visszaad egy objektumot, amelynek urltulajdonságai jelzik a modul alap URL-jét. Ez vagy az az URL lesz, ahonnan a szkriptet beszerezték (külső szkriptekhez), vagy a tartalmazó dokumentum dokumentum alap URL-je (inline szkriptekhez).

Következtetés

Szeretem azt a következetességet és sebességet, amellyel a JavaScript közösség fejlődött és fejlődik. Csodálatos és igazán csodálatos látni, hogy a JavaScript hogyan jött egy olyan nyelvből, amelyet tíz év múlva már minden idők egyik legerősebb, legrugalmasabb és legsokoldalúbb nyelvévé tettek.

Szeretné teljesen új módon megtanulni a JavaScript-et és más programozási nyelveket? Irány a fejlesztők új platformja, amin dolgozom, hogy még ma kipróbáljam!

Mi az ES2020 kedvenc funkciója? Mesélj erről Twitteren és Instagramon keresztül Twitteren és kapcsolatba lépve velem!

Ez egy blogbejegyzés, amely a videómból áll, és ugyanarról a témáról szól. Számomra a világot jelentené, ha megmutatna neki némi szeretetet!