Don't get caught by a cheater! Telemetrio finds and tags such channels 👉 If you want to see the tag, subscribe

Frontend | Вопросы собесов

Open in Telegram

Сайт: https://easyoffer.ru/ Все каналы: t.me/+xGeAw6ckJ4liYzQy Контакт для рекламы: @sendme_ads

Network: easyofferRussia37 783Technologies & Applications7 468...

📈 Analytical overview of Telegram channel Frontend | Вопросы собесов

Channel Frontend | Вопросы собесов (@easy_javascript_ru) in the Russian language segment is an active participant. Currently, the community unites 17 366 subscribers, ranking 7 468 in the Technologies & Applications category and 37 783 in the Russia region.

📊 Audience metrics and dynamics

Since its creation on невідомо, the project has demonstrated rapid growth, gathering an audience of 17 366 subscribers.

According to the latest data from 02 November, 2026, the channel demonstrates stable activity. Although there has been a change in the number of participants by -276 over the last 30 days and by -8 over the last 24 hours, overall reach remains high.

Verification status: Not verified
Engagement rate (ER): The average audience engagement rate is 6.93%. Within the first 24 hours after publication, content typically collects 4.36% reactions from the total number of subscribers.
Post reach: On average, each post receives 1 203 views. Within the first day, a publication typically gains 757 views.
Reactions and interaction: The audience actively supports content: the average number of reactions per post is 4.
Thematic interests: Content is focused on key topics such as ставь, браузер, html, border, flex.

📝 Description and content policy

The author describes the resource as a platform for expressing subjective opinions:
“Сайт: https://easyoffer.ru/ Все каналы: t.me/+xGeAw6ckJ4liYzQy Контакт для рекламы: @sendme_ads”

Thanks to the high frequency of updates (latest data received on 03 November, 2026), the channel maintains relevance and a high level of publication reach. Analytics show that the audience actively interacts with content, making it an important point of influence in the Technologies & Applications category.

17 366

Subscribers

-824 hours

-1057 days

-27630 days

1 203

Post views

~ 75724 hours

~ 86848 hours

6.93%

Engagement rate

~ 2

Posts per day

Ads index

Posts Archive

\n\n🟠`requestAnimationFrame()` — лучший способ в чистом JS \nЕсли нужно более гибкое управление анимацией, используем requestAnimationFrame(). \n\n

\n\n\n\n\n\n🟠Библиотеки (GSAP, Anime.js, Velocity.js)\nЕсли нужно делать мощные анимации с минимальным кодом, лучше использовать библиотеку. \n\n

