Firibgarlarga uchmang! Telemetrio bunday kanallarni topadi va belgilaydi 👉 Belgini ko‘rmoqchi bo‘lsangiz, obuna bo‘ling

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

Kanalga Telegram’da o‘tish

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

Ko'proq ko'rsatish

Tarmoq: easyofferRossiya37 797Texnologiyalar & Aralashmalar7 467...

📈 Telegram kanali Frontend | Вопросы собесов analitikasi

Frontend | Вопросы собесов (@easy_javascript_ru) Rus til segmentidagi kanali faol ishtirokchi. Hozirda hamjamiyat 17 340 obunachidan iborat bo'lib, Texnologiyalar & Aralashmalar toifasida 7 467-o'rinni va Rossiya mintaqasida 37 797-o'rinni egallagan.

📊 Auditoriya ko‘rsatkichlari va dinamika

невідомо sanasidan buyon loyiha tez o‘sib, 17 340 obunachiga ega bo‘ldi.

04 Noyabr, 2026 dagi oxirgi ma’lumotlarga ko‘ra kanal barqaror faollikka ega. Oxirgi 30 kunda obunachilar soni -284 ga, so‘nggi 24 soatda esa -13 ga o‘zgardi va umumiy qamrov yuqori darajada qolmoqda.

Tasdiqlash holati: Tasdiqlanmagan
Jalb etish (ER): Auditoriya o‘rtacha 6.78% darajada jalb etiladi. Nashrdan keyingi dastlabki 24 soatda kontent odatda umumiy obunachilar sonining 4.42% ini tashkil etuvchi reaksiyalarni to‘playdi.
Post qamrovi: Har bir post o‘rtacha 1 175 marta ko‘riladi; birinchi sutkada odatda 766 ta ko‘rish yig‘iladi.
Reaksiyalar va o‘zaro ta’sir: Auditoriya faol: har bir postga o‘rtacha 4 ta reaksiya keladi.
Tematik yo‘nalishlar: Kontent ставь, браузер, html, border, flex kabi asosiy mavzularga jamlangan.

📝 Tavsif va kontent siyosati

Muallif resursni shaxsiy fikrni ifoda etish maydoni sifatida ta’riflaydi:
“Сайт: https://easyoffer.ru/ Все каналы: t.me/+xGeAw6ckJ4liYzQy Контакт для рекламы: @sendme_ads”

Yuqori yangilanish chastotasi (oxirgi ma’lumot 05 Noyabr, 2026 da olingan) sababli kanal doimo dolzarb va katta qamrovli bo‘lib qoladi. Analitika auditoriya kontent bilan faol hamkorlik qilishini, uni Texnologiyalar & Aralashmalar toifasidagi muhim ta’sir nuqtasiga aylantirishini ko‘rsatadi.

17 340

Obunachilar

-1324 soatlar

-1037 kun

-28430 kun

1 175

Post ko'rishlar

~ 76624 soatlar

~ 88148 soatlar

6.78%

Muloqot nisbati

~ 2

Kuniga postlar

Ads index

Postlar arxiv

