Рубрики
Всем сразу Разработка

Что нового в JavaScript с 2016 по 2022

Обновление ES2015 (ES6) принесло в язык очень много новых возможностей и сделало JavaScript действительно лучше. Но с 2015 года прошло уже 7 лет и за это время в язык также были добавлены новые возможности и улучшения. В данном посте я хотел бы рассмотреть список нововведений и улучшений, которые были добавлены в язык на протяжении 2016-2021 годов, а также новшества которые будут (скорее всего) приняты в июне 2022 года.

Новое в ECMAScript 2016 

В ECMAScript 2016 были добавлены следующие возможности:

Новое в ECMAScript 2017

В ECMAScript 2017 были добавлены следующие возможности:

  • Асинхронные функции (async/await) позволяет нам писать асинхронный код в привычном синтаксисе. По сути синтаксический сахар для Promises. Точно так же как Promises подобны структурированным обратным вызовам, async/await подобны комбинации генераторов и Promises.
  • Object.values() – возвращает массив значений перечисляемых свойств (только собственных) текущего объекта.
  • Object.entries() – возвращает массив собственных перечисляемых свойств указанного объекта в формате [key, value].
  • Заполнение строк. Методы .padStart() и .padEnd() дополняют текущую строку, сначала и с конца соответственно, строкой переданной во втором аргументе, не превышая длину результирующую длину строки указанную в первом аргументе:
    > 'abc'.padStart(10, “foo”); // -> “foofoofabc”
    > 'abc'.padEnd(10, "foo"); // -> “abcfoofoof”
  • Висящие запятые в функциях: ECMAScript 2017 допускает висящие запятые в списке параметров функции и в вызовах функций. Исключение составляет лишь случаи, когда только одна запятая передана в параметры и когда запятая оставлена после rest оператора.

Новое в ECMAScript 2018

В ECMAScript 2019 были добавлены следующие возможности:

  • Асинхронные итераторы – это асинхронная версия синхронных итераторов. Они основаны на Promises:
    • С помощью синхронных итераторов мы последовательно и непрерывно имеем доступ к каждому итерируемому элементу. С асинхронными итераторами мы можем использовать await перед доступом к элементу.
    • С синхронными итераторами мы используем цикл for-of.  С асинхронными итераторами мы используем цикл for-await-of.
  • Spread syntax в литералах объекта: Используя (…) внутри литерала объекта, мы можем создать поверхностную копию свойств текущего объекта в новом, копируя собственные перечисляемые свойства данного объекта в новый объект:
    > const shallowCopy = {...obj};
  • Rest свойства (деструктурирование): Когда мы определяем переменную деструктурируя какое-либо свойство объекта, мы можем получить оставшиеся свойства в виде нового объекта с помощью Rest syntax:
    > const obj = {a: 1, b: 2, c: 3};
    > const { a: propValue, ...remaining } = obj;
    > propValue // -> 1
    > remaining // ->  {b: 2, c: 3}
  • Promise.prototype.finally() – возвращает Promise. Когда Promise был выполнен, вне зависимости успешно или с ошибкой, указанная функция будет выполнена. Позволяет избавиться от дублирования кода в обработчиках then() и catch().
  • Новое в регулярных выражениях:

Новое в ECMAScript 2019

В ECMAScript 2019 были добавлены следующие возможности:

  • Метод массива .flatMap() работает как .map(), но сначала применяет функцию к каждому элементу, а затем преобразует полученный результат в плоскую структуру и помещает в новый массив. Можно применять для:
    • Фильтрования и маппинга одновременно
    • Маппинга единичных входящих значений в множественные 
  • Метод массива .flat() преобразует вложенные массивы в плоские. В качестве аргумента можно указать глубину преобразования.
  • Object.fromEntries() позволяет создавать объект из итерируемых свойств вида ключ-значение.
  • Методы строк: .trimStart() и .trimEnd() работают также как и .trim(), но удаляют пробелы с начала и конца строки соответственно.
  • Опциональный вызов catch: Теперь вы сможете пропустить вызов исключения в блоке catch если оно вам не нужно.
  • Symbol.prototype.description – это геттер для чтения свойства description данного символа. Ранее описание было доступно как результат вызова метода .toString(), но не  было доступно непосредственно.
  • JSON superset: позволяет не экранировать Юникод символы  U+2028 (разделитель строки) и U+2029 (разделитель параграфа) в значениях свойств.
  • Well-formed JSON.stringify(): представляет одиночные суррогаты (только для кодовых точек в диапазоне от U+D800 до U+DFFF), используя escape-последовательности JSON, которые могут быть закодированы в допустимых кодировках UTF-8 или UTF-16.
  • Function.prototype.toString(): возвращает строку, представляющую исходный код функции.

Новое в ECMAScript 2020

В ECMAScript 2020 были добавлены следующие возможности:

  • Новые возможности для модулей:
    • Динамический импорт c import(): Обычный оператор импорта статичен: мы можем использовать его только на верхних уровнях модулей, а спецификатор модуля — это фиксированная строка. import() меняет это. Его можно использовать где угодно (включая условные операторы), и мы можем вычислить его аргумент.
    • import.meta содержит метаданные для импортируемого модуля. Наиболее широко поддерживаемое свойство –  import.meta.url, которое содержит ссылку на ресурс откуда загружен текущий модуль.
    • Обратный экспорт или агрегация: теперь есть возможность экспортировать из данного модуля, то что вы импортировали из какого-либо другого модуля;
  • Оператор опциональной последовательности: позволяет получить значение свойства, находящегося на любом уровне вложенности в цепочке связанных между собой объектов, без необходимости проверять каждое из промежуточных свойств в ней на существование.  ?. работает подобно оператору ., за исключением того, что не выбрасывает исключение, если объект, к свойству или методу которого идёт обращение, равен null или undefined. В этих случаях он возвращает undefined.
  • Оператор нулевого слияния:
    > value ?? defaultValue
    Это выражение имеет значение defaultValue, если значение левого операнда undefined или null, в любом другом случае мы получим значение левого операнда. Этот оператор позволяет нам использовать значение по умолчанию всякий раз, когда чего-то не хватает.
    Ранее в этом случае использовался оператор логического ИЛИ (||), но здесь у него есть недостатки, поскольку он возвращает значение по умолчанию всякий раз, когда левая часть ложна (что не всегда правильно).
  • BigInt – это встроенный объект, который предоставляет способ представлять целые числа больше 253 - 1.
  • String.prototype.matchAll(): возвращает итератор по всем результатам при сопоставлении строки с регулярным выражением.
  • Promise.allSettled(): возвращает Promise, который исполняется когда все полученные Promises завершены (исполнены или отклонены), содержащий массив результатов исполнения полученных промисов.
  • globalThis: позволяет получить доступ к глобальному объекту в браузере или на стороне сервера в Node.js или Deno.

Новое в ECMAScript 2021

В ECMAScript 2021 были добавлены следующие возможности:

Новое в ECMAScript 2022

ECMAScript 2022, скорее всего, станет стандартом в июне 2022. Следующие предложения достигли статуса “stage 4” и с очень большой вероятностью станут частью стандарта:

Заключение

Данный список возможностей ECMAScript является свободным и немного переработанным переводом главы из книги JavaScript for impatient programmers. Книга доступна для свободного чтения онлайн или может быть приобретена в печатной версии.

Изначально перечень возможностей был взят из списка принятых предложений со страницы TC39.

Один ответ к “Что нового в JavaScript с 2016 по 2022”

Добавить комментарий

Ваш адрес email не будет опубликован.