Замыкание (или closure) — это функция, которая запоминает свою лексическую область видимости в момент создания, что позволяет ей иметь доступ к переменным из внешней области видимости даже после того, как внешняя функция завершила свое выполнение.

🔍Лексическая Область Видимости - означает, что функция имеет доступ ко всем переменным, которые были в ее области видимости в момент создания. Это создает "замкнутую" область видимости, защищая переменные от внешнего доступа.

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

🧐Проще говоря, замыкание - это когда ты создаешь функцию, эта функция видит все, что вокруг нее (в этом же файле, сверху, в компоненте и тд). И если ты эту функцию передашь в другой файл и вызовешь ее там, то эта функция будет знать все те переменные. Вы знаете все улицы своего города, если вы переедете в другой город то вы все равно их будете знать.

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

#JavaScript #ОбучающийПост #замыкание

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

https://youtu.be/G1yPPZ_c8D8

Ближайшие дни контента не будет. Всем отличных выходных! Отдыхать тоже нужно иногда💪🏻
Сегодня стал мужем✌️

Всем привет! Завтра выхожу из отпуска. На выходных ездили с женой в классный отель Movenpick Resort & SPA Anapa.

Это просто шикарный отель с проживанием "Ультра Все включено". В такие моменты я очень сильно вдохновляюсь и мотивируюсь. Если отдыхать, то только в таких отелях, где тебя ждет отличный чистый большой номер, где все продумано до мелочей, высокий уровень сервиса, много услуг.

После каждого своего отпуска, или поездки у меня появляются силы работать, становится лучше, улучшать навыки, что-либо создавать. Я заряжен на 100%.

Хочется прожить лучшую жизнь: покупать только качественные вещи, путешествовать, жить в отличных отелях, в общем, все то, что хочется.

Все это может средний класс. На данный момент большая часть среднего класса – это IT-специалисты. Дизайнеры, программисты, аналитики, тестировщики и т.д., все они имеют хорошую зарплату. Это позволяет жить интересную и насыщенную жизнь.

Все эти возможности должны мотивировать вас, как и меня. А если вы ещё и влюбитесь в это дело, то действительно, вы не будете работать в своей жизни ни дня.

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

P.S На фото я в холле отеля после завтрака записываю идеи для YouTube и телеги

Еще хочу с октября начать новый "Сериал" создавать на чистом js css html приложение, как React Новости. Развивать его, писать всю ту же функциональность и логику но на чистом js.

Так вот, нам нужно выбрать какое приложение мы будем создавать😃

Пишите в комменты свои идеи, я тоже буду накидывать.

На чистом js писать конечно непростая задача, но я понимаю, что вспомнить все и попрактиковаться, углубить свои знания, создавать свои решения для стейт менеджера, роутинга, фреймоврка, очень круто и очень ценится в наше время. А то сегодня много специалистов которые на чистом js по сути и не писали. А это огромный плюс, знание "истоков/основ".

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

Мы - не все. Мы - лучше. Будем с вами параллельно изучению технологий React, Redux, TS, Router (которые нужны для работы) углублять знания и навыки по чистому js. Создавать приложения, как когда то создавали наши коллеги - без готовых инструментов.

https://youtu.be/am_UiIvha5M?si=AgHZITfRhoPLJCPc

Мой курс по React сегодня перешагнул за 1000 просмотров. Кто смотрел? Что я упустил? Все ли понятно было? Я впервые такое длинное видео делал со сценарием. Тяжело было записывать, много информации держал в голове, чтобы все учесть и в нужный момент рассказать

🗺Условные операторы и структуры управления потоком в программировании

Давайте представим, что ваши программируемые инструкции — это навигационные указания, а вы стоите на перекрёстке, выбирая, куда пойти.

1️⃣If-Else
If-else — это как знакомый вам проводник, который подходит к вам и говорит: "Если на улице идёт дождь, то возьмите зонт. В противном случае, если идет снег, наденьте теплую куртку. Иначе просто идите так, как вы одеты сейчас". То есть, этот проводник помогает вам сделать выбор, основываясь на различных условиях, одно за другим.

2️⃣Switch
Теперь переходим к switch. Представьте, что у вас есть большая панель с кнопками, и на каждой кнопке написаны различные метки (case 1, case 2 и так далее). Вы просто ищете нужную метку и нажимаете на соответствующую кнопку, чтобы получить инструкции для этого конкретного случая. Это немного быстрее и организованнее, особенно когда у вас есть много меток, потому что вы можете прямо перейти к нужной, минуя другие.

3️⃣Объектные Литералы
Наконец, объектные литералы можно представить как умный телефон с приложением для навигации. Вам просто нужно ввести свой запрос, и приложение мгновенно предоставит вам правильные указания, без необходимости проверки каждого возможного маршрута или условия. Это потому, что все возможные маршруты уже заранее загружены в приложение, что позволяет быстро и прямо переходить к нужной инструкции.

👍If-else хорош для простых, последовательных проверок условий.

💡Switch делает код чуть более структурированным и удобным для большого количества условий, но всё же требует последовательного просмотра.

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

#ОбучающийПост #JavaScript #объектные_литералы