\n\n🚩Какие события есть в Drag and Drop? \n\nОсновные события: \ndragstart — когда начали тянуть элемент. \ndrag — когда элемент двигается (срабатывает много раз). \ndragenter — когда курсор заходит в зону сброса. \ndragover — когда элемент находится над зоной (нужно preventDefault()). \ndragleave — когда курсор покидает зону сброса. \ndrop — когда элемент отпущен в зоне сброса. \ndragend — когда перетаскивание завершено (даже если не сбросили). \n\n🚩Где используется Drag and Drop? \n\n- Перетаскивание файлов в (например, загрузка изображений). \n- Канбан-доски, как в Trello. \n- Онлайн-редакторы, как Figma. \n- Игры, где можно перемещать предметы. \n\n🚩Можно ли сделать Drag and Drop без HTML5 API? \n\nДа, можно использовать другие методы: \nЧерез события мыши (mousedown, mousemove, mouseup). \nЧерез CSS position: absolute и transform. \nЧерез JS-библиотеки (Sortable.js, React DnD, Draggable.js). \nНапример, в мобильных браузерах стандартный Drag and Drop API плохо работает, и там лучше использовать события touchstart, touchmove, touchend. \n\nСтавь 👍 и забирай 📚 Базу знаний","datePublished":"2025-03-21T09:10:10Z","dateModified":"2025-03-21T09:10:10Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/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":3298},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":22},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":40}]}},{"@type":"ListItem","position":12,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1255","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1255","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1255","headline":"⚡️ Айтишник из «VISION» скупил курсы айти школ и выложил гигабайты материалов к себе Каждый найдет что-то по…","articleBody":"⚡️ Айтишник из «VISION» скупил курсы айти школ и выложил гигабайты материалов к себе\n\nКаждый найдет что-то по душе:\n\n1202 ГБ — Python\n1811 ГБ — Frontend\n1100 ГБ — C / C++ / C#\n804 ГБ — Java\n411 ГБ — SQL & БД\n309 ГБ — DevOps\n998 ГБ — ИБ & Хакинг\n773 ГБ — Kotlin / Swift\n189 ГБ — PHP\n201 ГБ — GoLang\n170 ГБ — Rust\n167 ГБ — QA / Тестирование\n310 ГБ — 1C + Лицензии\n495 ГБ — Машинное обучение\n704 ГБ — Аналитика Данных\n991 ГБ — Дизайн\n\nМатериалы в закрепе, постоянно пополняются👆🏻","datePublished":"2025-03-21T07:00:21Z","dateModified":"2025-03-23T07:00:18Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/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":2103},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":9},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":4}]}},{"@type":"ListItem","position":13,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1254","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1254","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1254","headline":"Обучение на Data Protection Officer (DPO) ⚡Обучение по защите персональных данных от практиков из Comply, ALU…","articleBody":"Обучение на Data Protection Officer (DPO)\n\n⚡Обучение по защите персональных данных от практиков из Comply, ALUMNI Partners, Ozon, VK и др\n\n✨ На курсе вы узнаете:\n» Узнаете все про работу с персональными данными\n» 152-ФЗ и трансграничную передачу данных\n\n🎓Программа:\n» Управление рисками\n» Проверка регулятора\n» Составление документов\n\nСкидка до конца недели!\n\nОставьте заявку сейчас и станьте ближе к успешной карьере юриста! ❤️ \n\nУзнать больше\n\n#реклама 16+\nmosdigitals.ru\nО рекламодателе","datePublished":"2025-03-20T22:01:29Z","dateModified":"2025-03-22T20:21:26Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/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":2160}]}},{"@type":"ListItem","position":14,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1253","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1253","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1253","headline":"🤔 Что такое action creator? Это функция, которая создает объект экшена. Она упрощает передачу данных и предот…","articleBody":"🤔 Что такое action creator?\n\nЭто функция, которая создает объект экшена. Она упрощает передачу данных и предотвращает дублирование кода при отправке dispatch.\n\nСтавь 👍 если знал ответ, 🔥 если нет\nЗабирай 📚 Базу знаний","datePublished":"2025-03-20T16:10:26Z","dateModified":"2025-03-20T16:10:26Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/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":3357},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":13},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":7}]}},{"@type":"ListItem","position":15,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1252","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1252","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1252","headline":"🤔 Как работают плавающие элементы (floats)? float – это CSS-свойство, которое позволяет \"выплывать\" элементу…","articleBody":"🤔 Как работают плавающие элементы (floats)?\n\nfloat – это CSS-свойство, которое позволяет \"выплывать\" элементу из обычного потока документа и обтекаться другими элементами (например, текстом). \n\nОсновные значения float \n

Это текст, который будет обтекать картинку.

\n.float-img {\n float: left;\n margin-right: 10px;\n}\n\n🟠Почему родитель \"схлопывается\" при `float`? \nКогда внутри div есть только float-элементы, браузер считает, что он пустой, потому что float убирает элемент из потока. \n

Текст обтекает картинку.

\n.container {\n background: lightgray;\n}\n.float-img {\n float: left;\n}\n\nРешение 1: overflow: hidden; \n.container {\n overflow: hidden; /* Контейнер теперь учитывает float-элементы */\n}\n\nРешение 2: clearfix (старый способ) \n.container::after {\n content: \"\";\n display: block;\n clear: both;\n}\n\n🟠Как остановить обтекание (`clear`)? \nЧтобы отменить обтекание, используется clear. \n

Этот текст обтекает картинку.

Этот текст пойдёт на новую строку.

\n.float-img {\n float: left;\n margin-right: 10px;\n}\n.clear {\n clear: both;\n}\n\n🚩Почему `float` устарел и что использовать вместо него? \nРаньше float использовали для создания колонок и сеток, но сегодня его заменили: \nFlexbox (display: flex;) – лучше для адаптивных макетов. \nCSS Grid (display: grid;) – мощный инструмент для сложных сеток. \n.container {\n display: flex;\n align-items: center;\n}\n\nСтавь 👍 и забирай 📚 Базу знаний","datePublished":"2025-03-20T09:10:07Z","dateModified":"2025-03-20T09:10:07Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/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":3620},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":9},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":14}]}},{"@type":"ListItem","position":16,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1251","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1251","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1251","headline":"Шанс попасть в IT 🔥 Clevertec запускает бесплатный марафон по frontend-разработке, после которого у тебя буде…","articleBody":"Шанс попасть в IT\n\n🔥 Clevertec запускает бесплатный марафон по frontend-разработке, после которого у тебя будет не только кейс в портфолио, но и шанс попасть в команду.\n\n✨ Если ты начинающий веб-разработчик (JavaScript, React) из России и хочешь прокачаться под менторством программистов компании, заполняй анкету:\n✍️ Форма регистрации\n\n📍Формат: онлайн-марафон на 3 месяца\n📍Каждую неделю ты получаешь задание с подробной инструкцией\n📍В финале у тебя будет готовый проект в репозитории\n\nУсловия приближенные к реальному проекту с поддержкой менторов. Разработка идет по спринтам, будет и взаимодействие с командой. \n\nСтарт — 1 апреля (не шутка 😄). Отличная возможность попробовать свои силы.","datePublished":"2025-03-20T07:00:15Z","dateModified":"2025-03-22T07:00:22Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/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":2022},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":6},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":17}]}},{"@type":"ListItem","position":17,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1250","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1250","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1250","headline":"На easyoffer 2.0 появится новый раздел: Задачи с собеседований 🟠Задачи на Алгоритмические, Live-coding и Syst…","articleBody":"На easyoffer 2.0 появится новый раздел:\nЗадачи с собеседований\n\n🟠Задачи на Алгоритмические, Live-coding и System Design из реальных собеседований\n🟠Вероятность встретить ту или иную задачу\n🟠Возможность подготовиться к задачам конкретной компании\n\nЕсть много сайтов, на которых можно тренироваться решать задачи, но у них у всех одна проблема – сами задачи люди просто выдумывают. На easyoffer 2.0 вы сможете готовиться к live-coding и system design секциям на основе задач из реальных собеседований. Вы можете найдете самые частые задачи и сделаете упор на их решение.\n\nСчитаные дни остались до старта краудфандинговой кампании, чтобы ускорить разработку easyoffer 2.0. Все кто, поддержал проект на этом этапе смогу получить 1 год доступа к сайту по цене месячной подписки, а те кто поддержат проект раньше других ито дешевле + получат существенный бонус. Следите за стартом 👉 в этом телеграм канале.","datePublished":"2025-03-20T06:53:36Z","dateModified":"2025-03-20T06:53:36Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/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":2593},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":1},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":8}],"sharedContent":{"@type":"SocialMediaPosting","datePublished":"2025-03-20T06:53:21Z"}}},{"@type":"ListItem","position":18,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1249","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1249","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1249","headline":"Хотите освоить востребованную профессию в IT? 💻 Откройте новые возможности в IT с гарантированным трудоустрой…","articleBody":"Хотите освоить востребованную профессию в IT?\n\n💻 Откройте новые возможности в IT с гарантированным трудоустройством!\n\n Обучение под руководством экспертов\n Стажировка в реальных проектах\n Гибкий график: совмещайте с бизнесом или работой\n\nПосле обучения вы получите:\n✅ Удалённую работу в ведущих компаниях\n✅ Доход от 150 000 ₽, без ограничений по росту\n✅ Возможность работать в комфортных условиях и управлять своим временем\n\n⚡ Осталось 47 мест \nУспейте подать заявку: \n\nУзнать больше\n\n#реклама 16+\ntechnolium.ru\nО рекламодателе","datePublished":"2025-03-19T19:56:34Z","dateModified":"2025-03-21T18:00:12Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/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":2141}]}},{"@type":"ListItem","position":19,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1248","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1248","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1248","headline":"🤔 Что такое store? Централизованное хранилище состояния в Redux. Оно содержит данные приложения, позволяет по…","articleBody":"🤔 Что такое store?\n\nЦентрализованное хранилище состояния в Redux. Оно содержит данные приложения, позволяет подписываться на обновления и изменять состояние только через dispatch.\n\nСтавь 👍 если знал ответ, 🔥 если нет\nЗабирай 📚 Базу знаний","datePublished":"2025-03-19T16:10:12Z","dateModified":"2025-03-19T16:10:12Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/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":3331},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":11},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":9}]}},{"@type":"ListItem","position":20,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1247","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1247","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/1247","headline":"🤔 К какой категории относятся промисы? Промисы (Promise) относятся к асинхронным объектам, реализующим паттер…","articleBody":"🤔 К какой категории относятся промисы?\n\nПромисы (Promise) относятся к асинхронным объектам, реализующим паттерн \"Promise\". Они позволяют работать с отложенными и асинхронными операциями (например, сетевые запросы, таймеры, операции с файлами). \n\nКатегория: Асинхронные программные конструкции (Async Objects / Async Patterns) \nТип: Объект (Promise Object)*\nИспользуются в: Асинхронном программировании (Async/Await, then/catch) \n\n🚩Почему промисы – асинхронная конструкция? \n\nПромисы не выполняются сразу, а ждут завершения операции, после чего выполняют код в .then() или .catch(). \nconst fetchData = new Promise((resolve, reject) => {\n setTimeout(() => {\n resolve(\"Данные загружены!\"); // Успех\n }, 2000);\n});\n\nfetchData.then(data => console.log(data));\n\n🚩Promise – это не просто колбэк \n\nДо появления Promise в JavaScript использовались колбэки, но они приводили к \"callback hell\". \nfunction fetchData(callback) {\n setTimeout(() => {\n callback(\"Данные загружены!\");\n }, 2000);\n}\n\nfetchData(data => console.log(data));\n\nРешение с Promise \nfetchData()\n .then(data => console.log(data))\n .catch(error => console.error(error));\n\nСтавь 👍 и забирай 📚 Базу знаний","datePublished":"2025-03-19T09:10:07Z","dateModified":"2025-03-19T09:10:07Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/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":3847},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":12},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":20}]}}]}

