13 полезных однострочников на JavaScript

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



Здесь представлено 13 однострочников. Примеры подготовлены с использованием Node.js v11.x. Если вы будете использовать их в другой среде — это может повлиять на их выполнение.

1. Приведение значений к логическому типу

Вот как привести некое значение к логическому типу:

const myBoolean = !!myVariable;

Двойное отрицание (!!) нужно для того, чтобы значение, являющееся с точки зрения правил JavaScript истинным, было бы преобразовано в true, а ложным — в false.

2. Избавление от повторяющихся значений в массивах

Вот как удалить из массива повторяющиеся значения:

const deDupe = [...new Set(myArray)];

Структуры данных типа Set хранят лишь уникальные значения. В результате использование такой структуры данных и синтаксиса spread позволяет создать на основе массива myArray новый массив, в котором нет повторяющихся значений.

3. Создание и установка свойств объектов по условию

Для того чтобы задавать свойства объектов с использованием оператора &&, можно воспользоваться синтаксисом spread:

const myObject = { ...myProperty && { propName: myProperty } };

Если в результате вычисления левой части выражения будет получено нечто, воспринимаемое JS как ложное значение, то && не будет проводить дальнейшие вычисления и новое свойство не будет создано и установлено. Объект myObject будет пустым. Если же конструкция ...myProperty вернёт какой-то результат, воспринимаемый JS как истинный, благодаря конструкции && в объекте появится свойство propName, хранящее полученное значение.

4. Слияние объектов

Вот как можно создать новый объект, в котором будут скомбинированы два других объекта:

const mergedObject = { ...objectOne, ...objectTwo };

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

5. Обмен значений переменных

Для того чтобы обменять значения между двумя переменными без использования вспомогательной переменной можно поступить так:

[varA, varB] = [varB, varA];

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

6. Удаление ложных значений из массива

Вот как можно убрать из массива все значения, которые считаются в JavaScript ложными:

const clean = dirty.filter(Boolean);

В ходе выполнения этой операции из массива будут удалены такие значения, как null, undefined, false, 0, а так же пустые строки.

7. Преобразование чисел в строки

Для того чтобы преобразовать числа, хранящиеся в массиве, в их строковое представление, можно поступить так:

const stringArray = numberArray.map(String);

Строковые элементы массива в ходе подобного преобразования так и останутся строковыми.

Можно выполнить и обратное преобразование — преобразовав значения типа String к значениям типа Number:

const numberArray = stringArray.map(Number);

8. Извлечение значений свойств объектов

Вот как можно извлечь значение свойства объекта и записать его в константу, имя которой отличается от имени этого свойства:

const { original: newName } = myObject;

Благодаря использованию этой конструкции будет создана новая константа, newName, в которую будет записано значение свойства original объекта myObject.

9. Форматирование JSON-кода

Вот как можно преобразовать JSON-код к виду, удобному для восприятия:

const formatted = JSON.stringify(myObj, null, 2);

Метод stringify принимает три параметра. Первый — это JavaScript-объект. Второй, необязательный, представляет собой функцию, которую можно использовать для обработки JSON-кода, получающегося в ходе преобразования объекта. Последний параметр указывает на то, сколько пробелов нужно использовать при формировании отступов в JSON-коде. Если опустить последний параметр, то весь полученный JSON-код будет представлять собой одну длинную строку. Если в объекте myObj есть циклические ссылки, преобразовать его в формат JSON не удастся.

10. Быстрое создание числовых массивов

Вот как можно создать массив и заполнить его числами:

const numArray = Array.from(new Array(52), (x, i) => i);

Первый элемент такого массива имеет индекс 0. Размер массива можно задавать как с помощью числового литерала, так и с помощью переменной. Здесь мы создаём массив из 52 элементов, который, например, можно использовать для хранения данных о колоде карт.

11. Создание кодов для двухфакторной аутентификации

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

const code = Math.floor(Math.random() * 1000000).toString().padStart(6, "0");

Обратите внимание на то, что количество нулей в числе, на которое умножается результат, возвращаемый Math.random(), должно соответствовать первому параметру (targetLength) метода padStart.

12. Перемешивание массива

Для того чтобы перемешать массив, не зная при этом о том, что именно в нём содержится, можно сделать так:

myArray.sort(() => { return Math.random() - 0.5});

Существуют и более качественные алгоритмы для перемешивания массивов. Например — алгоритм тасования Фишера-Йетса. Почитать о разных алгоритмах для перемешивания массивов можно здесь.

13. Создание глубоких копий объектов

Предлагаемый здесь метод глубокого копирования объектов не отличается особенно высокой производительностью. Но если вам нужно решить эту задачу с использованием однострочника — можете воспользоваться следующим кодом:

const myClone = JSON.parse(JSON.stringify(originalObject));

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

Мелкую копию объекта можно создать с помощью синтаксиса spread:

const myClone = { ...orignalObject };

Итоги: о комбинировании и расширении кода однострочников

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

Уважаемые читатели! Какими примерами полезных JS-однострочников вы дополнили бы этот материал?