Полезные однострочники на JavaScript

Автор статьи, перевод которой мы сегодня публикуем, говорит, что он программирует на 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:

Для того чтобы задавать свойства объектов с использованием оператора&&, можно воспользоваться синтаксисом 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);

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 в нём ещё появятся новые возможности, которые будут способствовать написанию компактного и мощного кода.

Поделится

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

Мы используем cookie-файлы для наилучшего представления нашего сайта. Продолжая использовать этот сайт, вы соглашаетесь с использованием cookie-файлов.
Принять