Что такое замыкания в JavaScript?

Замыкание в JavaScript — это функция, которая «помнит» свою внешнюю область видимости, даже если она выполняется вне неё.

Пример:

function makeCounter() {
let count = 0
return function() {
count++
return count
}
}

const counter = makeCounter()
console.log(counter()) // 1
console.log(counter()) // 2

Здесь внутренняя функция получает доступ к переменной count из makeCounter, хотя та уже завершила выполнение.

Зачем нужно:

— хранить состояние между вызовами без глобальных переменных;
— создавать приватные данные;
— передавать функции с «захваченным» контекстом.

#вопросответ #javascript

«Хватит писать try/catch вокруг fetch: история о том, как я устал ловить ошибки»

Этот мем смешной, пока не осознаешь, что в реальных проектах мы именно так и поступаем. Только заворачиваем не весь код сразу, а каждый HTTP-запрос по отдельности.

Пишешь fetch и рефлекторно добавляешь try/catch. Где-то словил TypeError, где-то таймаут, где-то сервер вернул 500. В итоге половина кода превращается в кашу проверок, а другая половина — в обработчики ошибок. Но проблема не в том, что мы ловим ошибки. Проблема в том, что fetch заставляет нас их ловить везде и всегда.

Библиотека safe-fetch решает эту проблема. Её задача проста: убрать try/catch из проектов навсегда. Как это работает и какие плюсы дает — в материале.

#библиотека #javascript

Делегирование событий в JavaScript: когда обычного всплытия недостаточно

По мере роста фронтенд-приложений управление пользовательскими взаимодействиями становится все более важным. Добавление обработчика событий на каждый интерактивный элемент — плохая практика: это усложняет код, увеличивает расход памяти и снижает производительность. Здесь на помощь приходит делегирование событий (event delegation).

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

#javascript

Деструктуризация в JavaScript

Деструктуризация — это удобный инструмент получения данныхв JS. Он позволяет «распаковывать» сразу много значений из массивов или объектов во множество переменных. Это, например, активно используется в React-хуках.

Простейший пример:

const timers = [10, 20, 30];
const [first, second, third] = timers;

Здесь мы одной строкой задаем значения из массива сразу трём переменным — first, second, third.

Подробнее о возможностях и фишках деструктуризации можно прочитать в этой статье.

#javascript #основы

Современный способ разработки серверов на JS

Ели вы когда-нибудь заходили на главную страницу Node, то наверняка видели этот кусок кода с картинки. Это самый простой веб-сервер, с которого сегодня начинается почти каждый сервер, написанный на JS. Да, это всё может быть прикрыто фреймворком, но по сути, все такие сервера делают примерно одно и то же.

Но сегодня существует более современный способ создания сервера, которому не нужно привязываться к сокету. О нём в этой статье.

#nodejs #javascript #бэкенд

Вам больше не нужен JavaScript

И не потому, что вы будете писать на другом языке. Просто сегодня CSS и HTML могут заменить значительную часть JS-кода. Здесь собраны интересные решения CSS, которые сегодня отлично работают и освобождают вас от необходимости подтягивать различные JS-файлы.

Подробнее.

#фронтенд #безопасность #javascript #css

Практика JavaScript: делаем целый сайт за 2 часа с нуля

Ловите полезный двухчасовой курс по созданию сайта с JavaScript, где вы:

— напишите с нуля приложение, которое сможете добавить в портфолио;
— научитесь настраивать рабочее окружение;
— поймёте зачем на самом деле нужны классы в JavaScript);
— разберётесь как принципы SOLID помогают писать расширяемый и поддерживаемый код;
— поработаете над оптимизацией приложения;
— задеплоите приложение на хостинг и сделаете многое другое.

Видео взято с YouTube, поэтому если предпочитаете смотреть там, то вот ссылка: youtu.be/0ViiJ8qTCFM

#видео #курс #javascript

JavaScript, отдохни! Делаем интерактивные вещи на HTML и CSS

Продолжаем делиться современными возможностями HTML и JS. Здесь собрали ещё пачку кейсов, где вы можете сократить количество JS-кода и облегчить свой сайт.

#javascript #html #css

Кто есть кто: Обратные вызовы, промисы и асинхронные функции

В JavaScript есть темы, которые могут сложно поддаваться пониманию. В этой статье речь как раз пойдёт о таких.

Что это вообще такое? В каких случаях используются? Как работают? Каков их внутренний механизм? В этой статье вы раз и навсегда разберёте суть этих процессов.

#javascript