Возможности JavaScript, о которых я не знал

На днях я читал материалы на MDN и наткнулся на некоторые довольно интересные возможности и API JavaScript, о существовании которых я не знал. Хочу сегодня о них рассказать.

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

Метки

Метки можно назначать циклам for или блокам кода в JS… А вы не знали? Я — так точно этого не знал. Затем на эти метки можно ссылаться и использовать команды break или continue в циклах for, а также применять команду break в блоках кода.

Вот пример именования блоков с помощью меток. С такими метками можно использовать лишь оператор break.

Оператор void

Я полагал, что мне знакомы все операторы JavaScript до тех пор пока не увидел оператор void, который, как оказалось, присутствует в JS с 1996-го года. Его поддерживают все браузеры, работает он довольно просто. Вот что пишут об этом на MDN:

Оператор void вычисляет переданное выражение и возвращает undefined.

Этот оператор позволяет, например, использовать альтернативную форму конструирования IIFE:

По поводу void можно сделать лишь одно замечание, которое заключается в том, что вычисление выражения это… void (undefined)!

Оператор void можно использовать с ключевым слово async, затем полученная конструкция способна сыграть роль асинхронной точки входа в код:

Оператор «запятая»

После того, как я почитал про оператор «запятая», я понял, что я не в полной мере понимал то, как именно он работает. Вот цитата из MDN:

Оператор запятая выполняет каждый из его операндов (слева направо) и возвращает значение последнего операнда.

Оператор «запятая» и условный оператор

В условном операторе последнее значение в операторе «запятая» становится возвращаемым значением. Поэтому можно поместить до этого оператора любое количество выражений. В следующем примере я разместил команду console.log перед возвращаемым логическим значением:

API интернационализации

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

Оператор конвейера

Оператор конвейера, на момент написания этого материала, поддерживается лишь в Firefox 58+, да и то, его нужно включать, используя специальный флаг. Однако, в Babel уже имеется предложение по этому поводу. Код с таким оператором выглядит как Bash-команды, и мне это нравится!

Возможности, о которых стоит упомянуть

Атомарные операции

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

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

Мне очень нравятся атомарные операции в других языках вроде Java. Я полагаю, такие операции будут чаще использоваться в JS, когда всё больше и больше программистов будет использовать веб-воркеры для того, чтобы выносить в них тяжёлые вычисления из главного потока.

Метод Array.prototype.reduceRight

Мне никогда не доводилось видеть, чтобы на практике кто-то использовал метод Array.prototype.reduceRight(), так как он представляет собой комбинацию Array.prototype.reduce() и Array.prototype.reverse(). Дело в том, что подобное нужно очень редко. Однако, если вам это необходимо, reduceRight() отлично вам подойдёт.

Параметры setTimeout()

Вероятно, были в моей жизни несколько ситуаций, когда я мог бы избавиться от .bind(…), если бы знал о параметрах setTimeout(), которые, как оказалось, JS поддерживал всегда.

Свойство HTMLElement.dataset

Я уже работал с пользовательскими атрибутами данных data-* в HTML-элементах, но я не знал о том, что имеется API, значительно упрощающее работу с ними. Помимо некоторых ограничений по именованию (подробности смотрите по вышеприведённой ссылке), такая работа, в целом, сводится к использованию имён с чёрточками для атрибутов и имён в верблюжьем стиле для обращения к ним из JS. В результате атрибут data-birth-planet виден в JS как birthPlanet.

А вот как с этим работать из JS:

Итоги

Надеюсь, в рассказе о неизвестных мне возможностях JavaScript вы нашли что-то новое и для себя.