Компьютерная Академия IT STEP - полноценное IT-образование‎ для взрослых и детей. Мы обучаем с 1999 года. Авторские методики, преподаватели-практики, 100% практических занятий.

Ваш браузер устарел!

Вы пользуетесь устаревшим браузером Internet Explorer. Данная версия браузера не поддерживает многие современные технологии, из-за чего многие страницы сайта отображаются некорректно, и могут работать не все функции. Рекомендуем просматривать сайт с помощью актуальных версий браузеров Google Chrome, Safari, Mozilla Firefox, Opera, Microsoft Edge

ШАГ логотип

6 лайфхаков по улучшению кода JavaScript

IT STEP Academy

Программирование

18.07.2022

171 просмотр

Язык JavaScript уже давно занимает своё место в среде программированию, ни одна фронтенд разработка не обходится без него. Многие веб-специалисты пользуются им каждый день.

Изучение JavaScript помогает создать самые замысловатые программы и приложения без особых усилий. Для среднестатистического разработчика этот язык – простейший инструмент.

Сегодня дадим несколько советов, которые облегчат работу с  JavaScript.

Оператор нулевого слияния

Это абсолютно новый логический оператор, который выполняет следующую функцию: при операнде левой части, которая равна «null» или «undefined», операнд правой части будет возвращен.

Если же нужно восстановить значение по умолчанию, то можно пользоваться как раз оператором нулевого слияния «??» или же «/ /».
Также можно использовать функциональное наследование js при возврате к исходному коду.
Оператор нулевого слияния вместе с «/ /» находится на четвёртом приоритетном месте, непосредственно перед ним следует тернарный оператор.

Выглядит это так:

Promise.allSettled()

Промис в javascript – это объект, который хранит свое состояние, текущий результат и возвраты.

В чём заключается помощь от Promise.allSettled()? Дело в том, что исполнение промисов можно было проследить благодаря Promise.all(), но именно Promise.allSettled() помогает отсортировать результаты исполнения. То есть данный метод показывает наборы промисов, можно увидеть, какие из них выполнены, а какие нет.

Работает данная функция следующим образом:

Spread-операторы

Spread-операторы объединяют массивы. Если нужно объединить какие-то объекты, тоже можно использовать оператор Spread.

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

Если раньше для этой цели прописывали javascript array, то сейчас это можно сделать гораздо проще:

Опциональные последовательности

Они сокращают код и упрощают его, указывая на существование значения в объекте. Это, так называемое, дополнение к javascript, не очень существенное, но, если нужно упростить код, то очень полезное.

Так как это максимально безопасный способ доступа к объектам, то фронтенд-разработчики пользуются им довольно часто.

Ну, и javascript jquery никто не отменял. Эта библиотека с набором функций js также помогает с упрощением кода, что сокращает работу с любым элементом DOM.

Как работает опциональная последовательность, можно увидеть на вот таком примере:

Динамический импорт

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

Динамический импорт работает в обычных скриптах, он не требует указания script type="module".

По сути это происходит так:

Деструктуризация объекта

Суть деструктуризации объектов заключается в распаковке значения из объекта. Это синтаксис, который распакованное значение записывает в новую переменную с упрощенным кодом.

Деструктуризация в js разбивает объекты или массивы на переменные при присвоении, поэтому такой лайфхак будет полезен при более сложных процессах.

Хотя код javascript не такой уж и сложный, но некоторые секреты во время работы с ним использовать будет полезно.

В любом случае эти лайфхаки пригодятся, если используете функциональное программирование javascript.

На курсах разработчиков в Академии IT STEP учат не только создавать полноценное ПО, но и использовать лайфхаки в программировании, которые пригодятся в будущем профессиональному программисту.

Записаться на курсы по программированию можно здесь. Менторы - мастера своего дела, проведут вас в мир программирования и помогут получить прибыльную и популярную профессию!
 



АВТОР:

IT STEP Academy

Образование - это то, что остаётся после того, как забывается всё выученное в школе - Альберт Эйнштейн

Графика и дизайн

Как создать инфографику для сайта или соцсетей

Инфографики проще представляют информацию: отчёт для коллег и руководителя, тезисы статьи для аудитории или рекламное предложение — в таргете или другой рекламе.

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

ШАГ логотип

Маркетинг

Что такое контент-план и как его правильно составить

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

Контент-план помогает вести соцсети и добиваться больших результатов, а сделать его не так сложно, как может показаться. В статье разберёмся с контент-планами раз и навсегда, подготовим свой или переделаем пример под идею маркетолога или клиента.  Что такое контент-план и зачем он нужен Контент-план — это график публикаций для любого блога: на сайте, в социальных сетях. Часто к графику добавляют типы публикаций, темы и наброски по контенту — чтобы проще вести и заполнять. Обычно контент-план делают в виде таблицы или карточек с задачами,

ШАГ логотип

Программирование

Ещё не знакомы с GitHub? — Почему нужно создать аккаунт прямо сейчас

В 2022 году GitHub объединил 83 миллиона разработчиков. Сайт используют как портфолио, место для совместной работы, форум. В статье рассказываем — что такое GitHub, и почему каждый программист должен работать с сайтом чаще, чем открывать Instagram.

В 2022 году GitHub объединил 83 миллиона разработчиков. Сайт используют как портфолио, место для совместной работы, форум. В статье рассказываем — что такое GitHub, и почему каждый программист должен работать с сайтом чаще, чем открывать Instagram. GitHub — это хостинг для кода и тусовка программистов Гитхаб придумали в 2008 году как площадку для разработки проектов: приложений, сайтов или чат-ботов. С 2019 года сайт предлагает программистам размещать код в открытом и закрытом доступе. Компании, команды и фрилансеры бесплатно могут загружать код, как файлы н

ШАГ логотип

Soft Skills

Аналитическое мышление в IT: почему это не талант, а необходимый навык

По данным Work Styles, аналитическое мышление набирает 97 баллов из 100 по востребованности в IT-профессиях. Думать глубоко и разбираться в задачах — это талант или натренированная привычка?

По данным Work Styles, аналитическое мышление набирает 97 баллов из 100 по востребованности в IT-профессиях. Думать глубоко и разбираться в задачах — это талант или натренированная привычка? Разбираемся с помощью исследований и работ Нобелевского Лауреата — Даниэля Канемана. Что такое аналитическое мышление Понять, почему в одних ситуациях мы решаем быстро, а в других нужно долго думать, поможет общая концепция мышления по по Даниэлю Канеману. Мозг человека работает в двух системах мышления: быстром (Система 1) и медленном (Система 2). Быстрая с

ШАГ логотип

Online ITStep

Интересно просмотреть истории наших выпускников?

Узнать больше