Новые функции в ECMAScript 2020

0
1284

Новые функции в ECMAScript 2020

Новые функции в ECMAScript 2020
Новые функции в ECMAScript 2020

В новом году была выпущена свежая версия ECMAScript! Это хорошая новость для тех, кто любит ECMAScript. В предыдущей версии ES было много забавных и полезных функций. Чего же ожидать на этот раз? Давайте ознакомимся вкратце!

Динамический импорт

Теперь вы имеете возможность импортировать файлы динамически.

Выше представлен способ, с помощью которого вы можете импортировать файл. Механизм JavaScript видит модули в файле и переносит их в тот файл, где эти модули используются. Однако, теперь вы можете сделать это следующим образом.

Динамический импорт возвращает promise. Это означает, что вы также можете написать это следующим образом.

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

Вот браузеры, поддерживающие динамический импорт:

  • Chrome: 63
  • Edge: No Support
  • Firefox: 67
  • IE: No Support
  • Opera: 50
  • Safari: 11.1

BigInt

Если вам необходимо добавить два числа, которые достаточно велики, чтобы вызвать перегрузку…

…BigInt, в таком случае, просто спаситель.

Вы можете создать BigInt, вызвав конструктор BigInt() с круглыми скобками или 2n с ‘n’ в конце числа.

Вы также можете добавлять, вычитать, умножать и делить.

Обратите внимание на то, что bigN / 3n возвращается 3n, а не 3.33333n. Поскольку, судя по его имени, он обрабатывает только целые числа. Поэтому bigN / 3n так похоже на Math.floor(10 / 3).

Однако, к сожалению, вам не удастся создать BigInt с числом с плавающей точкой. Также вы не сможете использовать BigInt и Number вместе.

На практике существует единственный допустимый способ смешивания операций — когда вы сравниваете размер этих операций.

Также BigInt может быть воспринят как число, если он не пребывает в условии if.

Вот перечень браузеров, которые поддерживают BigInt:

  • Chrome: 67
  • Edge: No Support
  • Firefox: 68
  • IE: No Support
  • Opera: 54
  • Safari: No Support

Promise.allSettled

Метод, весьма схожий с Promise.all , но при этом имеющий существенные отличия. Promise.all возвращает promise, который выполнится тогда, когда будут выполнены все promises, переданные в виде перечисляемого аргумента, или будет отклонено любое из переданных promise. Однако Promise.allSettled не заботится об этом. Для него является важным знать, все ли promise выполнены, вне зависимости от того, какой у них статус. Таким образом, каждый переданный promise может быть выполнен или отклонен, но для Promise.allSettled это не имеет значения. Единственное условие – все они должны быть сделаны.

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

Данные браузеры поддерживают Promise.allSettled:

  • Chrome: 76
  • Edge: No Support
  • Firefox: 71
  • IE: No Support
  • Opera: Unknown
  • Safari: Unknown

globalThis

Очень простое в использовании свойство.
Глобальное свойство globalThis содержит значение глобального this, который является глобальным объектом. В браузере globalThis будет this, в Node.js — global. Следовательно, больше нет нужды в том, чтобы думать о различных проблемах окружения.

Вот таким образом все работает изнутри, но лучше не используйте это в своем коде!

Поддержка окружения для gloablThis:

  • Chrome: 71
  • Edge: No Support
  • Firefox: 65
  • IE: No Support
  • Opera: No Support
  • Safari: 12.1
  • Node: 12

Вывод

В ES2020 на самом деле много интересных новых функций. Однако большинство из них, к сожалению, не поддерживаются старыми браузерами. Немаловажно то, что они стабильны далеко не в каждой среде. Поэтому вам стоит основательно подойти к вопросу о том, какое окружение поддерживать в вашем проекте.

источник