17 337

🤔 Когда стоит использовать тип any? Тип any в TypeScript позволяет отключить проверку типов и использовать любую структуру данных, как в обычном JavaScript. Но any убирает всю защиту TypeScript, поэтому его нужно использовать только в крайних случаях. 🚩Если тип данных неизвестен заранее (например, ответ от API) Иногда сервер может вернуть разные структуры данных, и невозможно заранее определить точный тип.

async function fetchData(url: string): Promise<any> {
  const response = await fetch(url);
  return response.json();
}

Лучший вариант — использовать интерфейсы вместо any:

interface User {
  id: number;
  name: string;
}

async function fetchUser(url: string): Promise<User> {
  const response = await fetch(url);
  return response.json() as User;
}

🚩При миграции JavaScript в TypeScript Если проект на чистом JavaScript, добавление TypeScript может сломать код. any помогает постепенно вводить строгую типизацию.

function log(value: any) {
  console.log(value);
}

🚩Когда работаем с динамическими структурами (например, `localStorage`) В localStorage можно сохранить что угодно, поэтому при чтении данных тип неизвестен.

const data: any = localStorage.getItem("user");

Лучше сразу привести any к нужному типу

const user = JSON.parse(localStorage.getItem("user") || "{}") as { id: number; name: string };

🚩Когда пишем универсальную библиотеку Если функция должна работать с разными типами, any может быть временным решением.