\n\n\n\n\n\nСтавь 👍 и забирай 📚 Базу знаний","datePublished":"2025-05-22T09:05:32Z","dateModified":"2025-05-22T09:05:32Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/en/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/en/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":3261},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":20},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":31}]}},{"@type":"ListItem","position":18,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/en/channels/1917151177-easy_javascript_ru/posts/1550","url":"https://telemetr.io/en/channels/1917151177-easy_javascript_ru/posts/1550","mainEntityOfPage":"https://telemetr.io/en/channels/1917151177-easy_javascript_ru/posts/1550","headline":"Офисные башни JOIS от MR Office в 5 мин от Москва-Сити JOIS - это современные башни класса А от нового бренда…","articleBody":"Офисные башни JOIS от MR Office в 5 мин от Москва-Сити\n\nJOIS - это современные башни класса А от нового бренда, объединяющего все офисные объекты MR Group.\n\nПроект премиального бизнес-центра включает две башни:\n1) 43-этажный небоскреб MAST с офисами от 96 м² и возможностью приобретения офисных помещений по отдельности, а также целыми этажами или блоками\n2) Башня CREDO представляет из себя единый офис площадью 22 000 м²\n\nГлавные преимущества будущего проекта:\n✨Ландшафтный парк площадью 1,3 Га и пешеходный маршрут более 2,3 км\n✨Расположение в 5 минутах до ТТК и Москва-сити\n✨3-уровневый подземный паркинг, рассчитанный на 400 машиномест\n✨Отделка Shell&Core - оптимальное решение для создания эксклюзивного интерьера\n✨Рассрочка 0% на приобретение коммерческой недвижимости \n\nУзнать больше\n\nПроектная декларация на сайте https://наш.дом.рф/. Застройщик: ООО СЗ Л2-ДЕВЕЛОПМЕНТ\n\n#реклама \nmr-group.ru\nО рекламодателе","datePublished":"2025-05-21T18:34:40Z","dateModified":"2025-05-23T16:41:32Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/en/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/en/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1934}]}},{"@type":"ListItem","position":19,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/en/channels/1917151177-easy_javascript_ru/posts/1549","url":"https://telemetr.io/en/channels/1917151177-easy_javascript_ru/posts/1549","mainEntityOfPage":"https://telemetr.io/en/channels/1917151177-easy_javascript_ru/posts/1549","headline":"🤔 Как найти все скрытые элементы на странице? Через JS: document.querySelectorAll('[hidden], [style*=\"display…","articleBody":"🤔 Как найти все скрытые элементы на странице?\n\nЧерез JS:\ndocument.querySelectorAll('[hidden], [style*=\"display: none\"], [style*=\"visibility: hidden\"]')\nМожно также использовать getComputedStyle(el).display === \"none\".\n\nСтавь 👍 если знал ответ, 🔥 если нет\nЗабирай 📚 Базу знаний","datePublished":"2025-05-21T16:10:25Z","dateModified":"2025-05-21T16:10:25Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/en/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/en/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":2835},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":26},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":23}]}},{"@type":"ListItem","position":20,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/en/channels/1917151177-easy_javascript_ru/posts/1548","url":"https://telemetr.io/en/channels/1917151177-easy_javascript_ru/posts/1548","mainEntityOfPage":"https://telemetr.io/en/channels/1917151177-easy_javascript_ru/posts/1548","headline":"🤔 Какие особенности слежения за \"глубокими\" объектами? Когда мы отслеживаем изменения в объектах (например, в…","articleBody":"🤔 Какие особенности слежения за \"глубокими\" объектами?\n\nКогда мы отслеживаем изменения в объектах (например, в React, Vue или MobX), важно понимать, что JavaScript не умеет автоматически следить за вложенными свойствами. Это называется глубокое слежение (deep watching). \n\nПроблема: поверхностное слежение (`shallow watching`) \n\nJavaScript сравнивает только ссылки на объекты, а не их содержимое. \nconst obj = { user: { name: \"Иван\" } };\nconst copy = obj; \n\ncopy.user.name = \"Петр\"; \nconsole.log(obj.user.name); // \"Петр\" (оба объекта ссылаются на одно и то же)\n\n🚩Глубокое копирование vs поверхностное \n\nОбычный Object.assign() или spread-оператор ({ ...obj }) делают поверхностное копирование: \nconst obj = { user: { name: \"Иван\" } };\nconst shallowCopy = { ...obj };\n\nshallowCopy.user.name = \"Петр\";\nconsole.log(obj.user.name); // \"Петр\" 😱 (изменился оригинал!)\n\nДля глубокого копирования можно использовать structuredClone() или JSON.parse(JSON.stringify(obj)): \nconst deepCopy = structuredClone(obj);\ndeepCopy.user.name = \"Петр\";\n\nconsole.log(obj.user.name); // \"Иван\" ✅ (оригинал не изменился)\n\n🚩Как следить за глубокими объектами? \n\n🟠React: следим через `useState` и `useEffect`\nВ React состояние обновляется только при изменении ссылки (shallow compare). \nconst [user, setUser] = useState({ name: \"Иван\" });\n\nuseEffect(() => {\n console.log(\"Имя изменилось:\", user.name);\n}, [user]); // Работает только если user — новый объект!\n\n// НЕ сработает:\nuser.name = \"Петр\"; // user остался тем же объектом\n\nРешение – создавать новый объект при изменении: \nsetUser(prev => ({ ...prev, name: \"Петр\" }));\n\n🟠Vue: `watch` vs `watchEffect` (глубокое слежение) \n\nОбычный watch следит только за первой вложенностью \nwatch(user, (newValue) => {\n console.log(\"Изменено:\", newValue);\n});\n\nГлубокое слежение (deep: true)\nwatch(user, (newValue) => {\n console.log(\"Изменено:\", newValue);\n}, { deep: true });\n\nСтавь 👍 и забирай 📚 Базу знаний","datePublished":"2025-05-21T09:05:23Z","dateModified":"2025-05-21T09:05:23Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/en/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/en/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":3133},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":10},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":20}]}}]}

17 366

Высшее образование дистанционно от 6700 ₽/мес. Поступи в Московский технологический институт в мае! — Высшее образование в московском вузе без выезда на сессии. — Полностью дистанционный онлайн-формат. — Обучайся дома, на работе, в путешествии. — Диплом государственного образца. — 73 направления и программы обучения. — Программа колледж + вуз без ЕГЭ. Скидка 10% на платное обучение при оплате за год. Подать заявку #реклама 16+ mti-vuz.ru О рекламодателе

17 366

🤔 Как отменить обтекание картинки текстом? Используется свойство clear, которое говорит элементу не обтекать плавающие элементы. Можно применить clear: both или вставить блок с этим стилем после float-элемента. Ставь 👍 если знал ответ, 🔥 если нет Забирай 📚 Базу знаний

17 366

HTML, CSS, JS, Node.JS, 🤯 - пора бы всё объединить! Все для изучения веба 👉 Фронтенд - самый большой канал для изучения фронта 👉 Верстка - все о верстке 👉 Node.JS - для тех кто хочет писать бэк на JS Собрано всё, проверяй🔥

17 366

Современная магистратура от Центрального университета Хочешь развиваться в сфере ИТ и получить фундаментальные знания с практикой? Поступай в магистратуру Центрального университета! - 4 офлайн программы по востребованным направлениям ИТ - Онлайн-программа по машинному обучению - 300 мест с грантами до 1,2 млн руб. - Вечерние занятия и учеба по выходным — удобно совмещать с работой - Обучение по модели STEM-образования: на стыке науки, технологий и бизнеса - Возможность стажировок и трудоустройства в ведущих компаниях - Государственный диплом за 2 года Магистратура в Центральном университете — это современный подход к образованию, сильный преподавательский состав и актуальные кейсы от индустрии. Оставляй заявку на грант уже сейчас! Подать заявку #реклама 16+ apply.centraluniversity.ru О рекламодателе

17 366

🤔 Как браузер понимает что ресурс нужно закешировать? Браузер использует HTTP-заголовки и механизмы кэширования, чтобы решить, нужно ли сохранять ресурс (HTML, CSS, JS, изображения) и как долго его хранить. 🚩Как браузер решает, кешировать ресурс или нет? Когда браузер загружает ресурс, сервер может сказать браузеру, как его кешировать, с помощью HTTP-заголовков.

HTTP/1.1 200 OK
Cache-Control: max-age=3600, public
ETag: "abc123"

🚩Как работают заголовки кэширования? 🟠`Cache-Control` – главный заголовок Определяет, как долго ресурс должен храниться в кэше.

Cache-Control: max-age=86400, public

🟠`Expires` – устаревший, но ещё используется Определяет конкретную дату, до которой браузер может использовать кэшированный ресурс.

Expires: Wed, 26 Feb 2025 12:00:00 GMT

🟠`ETag` – проверка обновлений ресурса Позволяет браузеру узнать, изменился ли файл на сервере.

ETag: "abc123"

Если браузер снова запрашивает ресурс, он отправляет заголовок

If-None-Match: "abc123"

🟠`Last-Modified` – альтернатива `ETag` Дата последнего изменения ресурса.

Last-Modified: Tue, 25 Feb 2025 15:30:00 GMT

Браузер может отправить запрос с

If-Modified-Since: Tue, 25 Feb 2025 15:30:00 GMT

Ставь 👍 и забирай 📚 Базу знаний

17 366

CallSmart - контроль качества звонков и встреч с AI 📞 Сотни звонков в день — а конверсии стоят на месте? CallSmart подключает ИИ к вашим звонкам и встречам: он находит слабые места в скриптах, фиксирует ошибки менеджеров и помогает выстроить процессы, которые приносят продажи.📊 Никакой ручной прослушки, только точная аналитика. Экономьте ресурсы и масштабируйтесь быстрее. ✅ 20 звонков — бесплатно, чтобы вы сразу увидели эффект. Перейти на сайт #реклама 16+ callsmart.ru О рекламодателе

17 366

🤔 Для чего нужен хук useContext? useContext позволяет доступаться к данным из контекста, не передавая их через props вручную. Контекст используют, когда какие-то данные нужны многим компонентам на разных уровнях вложенности (например, тема, язык, авторизация). Вместо "протягивания" props через несколько уровней, компонент просто берёт нужное значение из контекста. Ставь 👍 если знал ответ, 🔥 если нет Забирай 📚 Базу знаний

17 366

Методичка: как сделать онлайн-встречи эффективнее Надоело ждать коллег, которые постоянно забывают о встречах, а отсутствие повестки и потерянные договоренности мешают нормально работать? Команда МТС Линк собрала на 37 страницах полезные материалы, чек-листы и кейсы, которые помогают компаниям проводить эффективные совещания в онлайне с помощью сервиса Встречи. Из методички узнаете: - Как создать постоянную ссылку и подключаться на встречи в 2 клика, - Как делать заметки и работать с файлами, не переживая за качество связи и безопасность данных. - Как облегчает жизнь ИИ, который расшифровывает созвоны в текст и автоматически отправляет расшифровку на почту. Еще в методичке описаны 7 способов оценки текущей эффективности ваших онлайн-встреч. Получить гайд можно бесплатно на сайте. Скачать #реклама 16+ mts-link.ru О рекламодателе

17 366

🤔 Какие есть значения у box-sizing? Свойство box-sizing в CSS управляет тем, как рассчитываются размеры элемента, включая ширину и высоту. Оно определяет, включаются ли в эти размеры внутренние отступы (padding) и границы (border), или же они добавляются отдельно. 🚩Возможные значения `box-sizing` 🟠`content-box` Размеры элемента считаются только по `width` и `height`, без учета padding и border. Если добавить padding или border, фактические размеры элемента увеличатся.

   .box {
       width: 200px;
       height: 100px;
       padding: 20px;
       border: 10px solid black;
       box-sizing: content-box;
   }

🟠`border-box` width и height включают padding и border. Внутреннее содержимое (content) будет автоматически уменьшаться, чтобы уложиться в заданные размеры.

   .box {
       width: 200px;
       height: 100px;
       padding: 20px;
       border: 10px solid black;
       box-sizing: border-box;
   }

🟠`inherit` Наследует значение box-sizing от родительского элемента.

   .parent {
       box-sizing: border-box;
   }
   .child {
       box-sizing: inherit; /* Унаследует border-box */
   }

Ставь 👍 и забирай 📚 Базу знаний

17 366

Как повысить эффективность вебинаров? Организация продающего вебинара - не простая задача, ведь необходимо предусмотреть множество деталей: удобную дату, вовлекающий контент, методы продвижения и взаимодействия с участниками. Вебинары от МТС Линк помогают привлекать новых клиентов и увеличивать конверсию из участника в лид. В сервисе доступен анализ поведения пользователей во время вебинара, синхронный перевод, автовебинары и интерактивные инструменты для вовлечения участников. Делимся методичкой с кейсами, чек-листами и инструкциями для маркетологов, PR и event-менеджеров, чтобы сделать вебинары эффективным инструментом для лидогенерации. Получите методичку бесплатно на сайте. Скачать #реклама 16+ mts-link.ru О рекламодателе

17 366

🤔 Что известно про методологию Mobile First? Mobile First — подход, при котором: - Сначала создаётся макет для маленьких экранов; - Далее — добавляются стили через медиа-запросы для больших экранов (@media (min-width: ...)); - Улучшает производительность и приоритет UX на мобильных. Ставь 👍 если знал ответ, 🔥 если нет Забирай 📚 Базу знаний

17 366

Курсы JAVA-разработки Гарантия ЗП от 120 000р в договоре Jаvа — это язык, на котором строятся банковские системы, мобильные приложения, крупные веб-сервисы и многое другое, а спрос на Jаvа-разработчиков стабильно высок. Благодаря кроссплатформенности и надежности, ты сможешь работать в любой сфере IТ — от финансов до Коммерческой отрасли.📊💰 Почему это работает?✨ - Минимальные вложения. - Тысячи человек уже в IТ. Наши выпускники работают в крутых компаниях: от стартапов до международных корпораций. - Наши менторы — это опытные разработчики, которые ежедневно работают в IТ и готовы делиться актуальными знаниями. P.S. Если всё ещё сомневаешься и думаешь что будет сложно — просто попробуй.😊 Мы берем на себя все риски: ты оплачиваешь основную стоимость обучения только после успешного трудоустройства — это закреплено в договоре. Подать заявку #реклама 16+ kata.academy О рекламодателе

17 366

🤔 Что делает omit? omit – это функция, которая удаляет указанные ключи из объекта и возвращает новый объект без этих ключей. В JavaScript нет встроенного omit, но его можно реализовать с помощью деструктуризации и методов Object.fromEntries() или reduce(). Реализация omit с Object.fromEntries() (современный способ)

function omit(obj, keys) {
    return Object.fromEntries(
        Object.entries(obj).filter(([key]) => !keys.includes(key))
    );
}

const user = { name: "Alice", age: 25, password: "123456" };
const safeUser = omit(user, ["password"]); 

console.log(safeUser); // { name: "Alice", age: 25 }

Реализация omit с reduce() (альтернативный способ)

function omit(obj, keys) {
    return Object.keys(obj).reduce((acc, key) => {
        if (!keys.includes(key)) acc[key] = obj[key];
        return acc;
    }, {});
}

const data = { a: 1, b: 2, c: 3 };
console.log(omit(data, ["b"])); // { a: 1, c: 3 }

Если используете Lodash, можно просто вызвать

import { omit } from "lodash";

const user = { name: "Alice", age: 25, password: "123456" };
const safeUser = omit(user, ["password"]);

console.log(safeUser); // { name: "Alice", age: 25 }

Ставь 👍 и забирай 📚 Базу знаний

17 366

Высшее образование дистанционно в Московском ВУЗе Вы мечтаете получить высшее образование, но не сдали ЕГЭ или получили низкие баллы? У нас есть решение для вас! Институт Международных Экономических Связей предлагает дистанционное обучение , которое позволяет получать качественные знания из любой точки мира по 10+ направлениям обучения. ✅ Государственный диплом без отметки о дистанте ✅ Удобный личный кабинет студента ✅ Поддержка кураторов на каждом этапе обучения ✅ Можно поступить без ЕГЭ Узнать больше #реклама 16+ imes.su О рекламодателе

17 366

🤔 Зачем нужен use strict? use strict вводит строгий режим: - предотвращает использование необъявленных переменных; - запрещает удаление переменных; - помогает находить ошибки на ранних этапах. Ставь 👍 если знал ответ, 🔥 если нет Забирай 📚 Базу знаний

17 366

🤖 Топ 4 ИИ-сервиса, которые освободят тебе 30 часов в неделю. Бесплатно + без регистрации Попробовать можно тут 👉 t.me/vistehno

17 366

🤔 Как мы будем через js анимировать что либо? В JavaScript есть три основных способа создания анимаций: CSS-анимации (transition, @keyframes) + изменение классов через JS Метод requestAnimationFrame() Использование библиотек (GSAP, Anime.js, Velocity.js) 🟠CSS-анимации + управление через JS Самый простой способ — использовать CSS-анимации, а в JS только добавлять или убирать классы.

<button onclick="toggleBox()">Анимировать</button>
<div id="box"></div>

<style>
  #box {
    width: 100px;
    height: 100px;
    background: red;
    transition: transform 0.5s ease-in-out;
  }
  .move {
    transform: translateX(200px);
  }