Помню давно я видел график, который сравнивал скорость выполнения условных операторов if-else, switch и объектных литералов при различном количестве кейсов. По этому графику, до 7 кейсов разница в производительности между switch и if-else была не существенной, но затем обе начинали показывать увеличение времени выполнения. При этом, рост у switch был менее выраженным по сравнению с if-else.

С другой стороны, объектные литералы в этом сравнении изначально шли немного медленнее, но после 7 кейсов их время выполнения оставалось стабильным, не зависимо от того, было ли там 7 или 100000 кейсов. Это делает их потенциально более предпочтительным выбором для ситуаций с большим количеством кейсов.

Я не смог найти его, поэтому нарисовал😃

#ОбучающийПост #JavaScript #объектные_литералы

Тут кстати автор упомянул про Дерево переходов, оптимизацию switch-case

Часть 2

Сейчас же компилятор, когда видит switch использует либо дерево из условных переходов, либо использует таблицу переходов.
С другой стороны, при использовании конструкции switch-case не нужно забывать про особенности работы с ключевыми словами break и default.

Некоторые забывают, например, слово break и в результате имеют некорректное выполнение программы (выполняется не только нужный case, но и последующие, пока не встретится break)
Что еще хочу сказать. switch хорошо работает с константными целыми или перечисленными типами. В этом случае компилятор даже может подсказать, что есть проблема.

🛠 Switch-case действительно имеет оптимизацию.
Компилятор или интерпретатор используют Дерево переходов. Оно позволяет вам мгновенно перейти к правильному кейсу. Это значительно ускоряет процесс поиска, потому, что вы можете пропустить много ненужных кейсов.

Тем не менее, если количество кейсов растет, время на поиск правильного кейса тоже может увеличиваться, хотя, возможно, не так сильно, как с if-else

Что выбирать зависит от задачи.
Если у вас немного вариантов (1-3) то if else
Если у вас 4-7 то имеет место быть switch-case
Если вариантов, условий больше - 8, 9, 12, 20, то возможно ваш выбор это объектный литерал💪

Но опять же даже на 20-50 кейсов, вы сильной разницы не почувствуете, ведь это не значит что if else начнет дико тормозить. Но все мы стараемся по максимому оптимизировать наш код, сделать его чище, быстрее и понятнее.

Дальше расскажу про применение, покажу примеры

1️⃣ Первый пример

В коде создается объект images, где каждому свойству (ключу) присваивается функция, возвращающая JSX элемент (компонент). Это позволяет нам легко и быстро ссылаться на различные компоненты-изображения через этот объект, что может упростить управление вашими изображениями в вашем приложении.

#code #JavaScript #объектные_литералы

2️⃣ Второй пример

Мы используем объектный литерал renderByPage, где каждому ключу соответствует функция, возвращающая соответствующий компонент JSX. Затем, вы динамически выбираете и возвращаете нужный компонент, обращаясь к свойству объекта с использованием переменной page.

Во второй части, мы достигаем того же результата, используя серию if-else условий, чтобы проверить значение переменной page и возвратить соответствующий компонент.

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

#code #JavaScript #объектные_литералы

3️⃣ Третий пример

В версии с объектным литералом, мы создаем объект actions, в котором каждой стране соответствует функция, выводящая в консоль определенное действие, ассоциированное с этой страной. Затем, в функции doAction, мы вызываем соответствующую функцию, используя динамический доступ к свойствам объекта. Это делает код более чистым и легко масштабируемым.

С другой стороны, версия с if-else добивается той же цели, но делает это через серию проверок условий, что может сделать код более громоздким и менее удобным для масштабирования, особенно при добавлении большого количества новых условий или стран.

#code #JavaScript #объектные_литералы

🔍 Сравнение NaN и undefined

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

Самый заметный "подводный камень" - NaN не равно самому себе. То есть, NaN === NaN вернет false.
Для проверки на NaN лучше использовать функцию isNaN().

🔹 undefined — это специальное значение, которое указывает на то, что переменная была объявлена, но не инициализирована значением.

🧐 Строгое сравнение (===)
При строгом сравнении, тип данных и значение обоих операндов должны быть идентичными.

NaN === NaN – вернет FALSE.
undefined === undefined – вернет TRUE.
NaN === undefined – вернет FALSE, так как NaN и undefined являются различными типами данных.

😃 Нестрогое сравнение (==)
Нестрогое сравнение сравнивает значения, но не учитывает типы данных, что может привести к некоторым неожиданным результатам.

NaN == NaN – вернет FALSE, так как NaN не равно ничему, даже самому себе.
undefined == undefined – вернет TRUE.
NaN == undefined – вернет FALSE, несмотря на то, что сравнение не строгое, NaN и undefined остаются неравными.

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

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

Нужна будет максимальная поддержка, хочу продвинуть это видео в топ. Там действительно ответы на волнующие большинство вопросы.

Постарался сделать это видео максимально полезным. Там около 15-18 советов. Все эти советы я сформулировал после встречи с представителями больших компаний, hr и рекрутерами. Они рассказали как происходит найм их глазами, на что они обращают внимание.

Уверен будет интересно и полезно👌🏻😌

Завтра ещё выложу видео продолжение React Новости.
Будет короткая серия с исправлениями.
Добавим слайдер для списка категорий. Будем листать категории стрелочками👌🏻