Готовящиеся к выпуску новые функции JavaScript

Готовящиеся к выпуску новые функции JavaScript

От автора: после релиза ECMAScript2015 (также называемого ES6) JavaScript изменился и улучшился. Это отличная новость для всех разработчиков JavaScript. Кроме того, новая версия ECMAScript выпускается каждый год. Скорее всего, вы не заметили, какие функции были добавлены в последнюю версию ECMAScript, выпущенную в июне 2019 года. Я кратко расскажу вам о новых функциях, добавленных в последней версии, а также о функциях, готовящихся к выходу в будущей версии.

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

Функции ECMAScript2019 (ES10)

1. Array.prototype.flat

Метод, который создает новый массив со всеми элементами вложенного массива, рекурсивно объединенными в него до заданной глубины.

JavaScript. Быстрый старт

Изучите основы JavaScript на практическом примере по созданию веб-приложения

Узнать подробнее

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

Чем глубже вы хотите выполнять поиск в массиве, тем больше вычислительного времени потребуется для его выравнивания. Обратите внимание, что IE и Edge не поддерживают эту функцию.

2. Array.prototype.flatMap

Метод сначала отображает каждый элемент с помощью функции сопоставления, а затем выравнивает результат в новый массив.

Разница между flat и flatMap заключается в том, что вы можете добавить пользовательскую функцию flatMap для управления каждым значением. Кроме того, в отличие от flat, flatMap сглаживает массив только с одним уровнем глубины. Возвращаемое значение должно иметь тип массива. Это очень полезно, когда вам нужно что-то сделать перед сглаживанием массива.

В ES10 были добавлены и другие функции. По этой ссылке вы можете найти более подробную информацию.

Новые функции на стадии 3

На стадии 3 находится несколько интересных функций. Я кратко представлю вам некоторые из них.

Числовые разделители

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

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

await верхнего уровня

await верхнего уровня позволяет модулям выступать в качестве больших асинхронных функций: с помощью await верхнего уровня модули ECMAScript (ESM) могут выделять await ресурсы, заставляя другие модули import ожидать их, прежде чем они начнут оценивать тело.

Мотивация этой функции заключалась в том, что когда у вас есть модуль import, в котором есть функция async, вывод функции async будет undefined.

Здесь у нас есть два файла. Вывод может быть undefined, если вызов выполняется до выполнения задач промисов.

usage.mjs не будет выполнять какие-либо операторы в нем до тех пор, пока await в awaiting.mjs не будут содержать разрешенного промиса.

Нулевое коалесцирование для JavaScript

Это было бы одной из самых полезных функций среди предложений на этапе 3. Мы часто пишем такой код.

JavaScript. Быстрый старт

Изучите основы JavaScript на практическом примере по созданию веб-приложения

Узнать подробнее

Если obj.name ложно, тогда возвращаем ‘Jane’, поэтому undefined не возвращается. Но проблема в том, что в этом случае пустая строка (‘’) также считается ложной. Нам нужно переписать это снова, как показано ниже.

Это довольно утомительно каждый раз писать такой код. Этот оператор позволяет проверить только null и undefined.

Опциональные цепочки

Это предложение идет в паре с нулевым коалесцированием для JavaScript, и особенно для TypeScript. TypeScript объявили, что они включат Нулевое коалесцирование и это предложение в следующую версию, 3.7.0.

Посмотрите на пример кода. Чтобы получить city, который находится в объекте country, нам нужно проверить, существует ли country и существует ли city в country. С помощью Опциональных цепочек этот код может быть реорганизован следующим образом.

Эта функция кажется очень удобной и полезной для такой ситуации.

Promise.any

Promise.any принимает итеруемые промисы и возвращает промис, который выполнен первым итериуемвм промисом, или отклонен с массивом причин отклонения, если все данные промиса отклонены.

С async-await:

С помощью шаблона Promise:

Так как у нас были промисы all, allSettled и race, но не было any, эта функция будет очень полезна для определенных ситуаций.

Тем не менее, это предложение еще не было протестировано, так что может потребоваться больше времени для его принятия в будущей версии ECMAScript.

Заключение

На этапе 3 так много интересных предложений. Мне не терпится увидеть их в ES11 или ES12. Конечно, некоторые мне не понадобятся, но некоторые из них определенно сделают мои коды более элегантными.

Автор: Moon

Источник: https://medium.com

Редакция: Команда webformyself.

JavaScript. Быстрый старт

Изучите основы JavaScript на практическом примере по созданию веб-приложения

Узнать подробнее

Full-Stack практика. Создание JavaScript блога

Создание веб-приложения с нуля на JavaScript, NodeJS, ExpressJS

Смотреть

Метки:

Похожие статьи:

Комментарии Вконтакте:

Комментарии Facebook:

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