Для разработчиков Javascript есть хорошие новости: для использования доступны новые функции ES2020. Это означает, что в настоящее время у нас есть полное представление об эволюции, происходящей в ES2020, а также точное определение JavaScript. Итак, как насчет того, чтобы увидеть, что это за эволюция?

# 1: Импорт мета

Объект import.meta был сформирован реализацией ECMAScript с нулевым прототипом.

Рассмотрим модуль module.js:

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

Вы можете получить доступ к метаинформации о модуле с помощью объекта import.meta:

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

Он возвращает объект со свойством URL, показывающим базовый URL модуля. Это будет либо URL-адрес, с которого было получено содержимое (для внешнего содержимого), либо базовый URL-адрес документа содержащего его архива (для встроенного содержимого).

# 2: четко определенный порядок

Условие ECMA не определяет порядок выполнения for (x in y). Несмотря на то, что до сих пор браузеры самостоятельно реализовывали последовательный порядок, он был официально стандартизирован в ES2020.

# 3: Экспорт пространства имен модуля

В модулях JavaScript уже можно было использовать следующий синтаксис:

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

Однако до сих пор не существовало синтаксиса симметричного экспорта:

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

Это эквивалентно следующему:

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

# 4: globalThis

Если вы написали кросс-платформенный JS-код, который может работать на Node, вам будет сложно удержать глобальный объект в среде браузера, а также внутри веб-рабочих.

Это связано с тем, что это окно для браузеров, глобальное для узла и собственное для веб-работников. Если время выполнения больше, глобальный объект будет отличаться и для них.

Таким образом, вам нужно было бы иметь собственное выполнение определения времени выполнения, а затем использовать точный глобальный - то есть до сих пор.

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

# 5: String matchAll

matchAll - это инновационный метод, добавленный к прототипу String, который связан с регулярными выражениями. Это возвращает итератор, который возвращает все совпавшие группы одну за другой. Давайте посмотрим на небольшой пример:

# 6: Promise.allSettled

Техника Promise.allSettled принимает массив обещаний и разрешается только тогда, когда все они урегулированы - либо разрешены, либо отклонены.

Раньше это было недоступно изначально, несмотря на то, что были доступны некоторые близкие реализации, такие как race и all. Это дает возможность «просто выполнять все обещания - меня наплевать на результаты» прямо в JavaScript.

# 7: Необязательная цепочка

Необязательный синтаксис цепочки позволяет вам получить глубоко вложенные свойства объекта, не обращая внимания на то, существует это свойство или нет. Если он существует, то замечательно! В противном случае будет возвращено undefined.

Это работает не только со свойствами объекта, но и с вызовами функций и массивами. Вот пример:

# 8: Нулевое слияние

Нулевое объединение расширяет возможности точной проверки нулевых значений вместо ложных значений. Вы можете спросить, в чем основное различие между нулевыми и ложными значениями?

В JavaScript есть много значений, которые являются ложными, например, пустые строки, число 0, undefined, null, false, NaN и многие другие.

Кроме того, вам нужно много раз проверять, имеет ли переменная нулевое значение, то есть имеет ли значение неопределенное или нулевое значение, как будто оно хорошо, чтобы переменная имела пустую строку или даже ложное значение.

В таком случае вы воспользуетесь инновационным оператором объединения nullish, ??

# 9: динамический импорт

Динамический импорт в JavaScript дает вам возможность динамически импортировать файлы JS как модули в вашем приложении. Это похоже на то, как вы это делаете сейчас с Webpack и Babel.

Эта функция поможет вам отправить код по запросу, более известный как разделение кода, без дополнительных затрат на Webpack или другие сборщики модулей. Вы также можете условно загрузить код в блок if-else, если хотите.

Хорошо то, что вы фактически импортируете модуль, и поэтому он никогда не загрязняет глобальное пространство имен.

# 10: BigInt

Здесь самая ожидаемая функция JavaScript - Biglnt. Это функция, которая позволяет разработчикам представлять числовые данные в своем JavaScript для обработки данных.

Текущий JavaScript позволяет разработчикам сохранять целое число в pow (2, 53) - 1, но эта функция позволяет нам выходить за рамки этого ограничения.

Однако в самом конце номера необходимо добавить n, как вы можете видеть выше. Этот n означает, что это BigInt, и механизм JavaScript должен обрабатывать его иначе.

Вывод

Мне нравится последовательность и скорость, с которой сообщество JavaScript развивалось и развивается. Поразительно и по-настоящему удивительно видеть, как JavaScript произошел от языка, который был освистан 10 лет назад, до одного из самых обоснованных, в целом адаптируемых и гибких языков, когда-либо существовавших сегодня.

Надеюсь, вы нашли эту статью полезной. Если у вас есть предложения, поделитесь ими в комментариях.

Вы также можете подписаться на меня в Medium, Twitter, Github, Youtube и LinkedIn сразу после того, как нажмете хлопок ниже ;-)