</style>

<script>
  function toggleBox() {
    document.getElementById("box").classList.toggle("move");
  }
</script>

🟠`requestAnimationFrame()` — лучший способ в чистом JS Если нужно более гибкое управление анимацией, используем requestAnimationFrame().

<button onclick="startAnimation()">Старт</button>
<div id="box"></div>

<style>
  #box {
    width: 50px;
    height: 50px;
    background: blue;
    position: absolute;
  }
</style>

<script>
  let position = 0;
  let animationId;

  function animate() {
    position += 5; // Двигаем на 5px за кадр
    document.getElementById("box").style.transform = `translateX(${position}px)`;

    if (position < 300) { // Останавливаем, когда достигнет 300px
      animationId = requestAnimationFrame(animate);
    }
  }

  function startAnimation() {
    cancelAnimationFrame(animationId); // Останавливаем предыдущую анимацию
    position = 0;
    animate();
  }
</script>

🟠Библиотеки (GSAP, Anime.js, Velocity.js) Если нужно делать мощные анимации с минимальным кодом, лучше использовать библиотеку.

<button onclick="animateBox()">Анимировать</button>
<div id="box"></div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/gsap.min.js"></script>

<script>
  function animateBox() {
    gsap.to("#box", { x: 300, rotation: 360, duration: 2, ease: "elastic.out(1,0.3)" });
  }
