10 нови функции на JavaScript в ES2020, които трябва да знаете

Добра новина - новите функции на ES2020 вече са финализирани! Това означава, че вече имаме пълна представа за промените, които се случват в ES2020, новата и подобрена спецификация на JavaScript. Така че нека да видим какви са тези промени.

# 1: BigInt

BigInt, една от най-очакваните функции в JavaScript, най-накрая е тук. Това всъщност позволява на разработчиците да имат много по-голямо цяло представяне в своя JS код за обработка на данни за обработка на данни.

В момента максималният брой, който можете да съхранявате като цяло число в JavaScript, е pow(2, 53) - 1. Но BigInt всъщност ви позволява да стигнете дори отвъд това.  

Трябва обаче да имате nдобавен в самия край на номера, както можете да видите по-горе. Това nозначава, че това е BigInt и трябва да се третира по различен начин от JavaScript двигателя (от v8 двигателя или какъвто и да е двигател, който използва).

Това подобрение не е обратно съвместимо, защото традиционната бройна система е IEEE754 (която просто не може да поддържа номера с такъв размер).

# 2: Динамичен импорт

Динамичното импортиране в JavaScript ви дава възможност да импортирате JS файлове динамично като модули във вашето приложение. Това е точно както в момента го правите с Webpack и Babel.

Тази функция ще ви помогне да изпратите код при поискване, по-известен като разделяне на кода, без режийни разходи за уеб пакети или други модулни пакети. Можете също така условно да заредите код в блок if-else, ако искате.

Хубавото е, че всъщност импортирате модул и така той никога не замърсява глобалното пространство от имена.

# 3: Nullish Coalescing

Nullish coalescing добавя способността наистина да проверява nullishстойности вместо falseyстойности. Каква е разликата между nullishи falseyстойности, може да попитате?

В JavaScript, много от стойностите са falseyкато празни струни, на номер 0, undefined, null, false, NaN, и така нататък.

Въпреки това, много пъти може да искате да проверите дали дадена променлива е нищожна - това е, ако е undefinedили null, например, когато е добре променливата да има празен низ или дори фалшива стойност.

В този случай ще използвате новия нулев оператор за обединяване, ??

Можете ясно да видите как операторът OR винаги връща вярна стойност, докато нулевият оператор връща ненулева стойност.

# 4: Незадължителна верига

Синтаксисът по избор на верига ви позволява да получите достъп до дълбоко вложени свойства на обекта, без да се притеснявате дали свойството съществува или не. Ако съществува, чудесно! Ако не, undefinedще бъде върнат.

Това работи не само за свойствата на обекта, но също така и за извиквания на функции и масиви. Супер удобно! Ето пример:

# 5: Promise.allSettled

В Promise.allSettledметода приема масив от обещания и само решава, когато всички от тях се уреждат - или разрешени или отхвърлени.

Преди това това не беше достъпно, въпреки че някои близки внедрения харесваха raceи allбяха налични. Това води до "Просто изпълнете всички обещания - не ми пука за резултатите" в JavaScript.

# 6: String # matchAll

matchAllе нов метод, добавен към Stringпрототипа, който е свързан с регулярните изрази. Това връща итератор, който връща всички съвпадащи групи една след друга. Нека да разгледаме един бърз пример:

# 7: глобално Това

Ако сте написали някакъв крос-платформен JS код, който може да работи на Node, в средата на браузъра, а също и в уеб-работниците, трудно ще се докопате до глобалния обект.

Това е така, защото е windowза браузъри, globalза Node и selfза уеб работници. Ако има повече времена на изпълнение, глобалният обект ще бъде различен и за тях.

Така че би трябвало да имате собствена реализация за откриване на време на изпълнение и след това да използвате правилния глобален - т.е. досега.

ES2020 ни предлага, globalThisкойто винаги се отнася до глобалния обект, независимо къде изпълнявате кода си:

# 8: Износ на пространство от имена на модула

В модулите на JavaScript вече беше възможно да се използва следният синтаксис:

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

exportДосега обаче не съществуваше симетричен синтаксис:

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

Това е еквивалентно на следното:

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

# 9: Добре дефиниран ред

Спецификацията на ECMA не посочва в кой ред for (x in y)  да се изпълнява. Въпреки че браузърите са прилагали последователна поръчка самостоятелно преди това, това е официално стандартизирано в ES2020.

# 10: import.meta

В import.metaобекта е създаден от изпълнението на ECMAScript, с nullпрототип.

Помислете за модул module.js:

Можете да получите достъп до мета информация за модула, като използвате import.metaобекта:

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

Той връща обект със urlсвойство, указващо основния URL адрес на модула. Това ще бъде или URL адресът, от който е получен скриптът (за външни скриптове), или основният URL адрес на документа на съдържащия документ (за вградени скриптове).

Заключение

Обичам последователността и бързината, с които общността на JavaScript се е развила и се развива. Удивително и наистина прекрасно е да видим как JavaScript е дошъл от език, който е освиркван след 10 години, до един от най-силните, гъвкави и гъвкави езици на всички времена днес.

Искате ли да научите JavaScript и други езици за програмиране по съвсем нов начин? Насочете се към нова платформа за разработчици, върху която работя, за да я изпробвате днес!

Коя е любимата ви функция на ES2020? Разкажете ми за това, като пишете и се свързвате с мен в Twitter и Instagram!

Това е публикация в блог, съставена от видеоклипа ми, която е на същата тема. За мен би означавало света, ако можете да му покажете някаква любов!