function mergeObjects(obj1: any, obj2: any): any {
  return { ...obj1, ...obj2 };
}

Лучший вариант с generic (T вместо any)

function mergeObjects<T, U>(obj1: T, obj2: U): T & U {
  return { ...obj1, ...obj2 };
}

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

17 337

Бесплатное льготное обучение: 3 месяца Ищем людей, которые хотят обучиться и работать в IT-сфере из дома В конце обучения вы пройдете стажировку и устроитесь на работу с зп от 150.000 рублей Образование, место жительства, трудовой стаж — не важны! Для старта нужно: — пройти короткий тест — заполнить анкету На что можно рассчитывать, после обучения: ✅ удаленная работа ✅ зп от 150.000 рублей (потолка нет) ✅ стабильная подработка, если не хотите уходить с основной работы ⚡ Осталось всего 47 бесплатных мест. Успейте пройти тест и оставить заявку: Узнать больше #реклама 16+ technolium.ru О рекламодателе

17 337

🤔Различие методов call apply bind? Методы call и apply выполняют функцию с заданным контекстом this, но call принимает аргументы по отдельности, а apply — в виде массива. Метод bind возвращает новую функцию с предустановленным значением this, которую можно вызвать позже. В отличие от call и apply, bind не вызывает функцию немедленно. bind часто используется для создания копий функций с привязкой контекста. Ставь 👍 если знал ответ, 🔥 если нет Забирай 📚 Базу знаний