</script>

Ставь 👍 и забирай 📚 Базу знаний

17 366

Офисные башни JOIS от MR Office в 5 мин от Москва-Сити JOIS - это современные башни класса А от нового бренда, объединяющего все офисные объекты MR Group. Проект премиального бизнес-центра включает две башни: 1) 43-этажный небоскреб MAST с офисами от 96 м² и возможностью приобретения офисных помещений по отдельности, а также целыми этажами или блоками 2) Башня CREDO представляет из себя единый офис площадью 22 000 м² Главные преимущества будущего проекта: ✨Ландшафтный парк площадью 1,3 Га и пешеходный маршрут более 2,3 км ✨Расположение в 5 минутах до ТТК и Москва-сити ✨3-уровневый подземный паркинг, рассчитанный на 400 машиномест ✨Отделка Shell&Core - оптимальное решение для создания эксклюзивного интерьера ✨Рассрочка 0% на приобретение коммерческой недвижимости Узнать больше Проектная декларация на сайте https://наш.дом.рф/. Застройщик: ООО СЗ Л2-ДЕВЕЛОПМЕНТ #реклама mr-group.ru О рекламодателе

17 366

🤔 Как найти все скрытые элементы на странице? Через JS: document.querySelectorAll('[hidden], [style*="display: none"], [style*="visibility: hidden"]') Можно также использовать getComputedStyle(el).display === "none". Ставь 👍 если знал ответ, 🔥 если нет Забирай 📚 Базу знаний

