Компонент высшего порядка (Higher-Order Component, HOC) — это один из продвинутых способов для повторного использования логики. HOC не являются частью API React, но часто применяются из-за композиционной природы компонентов.

Говоря просто, компонент высшего порядка — это функция, которая принимает компонент и возвращает новый компонент.

#react #hoc #ОбучающийПост #live

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

1️⃣ Типы Событий
События могут быть разных типов, в зависимости от взаимодействия пользователя с веб-страницей. Это могут быть клики мыши, нажатия клавиш, движения курсора и многие другие.

2️⃣ Обработчики Событий
Обработчики событий — это функции, которые вызываются, когда происходит определенное событие. Они могут быть назначены конкретным элементам или всей странице.

3️⃣ Делегирование Событий
Делегирование событий позволяет назначить один обработчик событий родительскому элементу, а затем управлять дочерними элементами. Это упрощает управление событиями, особенно когда элементов много.

4️⃣ Поведение По Умолчанию
Некоторые события включают в себя стандартное поведение браузера, например, переход по ссылке при клике на нее. Это поведение может быть переопределено или отменено.

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

6️⃣ Объект События
Когда срабатывает обработчик события, ему передается объект события, содержащий информацию о событии, такую как тип события, целевой элемент и другие детали.

7️⃣ Совместимость Браузеров
Разные браузеры могут по-разному обрабатывать события. Учитывание этой совместимости может быть важным для обеспечения корректной работы на всех платформах.

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

#JavaScript #ОбучающийПост #DOM

Обработка Событий в JavaScript

#code #JavaScript #DOM

Обработка событий в JavaScript (1)

#code #JavaScript #DOM

Где брать опыт джуниору? Нужно ли подтверждать опыт? Нужен ли официальный опыт работы?

#live #junior #hr #work

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

1️⃣Всегда возвращает один и тот же результат для одинаковых аргументов. Если вы передадите одни и те же аргументы, вы всегда получите один и тот же результат.

2️⃣Не имеет побочных эффектов. Это значит, что функция не взаимодействует с внешним миром: не меняет глобальные переменные, не работает с вводом/выводом и т.д.

Почему чистые функции важны?

🔑Тестируемость: Чистые функции легко тестировать, так как для одних и тех же аргументов они всегда возвращают один и тот же результат.

👍Понятность: Они делают код более понятным и предсказуемым, уменьшая возможность ошибок.

🌍Параллелизм: Они могут быть легко выполнены параллельно, так как не взаимодействуют с внешним состоянием.

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

#JavaScript #ОбучающийПост

Примеры чистых и нечистых функций

#code #JavaScript

Если вы хотите углубить свои знания в JavaScript и по-новому взглянуть на этот язык, рекомендую обратить внимание на серию книг "Вы не знаете JS" от Кайла Симпсона. Это настоящая сокровищница знаний для каждого, кто работает с JS.

1️⃣Введение в программирование. Идеальное начало для новичков и хорошее освежение для опытных.

2️⃣Область видимости и замыкания. Познайте, как JavaScript видит ваш код, и разберитесь с самыми сложными аспектами.

3️⃣this и Прототипы Объектов. Глубокое погружение в одну из самых запутанных особенностей JS.

4️⃣Типы и грамматика. Узнайте все тонкости типов данных и их преобразований.

5️⃣Асинхронность и Производительность. Освойте механику асинхронных операций и узнайте, как заставить JS работать ещё быстрее.

6️⃣ES6 и не только. Изучите новейшие возможности языка, которые делают кодирование в JS ещё удобнее и мощнее.

Эта серия книг может стать вашим ключом к глубокому пониманию JavaScript. Удачного чтения и новых открытий! 🚀📖

#JavaScript #book #post

Для начала в самый раз) всего 65 страниц

Вы когда-нибудь сталкивались с ситуацией, когда нужно было обрабатывать события множества элементов на странице? Делегирование событий — это решение этой задачи, которое сделает ваш код гораздо проще и эффективнее.

💡 Что такое делегирование событий?

Это техника, при которой вы не привязываете обработчик события к каждому элементу отдельно. Вместо этого, вы назначаете один обработчик для их общего родителя. Когда событие происходит, вы можете определить, на каком именно элементе оно случилось, используя event.target.

📌 Как это работает?

Назначьте обработчик события контейнеру (родителю).
Когда событие произойдёт, через event.target вы узнаете, на каком дочернем элементе оно случилось.
Обработайте событие нужным образом.

🥇 Преимущества делегирования:

1️⃣Экономия ресурсов: один обработчик вместо многих.

2️⃣Гибкость: легко добавлять и удалять элементы без изменения обработчиков.

3️⃣Упрощение кода: при массовых изменениях элементов можно просто обновить innerHTML.

В следующий раз, когда вы столкнетесь с необходимостью обработки событий на многих элементах, помните о делегировании. Это упростит вашу жизнь и сделает код чище! 🚀

#JavaScript #ОбучающийПост #делегирование

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

#JavaScript #code #делегирование

Если у нас будет 1000 элементов списка, то мы создадим 1000 обработчиков, что может стать причиной замедления работы страницы. При использовании делегирования, независимо от количества элементов, у нас будет только один обработчик на родительский элемент. Это делает код более производительным и легко масштабируемым.

#code #JavaScript #делегирование

Вышло новое видео. В этом видео мы добавляем Скелетон и отслеживваем статус загрузки новостей. Так же работаем в таск менеджере, работаем с гитом (ветки, ПР, мердж).
https://youtu.be/FeDSumhe0kQ

На выходных выйдет еще одно видео с пагинацией. Будем дозировать контент с сервера, переключать страницы. Собственно для этого мы и делали скелетон, чтобы при переключении страниц и получении новых новостей наш контент не скакал😄

Нативные и Host-объекты

1️⃣Нативные объекты:

Это основные "строительные блоки" языка JavaScript, которые всегда доступны, независимо от того, где вы запускаете свой код.

🔹Object: Основной объект, на котором построено большинство других объектов.
🔹Date: Объект для работы с датами и временем.
🔹Math: Предоставляет математические функции и константы.
🔹parseInt, eval: И другие глобальные функции и свойства.

Преимущества нативных объектов:

📖Они являются частью стандарта ECMAScript и предоставляют основные функции языка.
🔑Где бы вы ни запускали код на JavaScript, нативные объекты будут доступны.

2️⃣Host-объекты (или объекты хоста):

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

Примеры в браузерной среде:

🔹window: Глобальный объект для браузера.
🔹document: Объект, представляющий текущую веб-страницу.
🔹XMLHttpRequest: Для выполнения асинхронных запросов к серверу.
🔹setTimeout: Позволяет выполнять код через заданный интервал времени.

Что нужно знать про host-объекты:

🛠Они могут сильно отличаться в разных средах выполнения. Например, в Node.js будут другие host-объекты, чем в браузере.
📌Они дополняют возможности языка в конкретной среде, предоставляя доступ к уникальным для этой среды функциям.

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

#ОбучающийПост #JavaScript #Objects

Хочу вам посоветовать очень крутой ресурс для обучения JavaScript. Это онлайн учебник

https://learn.javanoscript.ru

Этот учебник всегда в моем браузере во вкладках и в свободное время я перечитываю темы.

Тут вся актуальная теория, так как учебник постоянно обновляется и дополняется. ✅

#book #JavaScript