
Содержание статьи
Альсидес Кейрос
Методы экономии времени, которые используют профессионалы

1. Очистка или сокращение массива
Простой способ очистить или сократить массив без его повторного назначения – это изменить его length
стоимость имущества:
const arr = [11, 22, 33, 44, 55, 66];
// truncantingarr.length = 3;console.log(arr); //=> [11, 22, 33]
// clearingarr.length = 0;console.log(arr); //=> []console.log(arr[2]); //=> undefined
2. Моделирование именуемых параметров с деструктуризацией объектов
Высокая вероятность того, что вы уже используете объекты конфигурации, когда нужно передать набор переменных параметров к определенной функции, например:
doSomething({ foo: 'Hello', bar: 'Hey!', baz: 42 });
function doSomething(config) { const foo = config.foo !== undefined ? config.foo : 'Hi'; const bar = config.bar !== undefined ? config.bar : 'Yo!'; const baz = config.baz !== undefined ? config.baz : 13; // ...}
Это старый, но эффективный шаблон, пытающийся имитировать именуемые параметры в JavaScript. Вызов функции выглядит хорошо. С другой стороны, логика обработки объекта конфигурации слишком многословна. С помощью деструктуризации объектов ES2015 можно избежать этого недостатка:
function doSomething({ foo = 'Hi', bar="Yo!", baz = 13 }) { // ...}
И если вам нужно сделать объект конфигурации необязательным, это тоже очень просто:
function doSomething({ foo = 'Hi', bar="Yo!", baz = 13 } = {}) { // ...}
3. Деструктуризация объектов для элементов массива
Назначить элементы массива отдельным переменным посредством деструктуризации объектов:
const csvFileLine="1997,John Doe,US,john@doe.com,New York";
const { 2: country, 4: state } = csvFileLine.split(',');
4. Переключатель с диапазонами
ПРИМЕЧАНИЕ: Подумав немного, я решил отличить этот трюк от других в этой статье. Это есть НЕТ техника экономии времени, НЕТ подходит ли он для кода реальной жизни. Помни: «Если» всегда лучше в таких ситуациях.
В отличие от других советов в этом сообщении, это скорее любопытство, чем то, что нужно использовать.
во всяком случае, Я оставлю его в этой статье по историческим причинам.
Вот простой трюк для использования диапазонов в операторах switch:
function getWaterState(tempInCelsius) { let state; switch (true) { case (tempInCelsius <= 0): state="Solid"; break; case (tempInCelsius > 0 && tempInCelsius < 100): state="Liquid"; break; default: state="Gas"; }
return state;}
5. Ожидайте несколько асинхронных функций с помощью async/await
Это возможно await
несколько асинхронных функций для завершения использования Promise.all
:
await Promise.all([anAsyncCall(), thisIsAlsoAsync(), oneMore()])
6. Создание чистых объектов
Вы можете создать 100% чистый объект, который не наследует никаких свойств или методов Object
(например, constructor
, toString()
и так дальше).
const pureObject = Object.create(null);
console.log(pureObject); //=> {}console.log(pureObject.constructor); //=> undefinedconsole.log(pureObject.toString); //=> undefinedconsole.log(pureObject.hasOwnProperty); //=> undefined
7. Форматирование кода JSON
JSON.stringify
может сделать больше, чем просто стринговать объект. Вы также можете украсить свой выход JSON с помощью этого:
const obj = { foo: { bar: [11, 22, 33, 44], baz: { bing: true, boom: 'Hello' } } };
// The third parameter is the number of spaces used to // beautify the JSON output.JSON.stringify(obj, null, 4); // =>"{// => "foo": {// => "bar": [// => 11,// => 22,// => 33,// => 44// => ],// => "baz": {// => "bing": true,// => "boom": "Hello"// => }// => }// =>}"
8. Удаление повторяющихся элементов из массива
Используя ES2015 Sets вместе с оператором Spread, вы можете легко удалить повторяющиеся элементы из массива:
const removeDuplicateItems = arr => [...new Set(arr)];
removeDuplicateItems([42, 'foo', 42, 'foo', true, true]);//=> [42, "foo", true]
9. Возведение многомерных массивов
Возведение массивов является тривиальным с помощью оператора Spread:
const arr = [11, [22, 33], [44, 55], 66];
const flatArr = [].concat(...arr); //=> [11, 22, 33, 44, 55, 66]
К сожалению, приведенный выше трюк будет работать только с двумерными массивами. Но с помощью рекурсивных вызовов мы можем сделать его пригодным для массивов с более чем 2 измерениями:
function flattenArray(arr) { const flattened = [].concat(...arr); return flattened.some(item => Array.isArray(item)) ? flattenArray(flattened) : flattened;}
const arr = [11, [22, 33], [44, [55, 66, [77, [88]], 99]]];
const flatArr = flattenArray(arr); //=> [11, 22, 33, 44, 55, 66, 77, 88, 99]
И вот оно! Я надеюсь, что эти маленькие уловки помогут вам писать лучший и более красивый JavaScript.