Frontend Interview - собеседования по Javascript / Html / Css

Метод includes() в JavaScript Этот метод определён у массивов и строк. - Для массивов: проверяет, есть ли искомый элемент в массиве. - Для строк: проверяет, есть ли искомая подстрока в строке. Возвращает true, если искомый элемент нашёлся и false — если нет. Метод принимает один аргумент — значение, которое нужно проверить. Массив:

 const dead = ["Joffrey", "Ned Stark", "Night king"]
 const isJonDead = dead.includes("Jon Snow")
 console.log(isJonDead) // напечатает false
 const isJoffreyDead = dead.includes("Joffrey")
 console.log(isJoffreyDead) // напечатает true

Строка: const text = "Посмотри, ведь это рядом наша панда. Мы бежим с тобой как-будто от гепарда." console.log(text.includes("панда")) // true console.log(text.includes("Обезьяна")) // false // поиск идет с учетом регистра console.log(text.includes("Панда")) // false 👉 @frontendInterview

👉 @frontendInterview

Ищем фронта. Платим много! Специально для Вас, собираем топовые вакансии для фронтов на канале @job_frontend. Подпишись чтобы не упустить свой шанс получить лучший оффер!

Цикл «do…while» При написании скриптов зачастую встаёт задача сделать однотипное действие много раз. Проверку условия можно разместить под телом цикла, используя специальный синтаксис do..while:

 do {
   // тело цикла
 } while (condition);

Цикл сначала выполнит тело, а затем проверит условие condition, и пока его значение равно true, он будет выполняться снова и снова. Например:

 let i = 0;
 do {
   alert( i );
   i++;
 } while (i < 3);

Такая форма синтаксиса оправдана, если вы хотите, чтобы тело цикла выполнилось хотя бы один раз, даже если условие окажется ложным. На практике чаще используется форма с предусловием: while(…) {…}. 👉 @frontendInterview

Array.prototype.reverse() Создайте свою версию метода reverse. Он должен "разворачивать" массив. Пример: const input = [1, 2, 3, 4]; input.reverse(); // == [4, 3, 2, 1] // returned by .reverse() 👉 @frontendInterview

Hacking APIs: Breaking Web Application Programming Interfaces (Final Release) (2022) Вы узнаете, как API-интерфейсы REST и GraphQL работают в продакшене и создадите стенд для тестирования API с помощью Burp Suite и Postman. Затем вы освоите инструменты для разведки, анализа эндпоинтов, такие как Kiterunner и OWASP Amass. Далее вы научитесь выполнять распространенные атаки, нацеленные на механизмы аутентификации API, и находить уязвимости, обычно встречающиеся в веб-приложениях 👉 @frontendInterview

👉 @frontendInterview

👉 @frontendInterview

Делимся нашим приватным архивом на 1300ГБ курсов: 1. Обучение Python с нуля 2. Обучение JavaScript с нуля 3. Обучение С++ с нуля 4. Обучение С# с нуля 5. Обучение HTML/CSS с нуля 6. Обучение Java с нуля 7. Обучение SQL/GO/PHP с нуля Вход открыт 24 часа, это наш подарок для вас ❤

​Как заставить код работать в старых браузерах? Когда мы используем современные возможности JavaScript, некоторые движки могут не поддерживать их. Как было сказано выше, не везде реализованы все функции. И тут приходит на помощь Babel. Babel – это транспилер. Он переписывает современный JavaScript-код в предыдущий стандарт. На самом деле, есть две части Babel: Во-первых, транспилер, который переписывает код. Разработчик запускает Babel на своём компьютере. Он переписывает код в старый стандарт. И после этого код отправляется на сайт. Современные сборщики проектов, такие как webpack или brunch, предоставляют возможность запускать транспилер автоматически после каждого изменения кода, что позволяет экономить время. Во-вторых, полифил. Новые возможности языка могут включать встроенные функции и синтаксические конструкции. Транспилер переписывает код, преобразовывая новые синтаксические конструкции в старые. Но что касается новых встроенных функций, нам нужно их как-то реализовать. JavaScript является высокодинамичным языком, скрипты могут добавлять/изменять любые функции, чтобы они вели себя в соответствии с современным стандартом. Термин «полифил» означает, что скрипт «заполняет» пробелы и добавляет современные функции. Таким образом, чтобы современные функции поддерживались в старых движках, нам надо установить транспилер и добавить полифил. 👉 @frontendInterview

Найти работу во Frontend можно 2 методами: Первый. Бесконечно скроллить HeadHunter и пытаться что-то выклевать на LinkedIn. Офигеть от условий и закрыть. Второй. Подписаться на React Job. Это база адекватных предложений, где даже для новичков много мест с хорошей з/п. Тут найдете работу как в Яндексе (именно сюда крупняки присылают вакансии напрямую), так и в молодых стартапах! В общем, не теряйте времени и находите работу в 2 клика: @job_react

👉 @frontendInterview

Профессия веб-дизайнера в наше время востребована и хорошо оплачивается! Есть два варианта бесплатно обучиться веб-дизайну: 1. Самостоятельно очень долго изучать информацию, делать кучу ошибок и тратить своё время неразумно. 2. Подписаться на канал @figma_russia и обучаться прямо в телеграмме! Быстро, просто и без воды. ⚡️Не упусти свою возможность стать веб-дизайнером и зарабатывать на этом неплохие деньги.

Как использовать media выражения в JS? Чтобы определить, соответствует ли документ строке медиа-запроса в JavaScript, мы используем метод matchMedia(). Несмотря на то, что он официально является частью спецификации модуля представления объектной модели CSS, находящейся в статусе рабочего проекта, его поддержка браузером великолепна начиная с Internet Explorer 10 с глобальным охватом 98,6%. Использование почти идентично медиа-запросам в CSS. Мы передаем строку медиа-запроса в matchMedia(), а затем проверяем свойство .matches. const mediaQuery = window.matchMedia('(min-width: 768px)') Медиа-запрос вернет MediaQueryList. Это объект, который хранит информацию о медиа-запросе, и нам нужно ключевое свойство .matches. Это логическое свойство только для чтения, которое возвращает true, если документ соответствует мультимедийному запросу. const mediaQuery = window.matchMedia('(min-width: 768px)') if (mediaQuery.matches) { alert('Media Query Matched!') }