17 337

Repost from easyoffer

На easyoffer 2.0 появится: База тестовых заданий 🟠Тестовые задания для разных грейдов 🟠Фильтрация тестовых заданий по технологиям и компаниям Когда я только начинал учиться на программиста, я постоянно выдумывал себе задачи для практики и тратил на это много времени. Но только в момент поиска работы я столкнулся с тестовыми заданиями, и понял насколько круто они прокачивают навыки. Нужно было еще на этапе обучения пробовать их делать. Все компании стараются составить тестовое задание "под себя", это дает большой выбор в тематике задач и технологий. На easyoffer 2.0 вы сможете отфильтровать тестовые задания по навыкам/грейдам и найти те, что подходят лично вам для практики. В течение 1-2 дней я объявлю о краудфандинг кампании, чтобы ускорить разработку easyoffer 2.0. Все кто, поддержал проект на этом этапе смогу получить 1 год доступа к сайту по цене месячной подписки и смогут попасть на закрытое бета-тестирование. А первые 150 донатеров получать особо-выгодную цену и бонус. 🚀 Следите за стартом 👉 в этом телеграм канале, в нем информация о старте будет опубликована за 6 часов до официального начала.

17 337

🤔 Как достигается изоляция при использовании бэм? БЭМ (Блок, Элемент, Модификатор) достигает изоляции стилей с помощью уникальных имен классов. Это помогает избежать конфликтов между стилями и делает код более предсказуемым. 🚩Как БЭМ предотвращает конфликты? 🟠Все стили зависят только от конкретного блока В БЭМ нет зависимостей от родительских элементов, поэтому стили блока не сломаются, если он окажется в другом месте.

<div class="button">Кнопка</div>

.button {
  background: blue;
  color: white;
}

Плохой пример без БЭМ

.container .button {
  background: blue;
}

🟠Элементы (`__`) зависят только от своего блока Стили элемента никогда не зависят от родителя — только от блока.

<div class="card">
  <h2 class="card__title">Заголовок</h2>
  <p class="card__text">Текст карточки</p>
</div>

.card__title {
  font-size: 20px;
}

.card__text {
  color: gray;
}

🟠Модификаторы (`--`) изменяют только нужные стили Модификаторы позволяют изменять внешний вид без переписывания базовых стилей.

<button class="button button--red">Кнопка</button>
<button class="button button--blue">Кнопка</button>

.button {
  padding: 10px;
  border-radius: 5px;
}

.button--red {
  background: red;
}

.button--blue {
  background: blue;
}

🟠Имена классов уникальны, нет глобальных стилей В БЭМ не используется tag {} или id {} — только классы. Это предотвращает конфликты стилей.

h1 {
  color: red;
}

БЭМ-версия

.card__title {
  color: red;
}

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

17 337

