Руслан Куянец | Reactify

Вообще собеседования - это большая тема. Когда я провожу собесы, я стараюсь больше спросить про опыт, про проекты. Задаю лайтовые вопросы. Но бывают прогеры с 2мя годами опыта, которые собесят сеньоров 6+ и душнят так, как-будто они лично JavasScript изобрели и со школы прогеры. Везде своих чсв хватает😅

Записал небольшое видео про собеседования. Могу пройтись подробнее по вопросам

В первом примере используется обычная функция, и this внутри setInterval не ссылается на экземпляр Person. По умолчанию (в строгом режиме) this будет undefined, а в нестрогом — глобальный объект. Поскольку undefined не имеет свойства age, попытка инкрементировать его приведет к NaN Во втором примере используется стрелочная функция, которая не имеет собственного this. Она "позаимствует" его из окружающего контекста, в данном случае из функции-конструктора Person. Это означает, что this.age будет корректно инкрементироваться каждую секунду, и в консоль будет выводиться возраст Person, который увеличивается на 1 каждую секунду. #code #JavaScript #functions #this

Стрелочные и обычные функции в JavaScript Обычные функции Синтаксис: Обычные функции имеют более развернутый синтаксис. Они могут быть объявлены с использованием ключевого слова function. function greet(name) { return "Hello, " + name + "!"; } Контекст this: У обычных функций свой собственный контекст this. Это может вызвать проблемы с потерей контекста. Использование: Они обычно используются, когда нужно создать метод объекта или конструктор. Стрелочные функции Синтаксис: Стрелочные функции имеют более короткий, сжатый синтаксис. Они объявляются с использованием символа "стрелки" =>. const greet = (name) => "Hello, " + name + "!"; Контекст this: Стрелочные функции не имеют собственного контекста this. Они захватывают его из об surrounding кода, что делает их удобными для работы с контекстом. Использование: Они идеально подходят для коротких функций и методов, где контекст this должен оставаться неизменным. ОСНОВНЫЕ РАЗЛИЧИЯ Синтаксис: Стрелочные функции более лаконичные. Контекст this: Обычные функции имеют свой this, в то время как стрелочные функции наследуют this от surrounding кода. Конструкторы: Стрелочные функции не могут быть использованы как конструкторы и вызваны с использованием new. Arguments объект: Обычные функции имеют arguments объект, но стрелочные функции его не имеют. #обучающийПост #JavaScript #functions

Как вам джунгли?😄 до 12 ночи переезжали вчера😬

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

Небольшой анализ IT рынка, Frontend разработчик #job #hh

🤔 выводы делайте сами 😁

Всем привет. Беру недельный контент-перерыв. Видео в YouTube не будут выходить. Займусь переездом и обустройством нового жилища. В свободное время буду писать сценарий, готовить слайды и примеры. По максимуму подготовлюсь к съёмкам и выпущу лучший видео курс по TypeScript. Как минимум постараюсь😄 Посты в тг канале в штатном режиме✊🏼 Запишу возможно пару небольших видео сюда.

Совмещаю переезд, сбор вещей с написанием сценария✌️ Завтра хочу приступить к съёмкам. Ребята, столько всего выписал, такие конспекты. Это просто… я сам некоторых вещей не знал. Так же анализировал видео других авторов (даже по которым я учился) и понял, что их курсы на тройку. Постараюсь записать достойное видео. Главное правильно сложить все в голове и не запутаться, не скомкать, красиво и грамотно изложить. Короче, считаю это своим долгом. Пожелайте удачи 🤞

На канале новое видео. Оно короткое, я в нем просто меняю расширения файлов. Следующее видео постараюсь сделать курс по TypeScript! На выходных переезжаю в новое жилье, НО постараюсь записать видео

