Сделайте свой JavaScript более читабельным и расширяемым с помощью этих советов по коду.
предисловие
Есть много способов оптимизировать код JavaScript. В этой статье приведены 8 приемов JavaScript, которые я часто использую в своей работе. Надеюсь, она поможет и вам.
1. Сократите код «если… иначе лапша»
Мы должны подумать о том, есть ли лучший способ оптимизации при написании более двух if ... else. Например, нам нужно рассчитать цену гамбургера по его названию. Вы могли бы сделать это.
При таком написании будет много условных утверждений, и когда мы хотим добавить новую еду, нам нужно добавить в функцию оператор if...else. О, это слишком больно.
Лучший способ
Это очень классическая оптимизация, мы можем использовать карту, чтобы сохранить всю еду.
2. Используйте «filter" and "map”» вместо «for” петель»
Теперь, если бы вас попросили найти еду, принадлежащую к группе 1, как бы вы ее нашли?
Вот данные
Вышеупомянутый метод часто используется. Очевидно, что замена filter и map может не только упростить код, но и сделать семантику более понятной.
3. Поменяйте местами два значения, используя деструктурирование
Теперь у меня есть гамбургеры, а у тебя есть шоколад. Мы хорошие друзья и хотим обмениваться едой. Как мы обычно это делаем?
Лучший способ
Мы можем использовать присваивания деструктуризации массива, чтобы упростить обмен едой.
4. Умные записи объектов
Что делать, если вы хотите узнать название и цену продуктов на складе?
Общий способ
Используйте for in для перебора foodMap, но также печатается '🌭', чего мы не хотим видеть.
Лучший способ
Использование Object.entries имеет как минимум два преимущества:
- Печатаются только свойства объекта, свойства прототипа игнорируются.
- Получите значение объекта напрямую вместо использования
obj[key]для его чтения.
5. Простой способ сгладить массив
Там какой-то беспорядок с едой, как мы можем положить их в корзину? Если [] это корзина.
Первый способ
Второй способ
У вас есть более короткий способ добиться этого? Да, мы можем использовать [].flat, более простой и умный способ.
Использование Infinity означает, что нам все равно, на скольких уровнях вложена пища.
6. Трюк с округлением
Ничего себе, это Хэллоуин, и чтобы отпраздновать праздник, вся еда уценена, а десятичные дроби стерты.
Мы можем использовать Math.floor, но есть ли более простой способ? Как насчет оператора ~~?
7. Используйте reduce для вычисления суммы
Теперь клиент купил много вещей. Мне нужно знать, сколько он должен заплатить.
Возможно, вы сделаете это следующим образом:
Лучший способ
Написание, подобное приведенному выше, может достичь цели, но объем кода все еще слишком велик, у нас есть более простой способ.
8. Используйте console.table вместо console.log
Мы часто используем console.log для вывода некоторой информации, но иногда это не так интуитивно понятно.
Let's try console.table
👏🏻 Выглядит как таблица, просто и понятно.
Окончательно
Мы с нетерпением ждем ваших дополнительных советов по коду JavaScript. Спасибо, что прочитали.
Дополнительные материалы на PlainEnglish.io. Подпишитесь на нашу бесплатную еженедельную рассылку новостей. Подпишитесь на нас в Twitter, LinkedIn, YouTube и Discord .
Заинтересованы в масштабировании запуска вашего программного обеспечения? Ознакомьтесь с разделом Схема.