Узнай, как получить востребованную IT-профессию в 2025! Онлайн-вебинар «Как стать программистом в 2025 году?» 27 марта, в четверг⚡ Расскажем: 1. Какая IT-профессия наиболее востребована на рынке в 2025; 2. Какие знания и навыки необходимы для старта в IT; 3. Уровень дохода у IT-специалистов в 2025 (от новичка до опытного); 4. С чего стоит начать освоение IT-профессии, и как выйти на доход от 100 тыс. руб. После вебинара вы получите: ✅Доступы к бесплатному мини-курсу по программированию на Python; ✅Скидку на основной курс 10.000 рублей. Регистрируйся, не упусти возможность Записаться онлайн #реклама 16+ brainlibweb.ru О рекламодателе

17 337

🤔 Какие способы создания функций есть? Функции можно создавать несколькими способами: - Function Declaration (function foo() {}) – имеет hoisting (видимость до объявления). - Function Expression (const foo = function() {};) – не поднимается (hoisting не работает). - Arrow Function (const foo = () => {};) – компактный синтаксис, не имеет собственного this. - Constructor Function (new Function('a', 'b', 'return a + b');) – динамически создаёт функцию. Ставь 👍 если знал ответ, 🔥 если нет Забирай 📚 Базу знаний

17 337

🤔 Почему у нас в css нет селектора на родителе? В CSS нет селектора родителя, потому что это нарушило бы оптимизацию и производительность рендеринга. 🚩Как работают селекторы в CSS? Обычные селекторы идут от родителя к дочерним элементам.

.parent .child {
  color: red;
}

Что было бы с селектором родителя?

.child:has-parent(.parent) { 
  color: red;
}

🚩Использовать `:has()` (в современных браузерах) В CSS4 появился :has(), который позволяет изменять родителя, если в нём есть определённый потомок.

.parent:has(.child) {
  border: 2px solid red;
}

🚩Использовать Flexbox/Grid вместо селектора родителя Иногда можно поменять структуру HTML и стилизацию, чтобы избежать проблемы.

.parent {
  display: flex;
  gap: 10px;
}

🚩Использовать JavaScript Если нужно изменить родителя динамически, можно использовать JavaScript.

document.querySelectorAll(".child").forEach(child => {
  child.parentElement.classList.add("has-child");
});

.has-child {
  border: 2px solid blue;
}

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

17 337

🤔 Где лучше осуществлять запросы в backend? Лучше всего делать запросы: - В middleware (Redux Thunk, Redux Saga) – для управления асинхронностью в Redux. - В сервисах (API-слой) – если используется Context API, MobX или Zustand. - В React Query/SWR – для кэширования и управления запросами. Прямые запросы в компонентах нежелательны, так как усложняют поддержку кода. Ставь 👍 если знал ответ, 🔥 если нет Забирай 📚 Базу знаний

17 337

Repost from easyoffer

На easyoffer 2.0 появится: Тренажер "Реальное собеседование" 🟠 Сценарии вопросов из реального собеседования 🟠Возможность подготовиться к собеседованию в конкретную компанию 🟠Итоговая статистика (прошёл/не прошёл) Сценарий вопросов взят из реального собеседования. То есть вы тренируетесь на тех вопросах, которые действительно задавались в компании X. Уже в начале следующей недели стартует краудфандинг кампания, чтобы ускорить разработку easyoffer 2.0. Все кто, поддержал проект на этом этапе смогу получить 1 год доступа к сайту по цене месячной подписки. Первые 150 донатеров получать особо-выгодную цену и бонус. Следите за стартом 👉 в этом телеграм канале, в нем информация о старте будет опубликована за 6 часов до официального начала.

17 337

🤔 Является ли, drag and drop частью спецификации? Да! Drag and Drop (перетаскивание) — это часть спецификации HTML5. В браузерах есть встроенный API, который позволяет делать перетаскивание элементов без дополнительных библиотек. 🚩Как работает Drag and Drop API? В HTML5 можно сделать элемент перетаскиваемым, добавив ему атрибут draggable="true". Затем срабатывают специальные события, такие как dragstart, drop, dragover и другие.

<div id="drag-item" draggable="true">Перетащи меня</div>
<div id="drop-zone">Сюда можно сбросить</div>