Рекурсия в программировании Рекурсия - это концепция в программировании, когда функция вызывает саму себя в своём теле. Она часто используется для решения задач, которые можно разбить на более мелкие подзадачи одного и того же типа. Принцип работы ❗️Базовый случай: Каждая рекурсивная функция имеет базовый случай - условие, при выполнении которого рекурсия останавливается, и функция перестает вызывать саму себя. Это очень важно так, как если условия нет или оно не правильное, функция будет бесконечной! 💡Рекурсивный случай: Если базовый случай не выполнен, функция входит в рекурсивный случай, вызывая саму себя и, возможно, изменяя передаваемые параметры. Важно понять логику работы рекурсии, как вообще работает и как правильно делать. Пример с факториалом Факториал числа - это произведение всех положительных целых чисел от 1 до самого числа. Факториал 5, обозначаемый как 5!, равен 1 * 2 * 3 * 4 * 5 = 120. Рекурсивная функция для расчета факториала: function factorial(n) { if (n === 0) { // базовый случай return 1; } else { // рекурсивный случай return n * factorial(n - 1); } } console.log(factorial(5)); // выводит 120 #JavaScript #обучающийПост #рекурсия #factorial

Функция для глубокого копирования объектов 1️⃣ Проверка наличия и типа объекта Проверяем, существует ли obj и является ли он объектом. Если obj равен null или его тип данных не 'object', функция возвращает obj, не производя дополнительных действий. Здесь мы гарантируем, что функция будет применена только к объектам или массивам. 2️⃣ Обработка массивов Устанавливаем, является ли obj массивом. Создаем новый пустой массив arrCopy и проходим по всем элементам obj. Примитивные значения копируются напрямую, а для объектов вызывается функция deepClone рекурсивно. Этот этап обеспечивает глубокое копирование каждого элемента массива, включая вложенные объекты и массивы. 3️⃣ Обработка объектов Если obj не массив, но объект, начинаем процесс копирования объекта. Создаем пустой объект objCopy. Для каждого свойства obj, проверяем, является ли оно собственным с помощью метода hasOwnProperty. Собственные свойства копируются. Если значение свойства - объект, функция deepClone вызывается рекурсивно. Так мы гарантируем, что все собственные свойства объекта, включая вложенные объекты, будут глубоко скопированы. #JavaScript #code #Objects #deepCopy

Способы копирования объектов в JavaScript[2] 🔍 Глубокое копирование - это создание дубликата исходного объекта, при этом копируются не только сам объект и его примитивные свойства, но и все вложенные объекты, массивы, функции, и другие ссылочные типы данных. Это означает, что каждый элемент исходного объекта, включая все уровни вложенности, будет скопирован в новый, независимый объект. Таким образом, изменения в копии не повлияют на исходный объект и наоборот. Допустим, у нас есть объект машины: const car1 = { brand: "Toyota", model: "Camry", owner: { name: "Ruslan", passport: "AB123456" } }; Если мы попробуем просто скопировать этот объект, то получим новую машину, НО владельцем будет все тот же Ruslan с паспортом AB123456. То есть, если мы решим поменять имя владельца car2, то имя владельца car1 также изменится, потому что оба объекта ссылаются на один и тот же объект владельца. Один из способов сделать глубокую копию: const stringObj = JSON.stringify(car1); const car3 = JSON.parse(stringObj); Логика такая, что мы объект сначала превратили в строку, разумеется тут не может идти речи о сохранении ссылок. Далее мы эту строку преобразуем обратно в объект. На выходе получаем глубокую копию исходного объекта. Это подход работает в большинстве случаев, НО стоит знать, что он имеет свои ограничения. Например, он не сможет корректно скопировать функции и объекты, содержащие циклические ссылки, поскольку JSON не поддерживает эти структуры данных. Так же если объект содержит свойства со значением undefined, то они будут пропущены в строковом представлении. #JavaScript #обучающийПост #Objects #clone #copy #deepCopy

Способы копирования объектов в JavaScript[1] 📷 Поверхностное копирование — это процесс создания нового объекта, который является копией оригинального объекта с тем исключением, что вложенные объекты или массивы не копируются. Вместо этого, копируются только ссылки на них. Оператор spread: const car1 = { brand: "Toyota", model: "Camry" }; const car2 = {...car1}; Ручное копирование: const car1 = { brand: "Toyota", model: "Camry" }; const car2 = { brand: car1.brand, model: car1.model }; Object.assign(): const car1 = { brand: "Toyota", model: "Camry" }; const car2 = Object.assign({}, car1); #JavaScript #обучающийПост #Objects #clone #copy #shalowCopy

Копирование объектов в JavaScript Как же всё-таки скопировать объект, чтобы он не ссылался на самого себя? const car1 = { brand: "Toyota", model: "Camry" }; const car2 = car1; Если мы присвоим одну переменную другой, обе переменные будут указывать на один и тот же объект. Это как если бы у нас была одна машина, и мы дали бы ключи от неё другу. Машина по-прежнему одна, но ей пользуются оба человека. Если один что-то изменит в этой машине, то другой тоже заметит это изменение. Что же делать? Мы можем "купить" другу точно такую же машину, и тогда они будут похожи, но разными: const car1 = { brand: "Toyota", model: "Camry" }; const car2 = {...car1}; В этом примере мы "покупаем" новую машину, создавая новый объект, и копируем в него все характеристики из первой машины (друг пошёл и заказал машину, основываясь на детальных фотографиях вашего автомобиля). Теперь это два абсолютно разных объекта. ОДНАКО это сработает, если в объекте нет вложенных объектов. Вложенный объект - это как бардачок в машине. Продавцы в автосалоне не знают, что лежит в вашем бардачке, и они не смогут скопировать его содержимое, а просто укажут на бардачок друга (сделают ссылку) и у вас будет два одинаковых бардачка, если вы что-то заберете из него, то это пропадет и у друга. #JavaScript #обучающийПост #Objects #clone #copy

Таймкоды с моего видео про поиск работы. Достаточно много вопросов разобрал. Дал много советов. О многом со встречи узнал впервые 0:00 - Вступление. О мероприятии. 0:45 - Работа HR 1:26 - Сколько времени на 1 резюме 1:33 - Первый отбор 3:03 - Что писать в резюме 4:05 - Отклик на вакансию. Сопроводительное письмо 5:26 - Социальные сети 6:14 - Шаблон резюме. Важно! 7:04 - Опыт работы. Его отсутствие 8:25 - Где взять опыт 10:28 - Где практиковаться 11:15 - Проверяют ли ваш опыт 12:22 - Соотношение вакансий 13:00 - Нехватка специалистов 13:25 - О знаниях джунов. Собеседования 15:46 - Про активность, стажировки, мотивацию 17:28 - Мероприятия. IT сообщества 18:04 - Реферальная система, как превилегия 20:06 - Возраст 21:14 - Зарплата. Ожидания 24:35 - Найм это дорого 24:52 - Ценность сотрудника. Желание работать. Идея 25:34 - Частая смена работы 27:00 - Идеальный джун 28:06 - Пузырь на рынке 30:14 - Опыт вне айти. Смежный опыт 31:48 - Профильное образование 33:00 - Как учиться джуну. Советы 35:14 - Мотивация. Курсы. Цели. Хобби 37:24 - Заключение

В JavaScript, объекты работают по принципу ссылочной природы. Это значит, что когда вы присваиваете одну переменную объекта другой, вы фактически передаете ссылку на этот объект, а не создаете его полную копию. const car1 = { brand: "Toyota", model: "Camry" }; const car2 = car1; Здесь car2 не является новым объектом, а просто указывает на тот же объект, что и car1. Если мы изменим свойство объекта через car2, это изменение отразится и на car1, потому что они ссылаются на один и тот же объект. car2.model = "Corolla"; console.log(car1.model); // Выведет "Corolla", а не "Camry" При работе с объектами необходимо помнить о том, что изменения в одной копии объекта автоматически повлияют на все остальные копии. #JavaScript #обучающийПост #Objects

Сравнение объектов в JavaScript Объекты в JavaScript — это как коробки. Даже если у вас две одинаковые коробки с одинаковым содержимым, это все равно разные коробки. Представьте, что у вас есть две одинаковые игрушечные машинки. Для вас они кажутся одинаковыми, но каждая из них — уникальная. const car1 = { model: 'Toyota' }; const car2 = { model: 'Toyota' }; console.log(car1 == car2); //false console.log(car1 === car2); //false Теперь представим, что у нас есть еще одна переменная, car3. Вместо того чтобы купить новую машинку, мы просто говорим, что car3 это та же самая машинка, что и car1. const car3 = car1; console.log(car1 === car3); //true Теперь, когда мы сравниваем car1 и car3, они абсолютно одинаковые. Не просто похожие, а одна и та же машинка. В то время как car1 и car2, хоть и выглядят одинаково, на самом деле являются разными машинками. #JavaScript #обучающийПост #Objects