Frontend | Вопросы собесов
前往频道在 Telegram
Сайт: https://easyoffer.ru/ Все каналы: t.me/+xGeAw6ckJ4liYzQy Контакт для рекламы: @sendme_ads
显示更多📈 Telegram 频道 Frontend | Вопросы собесов 的分析概览
频道 Frontend | Вопросы собесов (@easy_javascript_ru) 俄语 语言赛道中的 是活跃参与者。目前社区聚集了 17 368 名订阅者,在 技术与应用 类别中位列第 7 469,并在 俄罗斯 地区排名第 37 786 位。
📊 受众指标与增长动态
自 невідомо 创建以来,项目保持高速增长,吸引了 17 368 名订阅者。
根据 01 十一月, 2026 的最新数据,频道保持稳定运转。过去 30 天订阅人数变化为 -277,过去 24 小时变化为 -26,整体触达仍然可观。
- 认证状态: 未认证
- 互动率 (ER): 平均受众互动率为 6.94%。内容发布后 24 小时内通常能获得 4.39% 的反应,占订阅者总量。
- 帖子覆盖: 每篇帖子平均可获得 1 205 次浏览,首日通常累积 762 次浏览。
- 互动与反馈: 受众积极参与,单帖平均反应数为 4。
- 主题关注点: 内容集中在 ставь, браузер, html, border, flex 等核心主题上。
📝 描述与内容策略
作者将该频道定位为表达主观观点的平台:
“Сайт: https://easyoffer.ru/
Все каналы: t.me/+xGeAw6ckJ4liYzQy
Контакт для рекламы: @sendme_ads”
凭借高频更新(最新数据采集于 02 十一月, 2026),频道始终保持新鲜度与高覆盖。分析显示受众积极互动,使其成为 技术与应用 类别中的关键影响点。
17 368
订阅者
-2624 小时
-1087 天
-27730 天
帖子存档
\n\n🚩`stopImmediatePropagation`\n\nЭтот метод, помимо остановки всплытия (как stopPropagation), предотвращает выполнение других обработчиков на том же элементе. Если у одного и того же элемента есть несколько обработчиков для одного события, stopImmediatePropagation гарантирует, что после его вызова остальные обработчики не будут выполнены.\n\n\n\n\n🚩`preventDefault`\n\nЭтот метод отменяет поведение элемента по умолчанию. \nНекоторые элементы (например, ссылки или формы) имеют стандартное поведение. Например:\n- Клик по ссылке ведет на новый URL.\n- Отправка формы перезагружает страницу. \nС помощью preventDefault можно предотвратить это поведение.\nПерейти на сайт\n\n\n\n🚩`passive`\n\nЭто модификатор, который не является методом, а используется в настройках обработчика событий. Он указывает, что обработчик не вызывает preventDefault. Этот модификатор помогает оптимизировать обработку событий, таких как прокрутка (scroll), делая их более производительными. Некоторые браузеры при обработке событий (например, touchstart или wheel) предполагают, что вы можете использовать preventDefault. Это замедляет прокрутку, так как браузеру нужно ждать завершения вашего обработчика. Указав passive: true, вы говорите браузеру, что не собираетесь отменять поведение.\nwindow.addEventListener(\"scroll\", () => {\n console.log(\"Скролл работает\");\n}, { passive: true });\n\nСтавь 👍 и забирай 📚 Базу знаний","datePublished":"2025-08-02T09:05:30Z","dateModified":"2025-08-02T09:05:30Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ch/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ch/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":2654},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":15},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":25}]}},{"@type":"ListItem","position":18,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ch/channels/1917151177-easy_javascript_ru/posts/1807","url":"https://telemetr.io/ch/channels/1917151177-easy_javascript_ru/posts/1807","mainEntityOfPage":"https://telemetr.io/ch/channels/1917151177-easy_javascript_ru/posts/1807","headline":"Договорное право – Повышение квалификации ⚡Станьте экспертом в договорном праве, обучаясь на реальных кейсах…","articleBody":"Договорное право – Повышение квалификации\n\n⚡Станьте экспертом в договорном праве, обучаясь на реальных кейсах от практикущих юристов из Ozon, Denuo, BGP Litigation, Verba Legal и НИУ ВШЭ\n\n✨ На курсе вы:\n» Подробно изучите все основные виды договоров\n» Научитесь составлять договоры, которые нравятся клиентам\n» Упор на практику: анализ условий договора на примере кейсов\n» Неограниченный доступ к материалам курса и контакт с экспертами\n\n🎓Программа:\n» Основы договорного права\n» Отдельные виды договоров\n» Эффективная организации договорной работы\n\nСкидка до конца недели!\n\nОставьте заявку сейчас и станьте ближе к успешной карьере юриста! ❤️ \n\nУзнать больше\n\n#реклама 16+\nmosdigitals.ru\nО рекламодателе","datePublished":"2025-08-02T03:01:50Z","dateModified":"2025-08-04T01:17:20Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ch/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ch/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":1586}]}},{"@type":"ListItem","position":19,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ch/channels/1917151177-easy_javascript_ru/posts/1806","url":"https://telemetr.io/ch/channels/1917151177-easy_javascript_ru/posts/1806","mainEntityOfPage":"https://telemetr.io/ch/channels/1917151177-easy_javascript_ru/posts/1806","headline":"🤔 Какая основная причина для использования SSR? SSR (Server-Side Rendering): - Улучшает скорость загрузки пер…","articleBody":"🤔 Какая основная причина для использования SSR?\n\nSSR (Server-Side Rendering):\n- Улучшает скорость загрузки первого экрана (первая отрисовка приходит сразу с сервера).\n- Обеспечивает SEO-оптимизацию, поскольку поисковики получают готовый HTML.\n- Полезен для динамического контента, где важна предзагрузка.\n\nСтавь 👍 если знал ответ, 🔥 если нет\nЗабирай 📚 Базу знаний","datePublished":"2025-08-01T16:10:19Z","dateModified":"2025-08-01T16:10:19Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ch/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ch/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":2458},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":13},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":11}]}},{"@type":"ListItem","position":20,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ch/channels/1917151177-easy_javascript_ru/posts/1805","url":"https://telemetr.io/ch/channels/1917151177-easy_javascript_ru/posts/1805","mainEntityOfPage":"https://telemetr.io/ch/channels/1917151177-easy_javascript_ru/posts/1805","headline":"🤔 Что такое нотация о-большое? O-большое (Big O) — это способ описания эффективности алгоритма в зависимости…","articleBody":"🤔 Что такое нотация о-большое?\n\nO-большое (Big O) — это способ описания эффективности алгоритма в зависимости от размера входных данных. Она показывает, как быстро растёт время выполнения или использование памяти при увеличении количества входных данных. \n\n🚩Зачем нужна O-большое? \n\nКогда мы пишем код, важно понимать, насколько он эффективен, особенно при работе с большими массивами или сложными вычислениями. \nBig O помогает: \n- Оценить время работы алгоритма. \n- Понять, как алгоритм масштабируется. \n- Сравнить разные алгоритмы и выбрать лучший. \n\n🚩Примеры сложности алгоритмов \n\nO(1) – Константное время \nfunction getFirstElement(arr) {\n return arr[0]; // Не зависит от размера массива\n}\n\nO(N) – Линейное время \nfunction findElement(arr, target) {\n for (let i = 0; i < arr.length; i++) { \n if (arr[i] === target) return i;\n }\n return -1;\n}\n\nO(N²) – Квадратичное время (плохо) \nfunction bubbleSort(arr) {\n for (let i = 0; i < arr.length; i++) {\n for (let j = 0; j < arr.length; j++) {\n if (arr[i] > arr[j]) {\n [arr[i], arr[j]] = [arr[j], arr[i]];\n }\n }\n }\n return arr;\n}\n\nO(log N) – Логарифмическое время (оптимально) \nfunction binarySearch(arr, target) {\n let left = 0, right = arr.length - 1;\n \n while (left <= right) {\n let mid = Math.floor((left + right) / 2);\n \n if (arr[mid] === target) return mid;\n if (arr[mid] < target) left = mid + 1;\n else right = mid - 1;\n }\n\n return -1;\n}\n\nСтавь 👍 и забирай 📚 Базу знаний","datePublished":"2025-08-01T09:05:31Z","dateModified":"2025-08-01T09:05:31Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ch/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/ch/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":2747},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":15},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":41}]}}]}




🤔 Какие особенности использования v-model в Vue 2 и 3?
Vue 2:
- v-model работает только с одним пропом: value.
- Событие по умолчанию — input.
- Используется для двусторонней привязки в form-элементах и компонентах.
- В кастомных компонентах нужно явно прописывать props: ['value'] и эмитить input.
Vue 3:
- v-model стал более гибким:
- Можно задавать имя пропа и события: v-model:foo="bar" → проп foo, событие update:foo.
- Можно иметь несколько v-model на компонент.
- Поведение более явно выражено, лучше читаемость и масштабируемость.
Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚 Базу знаний
🤔 Какими способами мы можем получить картинку с сервера?
В веб-разработке есть разные способы загрузки изображений с сервера. Они зависят от того, какой сервер и какая задача (отображение в браузере, скачивание, работа с API и т. д.).
<img> – самый простой способ (браузер сам загружает)
<img src="https://example.com/image.jpg" alt="Картинка">
CSS (background-image) – если нужно фоновое изображение
.element {
background-image: url("https://example.com/image.jpg");
background-size: cover;
}
🟠`fetch()` – если нужно обработать картинку в JS
Можно загрузить изображение как Blob и создать временный URL.
fetch("https://example.com/image.jpg")
.then(response => response.blob())
.then(blob => {
const url = URL.createObjectURL(blob);
document.getElementById("img").src = url;
});
XMLHttpRequest – старый метод (устарел, но работает)
const xhr = new XMLHttpRequest();
xhr.open("GET", "https://example.com/image.jpg", true);
xhr.responseType = "blob";
xhr.onload = function () {
const url = URL.createObjectURL(xhr.response);
document.getElementById("img").src = url;
};
xhr.send();
🟠`<canvas>` – если нужно редактировать изображение
Можно загрузить картинку и нарисовать её на <canvas>.
const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
const img = new Image();
img.onload = function () {
ctx.drawImage(img, 0, 0);
};
img.src = "https://example.com/image.jpg";
WebSocket – если изображение передаётся в реальном времени
const socket = new WebSocket("wss://example.com/socket");
socket.onmessage = function (event) {
const url = URL.createObjectURL(event.data);
document.getElementById("img").src = url;
};
data URL (Base64) – если нужно хранить изображение в тексте
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA..." />
Ставь 👍 и забирай 📚 Базу знанийДима Билан на Yandex Ecom Open Air 8 августа
Море инсайтов для бизнеса, музыкальный open-air, лекции и нетворкинг.
Участие бесплатно!
Зарегистрироваться
#реклама 18+
ecomfest.ru
О рекламодателе
Repost from easyoffer
⚡ Официальный релиз easyoffer 2.0 состоится уже в течение нескольких дней.
Напоминаю, что в честь релиза запускаем акцию.
Первые 500 покупателей получат:
🚀 Скидку 50% на PRO тариф на 1 год
🎁 Подарок ценностью 5000₽ для тех, кто подписан на этот канал
🔔 Подпишитесь на этот канал: https://t.me/+b2fZN17A9OQ3ZmJi
В нем мы опубликуем сообщение о релизе в первую очередь
🤔 Что такое margin collapse и для чего?
Margin collapse — это схлопывание внешних отступов между вертикально соседствующими элементами.
Если один элемент имеет margin-bottom, а следующий — margin-top, будет применён наибольший из них, а не сумма. Это упрощает вертикальные отступы.
Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚 Базу знаний
🤔 В чем различие методов call apply bind?
Методы call, apply и bind принадлежат к функциональному объекту
Function и используются для указания контекста this при вызове функции. Хотя все три метода позволяют контролировать значение this внутри функции, между ними существуют ключевые различия в способе использования и поведении.
🚩Сall
Вызывает функцию, явно устанавливая this в первом аргументе. Остальные аргументы передаются в вызываемую функцию как есть.
function greet(message, name) {
console.log(${message}, ${name}. This is ${this});
}
greet.call("Earth", "Hello", "Alice"); // "Hello, Alice. This is Earth"
🚩Apply
Очень похож на call, но принимает аргументы в виде массива, а не по отдельности.
function greet(message, name) {
console.log(
${message}, ${name}. This is ${this}
);
}
greet.apply("Earth", ["Hello", "Alice"]); // "Hello, Alice. This is Earth"
🚩Bind
Создаёт новую функцию, которая, когда она вызывается, имеет установленный контекст this, указанный в первом аргументе. В отличие от call и apply, bind не вызывает функцию сразу, а возвращает новую функцию, которую можно вызвать позже.
function greet(message, name) {
console.log(
${message}, ${name}. This is ${this}
);
}
const greetEarth = greet.bind("Earth", "Hello", "Alice");
greetEarth(); // "Hello, Alice. This is Earth"
Ставь 👍 и забирай 📚 Базу знаний🤔 Как растянуть элемент на 100%?
- Через CSS:
width: 100%;
- Убедиться, что родительский элемент имеет ширину (не auto, не inline).
- Иногда нужно указать display: block или flex-grow: 1 в флекс-контейнере.
Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚 Базу знаний
🤔 Чего стоит и не стоит избегать в оптимизации сайта?
🟠Оптимизация изображений
Сжатие без потери качества: Используйте инструменты, такие как TinyPNG или ImageOptim. Использование современных форматов: WebP и AVIF обеспечивают лучшее сжатие и качество. Lazy Loading: Загружайте изображения по мере их появления в области видимости пользователя.
🟠Минификация и объединение файлов
Минификация: Уменьшайте размеры CSS, JavaScript и HTML-файлов с помощью инструментов, таких как UglifyJS и CSSNano. Объединение: Сокращайте количество HTTP-запросов, объединяя несколько файлов в один.
🟠Использование CDN (Content Delivery Network)
Размещайте копии вашего сайта на серверах по всему миру, чтобы уменьшить задержки для пользователей из разных регионов.
🟠Кэширование
На стороне клиента: Настройте заголовки кэширования HTTP. На стороне сервера: Используйте технологии, такие как Varnish или Nginx.
🟠Асинхронная загрузка и критический CSS
Асинхронная загрузка: Используйте атрибуты async и defer для JavaScript. Критический CSS: Встраивайте важные стили прямо в HTML, чтобы ускорить начальную отрисовку страницы.
🟠Улучшение производительности сервера
Сжатие данных: Включите gzip или Brotli. HTTP/2: Переходите на HTTP/2 для мультиплексирования запросов.
🟠Использование современных технологий
Service Workers: Для офлайн-работы и улучшенного кэширования. Prefetching и Preloading: Предзагрузка и предзапросы ресурсов.
🟠Мониторинг и анализ
Google Lighthouse, PageSpeed Insights: Используйте для анализа производительности. Реальное время: Применяйте Google Analytics, New Relic.
🚩Чего стоит избегать при оптимизации сайта
🟠Избегайте чрезмерной минимизации
Читаемость кода: Минимизация без генерации карт кода (source maps) может усложнить отладку.
🟠Не используйте большие, несжатые изображения
Размер файлов: Это замедляет загрузку и увеличивает потребление трафика пользователем.
🟠Не загружайте все ресурсы сразу
Асинхронная загрузка: Используйте техники lazy loading и асинхронной загрузки.
🟠Не пренебрегайте кэшированием
Отсутствие кэширования: Увеличивает время загрузки для повторных посещений.
🟠Избегайте блокирующих ресурсов
JavaScript и CSS: Не блокируйте рендеринг страницы тяжелыми файлами.
🟠Не злоупотребляйте анимациями и большими скриптами
Производительность: Сложные анимации и большие скрипты могут замедлить сайт, особенно на мобильных устройствах.
🟠Избегайте чрезмерного использования плагинов
Нагрузки: Избыток плагинов может значительно замедлить сайт и создать проблемы с безопасностью.
🟠Не забывайте про оптимизацию для мобильных устройств
Мобильная версия: Сайт должен быть оптимизирован для мобильных пользователей, так как большинство пользователей используют мобильные устройства.
Ставь 👍 и забирай 📚 Базу знаний
На каждый день и для офиса: новая коллекция MAAG
В центре внимания — деним, натуральная кожа и продуманный крой. Обновите гардероб к осени вещами, которые будут актуальными сезон за сезоном.
Рассмотреть новинки можно в ближайшем магазине MAAG и на официальном сайте maag-fashion.com.
Приятных покупок!❤️
Купить
#реклама
maag-fashion.com
О рекламодателе
🤔 Сходство и отличия Observable от Promise?
Сходства:
- Оба асинхронные;
- Позволяют работать с отложенными значениями.
Отличия:
- Promise — одноразовый, сразу запускается;
- Observable — ленивый, запускается при подписке, может вернуть несколько значений и быть отменён.
Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚 Базу знаний
🤔 Что такое meta теги?
Meta-теги – это специальные HTML-теги, которые содержат метаинформацию о веб-странице. Они располагаются внутри
<head> и не отображаются на самой странице, но помогают браузерам, поисковым системам и социальным сетям правильно обрабатывать и отображать страницу.
🚩Зачем нужны meta-теги?
Улучшают SEO (поисковую оптимизацию)
Управляют отображением в соцсетях и поисковиках
Настраивают адаптивность страницы (например, на мобильных устройствах)
Определяют кодировку, язык и авторство страницы
🚩Основные meta-теги с примерами
Кодировка страницы
<meta charset="UTF-8">
Описание страницы (SEO)
<meta name="description" content="Лучший сайт с рецептами вкусных блюд!">
Ключевые слова (SEO, устарело)
<meta name="keywords" content="рецепты, еда, кулинария, блюда">
Автор страницы
<meta name="author" content="Иван Иванов">
Запрет индексации страницы
<meta name="robots" content="noindex, nofollow">
Адаптивность на мобильных устройствах
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Социальные сети (Open Graph, Twitter Cards)
Facebook и другие соцсети (Open Graph)
<meta property="og:title" content="Вкусные рецепты">
<meta property="og:description" content="Попробуйте лучшие блюда со всего мира!">
<meta property="og:image" content="https://example.com/image.jpg">
<meta property="og:url" content="https://example.com">
Twitter-карточки
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Рецепты для гурманов">
<meta name="twitter:image" content="https://example.com/image.jpg">
Ставь 👍 и забирай 📚 Базу знанийПриглашаем на Yandex Neuro Scale
В этом году главная конференция Yandex Cloud объединит разработчиков, архитекторов, инженеров и IT-руководителей, чтобы обменяться опытом и увидеть, как работают технологии, которые меняют индустрии. 7 тематических треков, 50+ докладов, реальные бизнес-кейсы и нетворкинг!
✨Участие бесплатное, нужно только зарегистрироваться!✨
Зарегистрироваться
#реклама 16+
scale.yandex.cloud
О рекламодателе
Реклама на Яндексе
🤔 Как обратиться к DOM-дереву в React?
В React доступ к DOM-дереву осуществляется через рефы (Refs). Используется useRef для функциональных компонентов или React.createRef для классовых.
Также можно использовать document.querySelector() внутри useEffect, но это не рекомендуется.
Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚 Базу знаний
🤔 Как методы будут у api?
В API (Application Programming Interface) обычно используются HTTP-методы, которые определяют, какое действие нужно выполнить с ресурсом (данными).
🚩Примеры использования
🟠`GET` – Получение данных
Запрашиваем список пользователей:
GET /users HTTP/1.1
Host: api.example.com
Ответ (JSON)
[
{ "id": 1, "name": "Alice" },
{ "id": 2, "name": "Bob" }
]
🟠`POST` – Создание нового ресурса
Отправляем данные нового пользователя:
POST /users HTTP/1.1
Host: api.example.com
Content-Type: application/json
{
"name": "Charlie",
"email": "charlie@example.com"
}
Ответ (201 Created)
{
"id": 3,
"name": "Charlie",
"email": "charlie@example.com"
}
🟠`PUT` – Полное обновление ресурса
Заменяем пользователя с ID 1:
PUT /users/1 HTTP/1.1
Host: api.example.com
Content-Type: application/json
{
"name": "Alice Smith",
"email": "alice.smith@example.com"
}
🟠`PATCH` – Частичное обновление ресурса
Меняем только имя пользователя 1, не трогая email:
PATCH /users/1 HTTP/1.1
Host: api.example.com
Content-Type: application/json
{
"name": "Alice Johnson"
}
🟠`DELETE` – Удаление ресурса
Удаляем пользователя с ID 2:
DELETE /users/2 HTTP/1.1
Host: api.example.com
Ставь 👍 и забирай 📚 Базу знанийКвартиры в Новостройке СПб. Семейная ипотека 3,5%
Жилой комплекс "Квартал Заречье"
Санкт-Петербург. Колпино.
4 девятиэтажных жилых корпуса
8-этажный крытый гараж на 496 парковочных мест
В живописном месте у реки Ижора.
На первых этажах будут размещены магазины, кофейни, поликлиника и зона коворкинга.
Перейти на сайт
Изучите все условия кредита (займа) на сайте в соответствующем разделе. Оценивайте свои финансовые возможности и риски. Проектная декларация на сайте https://наш.дом.рф/. Застройщик: ООО "СЗ "ЗАГОРОДНАЯ, 71". Финансовые услуги оказывает: ПАО Сбербанк, ООО "СЗ "ЗАГОРОДНАЯ, 71".
#реклама
квартал-заречье.рф
О рекламодателе
🤔 Что такое falsy значения?
Это значения, которые при приведении к булевому типу становятся false.
1. Примеры: 0, '' (пустая строка), null, undefined, NaN, false.
2. Они полезны для проверки в логических операциях и условиях.
Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚 Базу знаний
🤔 Какие модификаторы есть у событий?
В JavaScript у событий есть специальные модификаторы, которые позволяют изменять поведение события, управлять его распространением, обработкой и связанной с ним логикой.
🚩`stopPropagation`
Этот метод предотвращает всплытие события вверх по дереву DOM.
По умолчанию, события в DOM распространяются по фазам: погружение (capturing) → цель (target) → всплытие (bubbling). Если вы хотите остановить обработку события на текущем элементе и не позволить ему "подняться" выше по дереву DOM, используйте
stopPropagation.
<div id="parent" style="padding: 20px; background: lightblue;">
Родительский элемент
<button id="child">Дочерний элемент</button>
</div>
<script>
document.getElementById("parent").addEventListener("click", () => {
alert("Событие всплыло до родителя");
});
document.getElementById("child").addEventListener("click", (event) => {
alert("Событие на кнопке");
event.stopPropagation(); // Остановим всплытие
});
</script>
🚩`stopImmediatePropagation`
Этот метод, помимо остановки всплытия (как stopPropagation), предотвращает выполнение других обработчиков на том же элементе. Если у одного и того же элемента есть несколько обработчиков для одного события, stopImmediatePropagation гарантирует, что после его вызова остальные обработчики не будут выполнены.
<button id="myButton">Нажми меня</button>
<script>
const button = document.getElementById("myButton");
button.addEventListener("click", () => {
alert("Обработчик 1");
});
button.addEventListener("click", (event) => {
alert("Обработчик 2");
event.stopImmediatePropagation(); // Остановим все остальные обработчики
});
button.addEventListener("click", () => {
alert("Обработчик 3"); // Этот обработчик не выполнится
});
</script>
🚩`preventDefault`
Этот метод отменяет поведение элемента по умолчанию.
Некоторые элементы (например, ссылки или формы) имеют стандартное поведение. Например:
- Клик по ссылке ведет на новый URL.
- Отправка формы перезагружает страницу.
С помощью preventDefault можно предотвратить это поведение.
<a href="https://example.com" id="link">Перейти на сайт</a>
<script>
const link = document.getElementById("link");
link.addEventListener("click", (event) => {
event.preventDefault(); // Останавливаем переход по ссылке
alert("Поведение ссылки отменено");
});
</script>
🚩`passive`
Это модификатор, который не является методом, а используется в настройках обработчика событий. Он указывает, что обработчик не вызывает preventDefault. Этот модификатор помогает оптимизировать обработку событий, таких как прокрутка (scroll), делая их более производительными. Некоторые браузеры при обработке событий (например, touchstart или wheel) предполагают, что вы можете использовать preventDefault. Это замедляет прокрутку, так как браузеру нужно ждать завершения вашего обработчика. Указав passive: true, вы говорите браузеру, что не собираетесь отменять поведение.
window.addEventListener("scroll", () => {
console.log("Скролл работает");
}, { passive: true });
Ставь 👍 и забирай 📚 Базу знанийДоговорное право – Повышение квалификации
⚡Станьте экспертом в договорном праве, обучаясь на реальных кейсах от практикущих юристов из Ozon, Denuo, BGP Litigation, Verba Legal и НИУ ВШЭ
✨ На курсе вы:
» Подробно изучите все основные виды договоров
» Научитесь составлять договоры, которые нравятся клиентам
» Упор на практику: анализ условий договора на примере кейсов
» Неограниченный доступ к материалам курса и контакт с экспертами
🎓Программа:
» Основы договорного права
» Отдельные виды договоров
» Эффективная организации договорной работы
Скидка до конца недели!
Оставьте заявку сейчас и станьте ближе к успешной карьере юриста! ❤️
Узнать больше
#реклама 16+
mosdigitals.ru
О рекламодателе
🤔 Какая основная причина для использования SSR?
SSR (Server-Side Rendering):
- Улучшает скорость загрузки первого экрана (первая отрисовка приходит сразу с сервера).
- Обеспечивает SEO-оптимизацию, поскольку поисковики получают готовый HTML.
- Полезен для динамического контента, где важна предзагрузка.
Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚 Базу знаний
🤔 Что такое нотация о-большое?
O-большое (Big O) — это способ описания эффективности алгоритма в зависимости от размера входных данных. Она показывает, как быстро растёт время выполнения или использование памяти при увеличении количества входных данных.
🚩Зачем нужна O-большое?
Когда мы пишем код, важно понимать, насколько он эффективен, особенно при работе с большими массивами или сложными вычислениями.
Big O помогает:
- Оценить время работы алгоритма.
- Понять, как алгоритм масштабируется.
- Сравнить разные алгоритмы и выбрать лучший.
🚩Примеры сложности алгоритмов
O(1) – Константное время
function getFirstElement(arr) {
return arr[0]; // Не зависит от размера массива
}
O(N) – Линейное время
function findElement(arr, target) {
for (let i = 0; i < arr.length; i++) {
if (arr[i] === target) return i;
}
return -1;
}
O(N²) – Квадратичное время (плохо)
function bubbleSort(arr) {
for (let i = 0; i < arr.length; i++) {
for (let j = 0; j < arr.length; j++) {
if (arr[i] > arr[j]) {
[arr[i], arr[j]] = [arr[j], arr[i]];
}
}
}
return arr;
}
O(log N) – Логарифмическое время (оптимально)
function binarySearch(arr, target) {
let left = 0, right = arr.length - 1;
while (left <= right) {
let mid = Math.floor((left + right) / 2);
if (arr[mid] === target) return mid;
if (arr[mid] < target) left = mid + 1;
else right = mid - 1;
}
return -1;
}
Ставь 👍 и забирай 📚 Базу знаний