<script>
  const dragItem = document.getElementById("drag-item");
  const dropZone = document.getElementById("drop-zone");

  dragItem.addEventListener("dragstart", (event) => {
    event.dataTransfer.setData("text/plain", "Данные элемента");
  });

  dropZone.addEventListener("dragover", (event) => {
    event.preventDefault(); // Нужно, чтобы разрешить сброс
  });

  dropZone.addEventListener("drop", (event) => {
    event.preventDefault();
    const data = event.dataTransfer.getData("text/plain");
    alert("Элемент сброшен: " + data);
  });
</script>

🚩Какие события есть в Drag and Drop? Основные события: dragstart — когда начали тянуть элемент. drag — когда элемент двигается (срабатывает много раз). dragenter — когда курсор заходит в зону сброса. dragover — когда элемент находится над зоной (нужно preventDefault()). dragleave — когда курсор покидает зону сброса. drop — когда элемент отпущен в зоне сброса. dragend — когда перетаскивание завершено (даже если не сбросили). 🚩Где используется Drag and Drop? - Перетаскивание файлов в <input type="file"> (например, загрузка изображений). - Канбан-доски, как в Trello. - Онлайн-редакторы, как Figma. - Игры, где можно перемещать предметы. 🚩Можно ли сделать Drag and Drop без HTML5 API? Да, можно использовать другие методы: Через события мыши (mousedown, mousemove, mouseup). Через CSS position: absolute и transform. Через JS-библиотеки (Sortable.js, React DnD, Draggable.js). Например, в мобильных браузерах стандартный Drag and Drop API плохо работает, и там лучше использовать события touchstart, touchmove, touchend. Ставь 👍 и забирай 📚 Базу знаний

17 337

⚡️ Айтишник из «VISION» скупил курсы айти школ и выложил гигабайты материалов к себе Каждый найдет что-то по душе: 1202 ГБ — Python 1811 ГБ — Frontend 1100 ГБ — C / C++ / C# 804 ГБ — Java 411 ГБ — SQL & БД 309 ГБ — DevOps 998 ГБ — ИБ & Хакинг 773 ГБ — Kotlin / Swift 189 ГБ — PHP 201 ГБ — GoLang 170 ГБ — Rust 167 ГБ — QA / Тестирование 310 ГБ — 1C + Лицензии 495 ГБ — Машинное обучение 704 ГБ — Аналитика Данных 991 ГБ — Дизайн Материалы в закрепе, постоянно пополняются👆🏻

17 337

Обучение на Data Protection Officer (DPO) ⚡Обучение по защите персональных данных от практиков из Comply, ALUMNI Partners, Ozon, VK и др ✨ На курсе вы узнаете: » Узнаете все про работу с персональными данными » 152-ФЗ и трансграничную передачу данных 🎓Программа: » Управление рисками » Проверка регулятора » Составление документов Скидка до конца недели! Оставьте заявку сейчас и станьте ближе к успешной карьере юриста! ❤️ Узнать больше #реклама 16+ mosdigitals.ru О рекламодателе

17 337

🤔 Что такое action creator? Это функция, которая создает объект экшена. Она упрощает передачу данных и предотвращает дублирование кода при отправке dispatch. Ставь 👍 если знал ответ, 🔥 если нет Забирай 📚 Базу знаний

17 337

🤔 Как работают плавающие элементы (floats)? float – это CSS-свойство, которое позволяет "выплывать" элементу из обычного потока документа и обтекаться другими элементами (например, текстом). Основные значения float

<img src="image.jpg" class="float-img">
<p>Это текст, который будет обтекать картинку.</p>

.float-img {
  float: left;
  margin-right: 10px;
}

🟠Почему родитель "схлопывается" при `float`? Когда внутри div есть только float-элементы, браузер считает, что он пустой, потому что float убирает элемент из потока.

<div class="container">
  <img src="image.jpg" class="float-img">
  <p>Текст обтекает картинку.</p>
</div>

.container {
  background: lightgray;
}
.float-img {
  float: left;
}

Решение 1: overflow: hidden;

.container {
  overflow: hidden; /* Контейнер теперь учитывает float-элементы */
}

Решение 2: clearfix (старый способ)

.container::after {
  content: "";
  display: block;
  clear: both;
}

🟠Как остановить обтекание (`clear`)? Чтобы отменить обтекание, используется clear.