17 366

🤔 Какие особенности слежения за "глубокими" объектами? Когда мы отслеживаем изменения в объектах (например, в React, Vue или MobX), важно понимать, что JavaScript не умеет автоматически следить за вложенными свойствами. Это называется глубокое слежение (deep watching). Проблема: поверхностное слежение (`shallow watching`) JavaScript сравнивает только ссылки на объекты, а не их содержимое.

const obj = { user: { name: "Иван" } };
const copy = obj; 

copy.user.name = "Петр"; 
console.log(obj.user.name); // "Петр" (оба объекта ссылаются на одно и то же)

🚩Глубокое копирование vs поверхностное Обычный Object.assign() или spread-оператор ({ ...obj }) делают поверхностное копирование:

const obj = { user: { name: "Иван" } };
const shallowCopy = { ...obj };

shallowCopy.user.name = "Петр";
console.log(obj.user.name); // "Петр" 😱 (изменился оригинал!)

Для глубокого копирования можно использовать structuredClone() или JSON.parse(JSON.stringify(obj)):

const deepCopy = structuredClone(obj);
deepCopy.user.name = "Петр";

console.log(obj.user.name); // "Иван" ✅ (оригинал не изменился)

🚩Как следить за глубокими объектами? 🟠React: следим через `useState` и `useEffect` В React состояние обновляется только при изменении ссылки (shallow compare).

const [user, setUser] = useState({ name: "Иван" });

useEffect(() => {
  console.log("Имя изменилось:", user.name);
}, [user]); // Работает только если user — новый объект!

// НЕ сработает:
user.name = "Петр"; // user остался тем же объектом

Решение – создавать новый объект при изменении:

setUser(prev => ({ ...prev, name: "Петр" }));

🟠Vue: `watch` vs `watchEffect` (глубокое слежение) Обычный watch следит только за первой вложенностью

watch(user, (newValue) => {
  console.log("Изменено:", newValue);
});

Глубокое слежение (deep: true)

watch(user, (newValue) => {
  console.log("Изменено:", newValue);
}, { deep: true });

Ставь 👍 и забирай 📚 Базу знаний