Релиз ES2020 состоялся не так давно, но дополнительные функции уже находятся в разработке, ожидая выхода. Рабочая группа TC39 занимается внедрением этих функций в новую версию стандарта ECMAScript. Эта статья знакомит вас с функциями, которые уже находятся на 4-м этапе TC39.

TC39 предусматривает следующие этапы:

Этап 0: Strawperson

Члены TC39 могут предлагать любую идею, изменение или дополнение, которые ранее не были предложены (или ранее полностью отклонены).

Этап 1. Предложение

Предложение создается членом TC39. В нем описывается конкретная проблема и связанное с ней решение.

Этап 2: черновик

Синтаксис и семантика предложения описаны на формальном языке спецификации.

Этап 3: кандидат

Технические характеристики предложения завершены, и рецензенты его одобрили. Этап 4 - Завершено: предложение может быть включено в следующую версию ECMAScript.

Этап 4: завершено

Предложение может быть включено в следующую версию ECMAScript. ES2021, вероятно, будет выпущен в июне 2021 года.

Операторы логического присваивания

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

||=  // combines logical OR with ASSIGN
&&=  // combines logical AND with ASSIGN
??=  // combines NULLISH with ASSIGN

Логический оператор ИЛИ ||= представляет собой комбинацию логического оператора || и оператора присваивания. Назначение правого операнда левому операнду, если первый имеет значение ложь (т. Е. Значение, которое проверяется как ложное) и, таким образом, является сокращенной формой записи a||(a=b).

Оператор логического И присваивания &&= работает идентично, но объединяет логический оператор && и оператор присваивания и присваивает правый операнд левому операнду, только если первый имеет истинное значение (т. Е. Значение, которое оценивается как правда). Это краткая форма записи a&&(a=b).

Оператор для логического нулевого присваивания ??= - это краткая форма записи a??(a=b). Второй операнд присваивается первому только в том случае, если первый операнд равен нулю или не определен.

Новые операторы очень удобны для инициализации свойств объекта. Они помогают обеспечить внутреннюю инициализацию свойства firstName объекта person значением Commander, если свойство еще не назначено.

Вкратце пройдемся по старому пути:

С ES2021 вы можете укоротить всю конструкцию:

В заключение, вы просто сокращаете способ назначения значений по умолчанию для неинициализированных переменных. Из:

person.firstName = person.firstName|| person.firstName='Commander';

To:

person.firstName ||= 'Commander';

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

Замена строк

Когда вы заменяете все вхождения подстроки в строке, лучше всего использовать регулярные выражения. Что вы также можете сделать, так это использовать функцию polyfill replaceAllPolyfill(), которая применяет глобальный поиск указанного регулярного выражения к соответствующей строке.

Другой вариант - использовать строковый метод split(), этот метод разбивает строку во всех местах, где встречается переданная подстрока, и возвращает отдельные части в виде массива. Вызов join() в этом массиве с указанием новой строки, которую нужно вставить, объединяет все вместе.

Должно быть ясно, что эти способы менее эффективны по соображениям производительности. Длинные строки и частые появления строки поиска обнаружат это в спешке. Метод replaceAll() упростит все это в будущем: он заменяет все вхождения подстроки, указанной в качестве первого параметра, новой строкой, указанной в качестве второго параметра.

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

Обещания

В ES2020 уже была функция, расширяющая обещания методом allSettled(). В ES2021 мы получим нового игрока в этой команде, это any(). Он ожидает итерацию обещаний и возвращает обещание, которое выполняется точно, как только выполняется одно обещание. Такое же поведение допустимо для отклонения всякий раз, когда все переданные обещания отклоняются, также any() возвращает отклоненное обещание. В последнем случае можно получить доступ к подробной информации о соответствующих ошибках всех отклоненных обещаний через AggregateError.

Как видите, при прокрутке примеров асинхронного разрешения / отклонения обещаний функция any() ожидает первого разрешенного и только затем распечатывает firstResolver. Когда каждое обещание было отклонено, для оболочки try-catch запускается ошибка. Третий пример ясно демонстрирует, почему для firstResolver.

Слабые ссылки

Бьюсь об заклад, вы знаете WeakSet и WeakMap. Они реализованы с ES2015. WeakSet - это набор объектов. WeakMap - это набор пар ключ-значение, где каждый ключ должен быть объектом. Связь между ними состоит в том, что объекты имеют слабые ссылки. Это означает, что эти объекты могут быть удалены из памяти как часть сборки мусора, если нет других сильных ссылок на объекты. Таким образом, слабая ссылка на объект - это ссылка, которая не препятствует удалению объекта из памяти сборщиком мусора. Напротив, обычная (или сильная) ссылка сохраняет объект в памяти.

ES2021 позволит создавать слабые ссылки на объекты вне контекста WeakSet или WeakMap, вручную используя объект WeakRef. Соответствующее предложение предупреждает вас, чтобы вы были осторожны с WeakRef перед их использованием. Любыми способами проверьте, оправдано ли его использование вообще. В принципе, по возможности следует избегать использования. Сборка мусора слишком сложна и зависит от системы, поэтому трудно предсказать точное поведение сборщика мусора.

BINARY, HEXADECIMALS и BIGINT наконец-то стали читаемыми

Было ли когда-нибудь легко читать большие числа? Я бы возражал против ответа: нет! То же самое верно для больших целых чисел, больших двоичных и шестнадцатеричных чисел. Так зачем вообще ждать до 2021 года, чтобы ввести читаемый формат для больших числовых значений? Я не знаю, потому что он есть и в других языках (Java, Python, Perl, Ruby и C #), но теперь это касается и JavaScript. Функция числового разделителя поможет нашим глазам бодрствовать.

С помощью этого разделителя мы можем сделать числовые значения более удобочитаемыми, просто поместив разделитель между соответствующими группами цифр. Разделитель работает с числами в десятичной системе счисления и с числами в двоичной или шестнадцатеричной системе счисления и использует BigInts, представленные в ES2020.

Примечание. Разделитель не влияет на числовое значение при сравнении с помощью ===operator.

Заключение

Стандарт Javascript неуклонно продолжается. Хотя релиз состоится через несколько месяцев, некоторые довольно приятные функции уже реализованы и ждут большого выхода с версией 2021. Если все функции войдут в новую версию, это станет еще одним большим шагом вперед в развитии JavaScript. Обзор текущего статуса представлен на https://github.com/tc39/proposals, обзор возможностей Stage 4 доступен на https://github.com/tc39/proposals/blob/master/ finish-proposals.md . [1], [2]

Опубликовать изображение стола поддержки было бы неадекватно, поскольку после того, как я сделал снимок экрана, таблица почти сразу устарела. Отметьте здесь, чтобы узнать о поддержке функций для распространенных операционных систем, сред выполнения серверного JavaScript, таких как Node.js, и мобильных браузеров.

Дополнительная литература







Ссылки

[1] Предложения TC39 https://github.com/tc39/proposals

[2] Характеристики четвертого этапа TC39 https://github.com/tc39/proposals/blob/master/finished-proposals.md.

[3] Таблица поддержки ECMA https://kangax.github.io/compat-table/esnext/