<img src="image.jpg" class="float-img">
<p>Этот текст обтекает картинку.</p>
<div class="clear"></div>
<p>Этот текст пойдёт на новую строку.</p>

.float-img {
  float: left;
  margin-right: 10px;
}
.clear {
  clear: both;
}

🚩Почему `float` устарел и что использовать вместо него? Раньше float использовали для создания колонок и сеток, но сегодня его заменили: Flexbox (display: flex;) – лучше для адаптивных макетов. CSS Grid (display: grid;) – мощный инструмент для сложных сеток.

.container {
  display: flex;
  align-items: center;
}

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

17 337

Шанс попасть в IT 🔥 Clevertec запускает бесплатный марафон по frontend-разработке, после которого у тебя будет не только кейс в портфолио, но и шанс попасть в команду. ✨ Если ты начинающий веб-разработчик (JavaScript, React) из России и хочешь прокачаться под менторством программистов компании, заполняй анкету: ✍️ Форма регистрации 📍Формат: онлайн-марафон на 3 месяца 📍Каждую неделю ты получаешь задание с подробной инструкцией 📍В финале у тебя будет готовый проект в репозитории Условия приближенные к реальному проекту с поддержкой менторов. Разработка идет по спринтам, будет и взаимодействие с командой. Старт — 1 апреля (не шутка 😄). Отличная возможность попробовать свои силы.

17 337

Repost from easyoffer

На easyoffer 2.0 появится новый раздел: Задачи с собеседований 🟠Задачи на Алгоритмические, Live-coding и System Design из реальных собеседований 🟠Вероятность встретить ту или иную задачу 🟠Возможность подготовиться к задачам конкретной компании Есть много сайтов, на которых можно тренироваться решать задачи, но у них у всех одна проблема – сами задачи люди просто выдумывают. На easyoffer 2.0 вы сможете готовиться к live-coding и system design секциям на основе задач из реальных собеседований. Вы можете найдете самые частые задачи и сделаете упор на их решение. Считаные дни остались до старта краудфандинговой кампании, чтобы ускорить разработку easyoffer 2.0. Все кто, поддержал проект на этом этапе смогу получить 1 год доступа к сайту по цене месячной подписки, а те кто поддержат проект раньше других ито дешевле + получат существенный бонус. Следите за стартом 👉 в этом телеграм канале.

17 337

Хотите освоить востребованную профессию в IT? 💻 Откройте новые возможности в IT с гарантированным трудоустройством! Обучение под руководством экспертов Стажировка в реальных проектах Гибкий график: совмещайте с бизнесом или работой После обучения вы получите: ✅ Удалённую работу в ведущих компаниях ✅ Доход от 150 000 ₽, без ограничений по росту ✅ Возможность работать в комфортных условиях и управлять своим временем ⚡ Осталось 47 мест Успейте подать заявку: Узнать больше #реклама 16+ technolium.ru О рекламодателе

17 337

🤔 Что такое store? Централизованное хранилище состояния в Redux. Оно содержит данные приложения, позволяет подписываться на обновления и изменять состояние только через dispatch. Ставь 👍 если знал ответ, 🔥 если нет Забирай 📚 Базу знаний

17 337

🤔 К какой категории относятся промисы? Промисы (Promise) относятся к асинхронным объектам, реализующим паттерн "Promise". Они позволяют работать с отложенными и асинхронными операциями (например, сетевые запросы, таймеры, операции с файлами). Категория: Асинхронные программные конструкции (Async Objects / Async Patterns) Тип: Объект (Promise Object)* Используются в: Асинхронном программировании (Async/Await, then/catch) 🚩Почему промисы – асинхронная конструкция? Промисы не выполняются сразу, а ждут завершения операции, после чего выполняют код в .then() или .catch().

const fetchData = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve("Данные загружены!"); // Успех
  }, 2000);
});

fetchData.then(data => console.log(data));

🚩Promise – это не просто колбэк До появления Promise в JavaScript использовались колбэки, но они приводили к "callback hell".

function fetchData(callback) {
  setTimeout(() => {
    callback("Данные загружены!");
  }, 2000);
}

fetchData(data => console.log(data));

Решение с Promise

fetchData()
  .then(data => console.log(data))
  .catch(error => console.error(error));

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