Cумма всех массивов
Создайте функцию, которая будет суммировать все значения в массиве и его подмассивах
Примеры:
👉 @frontendInterview
Создайте функцию, которая будет суммировать все значения в массиве и его подмассивах
Примеры:
arraySum([1, 2]) => 3
arraySum([1, 2, 3]) => 6
arraySum([1, 2, [1, 2]]) => 6👉 @frontendInterview
👍1
Плюсы TypeScript. Стоит ли на него переходить?
Typenoscript — это скриптовый язык, компилируемый в JavaScript. Разработка Microsoft, которая, на сегодняшний день, успела завоевать и фанатов и недоброжелателей. Главный вопрос для начинающих, и не только: «Зачем он мне нужен?».
Основные плюсы:
Строгая типизация
Позволяет более полно описывать свойства и методы объектов и классов, из-за чего пропадает необходимость,делать проверку всех, входящих в метод или функцию, аргументов:
Очевидно, что читать код на TypeScript будет проще, ввиду отсутствия нагромождений кода, характерные Javanoscript.
Многие проявляют интерес к JS, но их отпугивает некая хаотичность и непредсказуемость языка. Здесь Вам сильно поможет TS, который позволяет писать JS, более привычным и понятным путем.
Обратная совместимость с JS
И это, таки, приятный бонус, потому как не придется переписывать весь существующий код, чтобы поиграться с TS и написать лишь часть приложения на нем + есть возможность перенести все любимые библиотеки с JS на TS, если будет такая необходимость.
Широкая поддержка IDE
TypeScript, на данный момент, имеет поддержку в любой популярной IDE, включая IDEA, WebStorm, Sublime, Atom, и так далее. Соответственно, менять любимую среду разработки не придется.
👉 @frontendInterview
Typenoscript — это скриптовый язык, компилируемый в JavaScript. Разработка Microsoft, которая, на сегодняшний день, успела завоевать и фанатов и недоброжелателей. Главный вопрос для начинающих, и не только: «Зачем он мне нужен?».
Основные плюсы:
Строгая типизация
Позволяет более полно описывать свойства и методы объектов и классов, из-за чего пропадает необходимость,делать проверку всех, входящих в метод или функцию, аргументов:
function checkAllMyArgsAgain(check: CheckObject, me: MeObject, please: string): string {
return 'Какая проверка аргументов? Вы о чем? ';
}
Читабельность кодаОчевидно, что читать код на TypeScript будет проще, ввиду отсутствия нагромождений кода, характерные Javanoscript.
function checkMe(check, me) {
if(check && me) {
if(check){ ... }
if(me){ ... }
}
}
против function checkMe(check: CheckObject, me: MeObject) {
console.log('Ну круто же!');
}
Более легкий переход в мир JS из мира статикиМногие проявляют интерес к JS, но их отпугивает некая хаотичность и непредсказуемость языка. Здесь Вам сильно поможет TS, который позволяет писать JS, более привычным и понятным путем.
Обратная совместимость с JS
И это, таки, приятный бонус, потому как не придется переписывать весь существующий код, чтобы поиграться с TS и написать лишь часть приложения на нем + есть возможность перенести все любимые библиотеки с JS на TS, если будет такая необходимость.
Широкая поддержка IDE
TypeScript, на данный момент, имеет поддержку в любой популярной IDE, включая IDEA, WebStorm, Sublime, Atom, и так далее. Соответственно, менять любимую среду разработки не придется.
👉 @frontendInterview
👍1
Как использовать media выражения в JS?
Чтобы определить, соответствует ли документ строке медиа-запроса в JavaScript, мы используем метод matchMedia().
Несмотря на то, что он официально является частью спецификации модуля представления объектной модели CSS, находящейся в статусе рабочего проекта, его поддержка браузером великолепна начиная с Internet Explorer 10 с глобальным охватом 98,6%.
Использование почти идентично медиа-запросам в CSS. Мы передаем строку медиа-запроса в matchMedia(), а затем проверяем свойство .matches.
Чтобы определить, соответствует ли документ строке медиа-запроса в 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!')
}Как заставить код работать в старых браузерах?
Когда мы используем современные возможности JavaScript, некоторые движки могут не поддерживать их. Как было сказано выше, не везде реализованы все функции.
И тут приходит на помощь Babel.
Babel – это транспилер. Он переписывает современный JavaScript-код в предыдущий стандарт.
На самом деле, есть две части Babel:
Во-первых, транспилер, который переписывает код. Разработчик запускает Babel на своём компьютере. Он переписывает код в старый стандарт. И после этого код отправляется на сайт. Современные сборщики проектов, такие как webpack или brunch, предоставляют возможность запускать транспилер автоматически после каждого изменения кода, что позволяет экономить время.
Во-вторых, полифил.
Новые возможности языка могут включать встроенные функции и синтаксические конструкции. Транспилер переписывает код, преобразовывая новые синтаксические конструкции в старые. Но что касается новых встроенных функций, нам нужно их как-то реализовать. JavaScript является высокодинамичным языком, скрипты могут добавлять/изменять любые функции, чтобы они вели себя в соответствии с современным стандартом.
Термин «полифил» означает, что скрипт «заполняет» пробелы и добавляет современные функции.
Таким образом, чтобы современные функции поддерживались в старых движках, нам надо установить транспилер и добавить полифил.
👉 @frontendInterview
Когда мы используем современные возможности JavaScript, некоторые движки могут не поддерживать их. Как было сказано выше, не везде реализованы все функции.
И тут приходит на помощь Babel.
Babel – это транспилер. Он переписывает современный JavaScript-код в предыдущий стандарт.
На самом деле, есть две части Babel:
Во-первых, транспилер, который переписывает код. Разработчик запускает Babel на своём компьютере. Он переписывает код в старый стандарт. И после этого код отправляется на сайт. Современные сборщики проектов, такие как webpack или brunch, предоставляют возможность запускать транспилер автоматически после каждого изменения кода, что позволяет экономить время.
Во-вторых, полифил.
Новые возможности языка могут включать встроенные функции и синтаксические конструкции. Транспилер переписывает код, преобразовывая новые синтаксические конструкции в старые. Но что касается новых встроенных функций, нам нужно их как-то реализовать. JavaScript является высокодинамичным языком, скрипты могут добавлять/изменять любые функции, чтобы они вели себя в соответствии с современным стандартом.
Термин «полифил» означает, что скрипт «заполняет» пробелы и добавляет современные функции.
Таким образом, чтобы современные функции поддерживались в старых движках, нам надо установить транспилер и добавить полифил.
👉 @frontendInterview
Hacking APIs: Breaking Web Application Programming Interfaces (Final Release) (2022)
Вы узнаете, как API-интерфейсы REST и GraphQL работают в продакшене и создадите стенд для тестирования API с помощью Burp Suite и Postman. Затем вы освоите инструменты для разведки, анализа эндпоинтов, такие как Kiterunner и OWASP Amass. Далее вы научитесь выполнять распространенные атаки, нацеленные на механизмы аутентификации API, и находить уязвимости, обычно встречающиеся в веб-приложениях
👉 @frontendInterview
Вы узнаете, как API-интерфейсы REST и GraphQL работают в продакшене и создадите стенд для тестирования API с помощью Burp Suite и Postman. Затем вы освоите инструменты для разведки, анализа эндпоинтов, такие как Kiterunner и OWASP Amass. Далее вы научитесь выполнять распространенные атаки, нацеленные на механизмы аутентификации API, и находить уязвимости, обычно встречающиеся в веб-приложениях
👉 @frontendInterview
👍1
Array.prototype.reverse()
Создайте свою версию метода reverse. Он должен "разворачивать" массив.
Пример:
👉 @frontendInterview
Создайте свою версию метода reverse. Он должен "разворачивать" массив.
Пример:
const input = [1, 2, 3, 4];
input.reverse(); // == [4, 3, 2, 1] // returned by .reverse()👉 @frontendInterview
Цикл «do…while»
При написании скриптов зачастую встаёт задача сделать однотипное действие много раз.
Проверку условия можно разместить под телом цикла, используя специальный синтаксис do..while:
Например:
👉 @frontendInterview
При написании скриптов зачастую встаёт задача сделать однотипное действие много раз.
Проверку условия можно разместить под телом цикла, используя специальный синтаксис do..while:
do {
// тело цикла
} while (condition);
Цикл сначала выполнит тело, а затем проверит условие condition, и пока его значение равно true, он будет выполняться снова и снова.Например:
let i = 0;Такая форма синтаксиса оправдана, если вы хотите, чтобы тело цикла выполнилось хотя бы один раз, даже если условие окажется ложным. На практике чаще используется форма с предусловием:
do {
alert( i );
i++;
} while (i < 3);
while(…) {…}.👉 @frontendInterview
Каково значение свойства line-height у элемента section?
Anonymous Quiz
6%
60px
17%
40px
3%
120px
23%
80px
51%
20px
Метод includes() в JavaScript
Этот метод определён у массивов и строк.
- Для массивов: проверяет, есть ли искомый элемент в массиве.
- Для строк: проверяет, есть ли искомая подстрока в строке.
Возвращает true, если искомый элемент нашёлся и false — если нет.
Метод принимает один аргумент — значение, которое нужно проверить.
Массив:
👉 @frontendInterview
Этот метод определён у массивов и строк.
- Для массивов: проверяет, есть ли искомый элемент в массиве.
- Для строк: проверяет, есть ли искомая подстрока в строке.
Возвращает 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
👍7
Кто ты и что ты здесь делаешь?
Anonymous Poll
34%
Мидл - сеньор, черпаю новые знания, слежу за новостями
38%
Джун, работаю, активно обучаюсь
28%
Присматриваюсь к фронтенду, пока не в IT
🔴 Для тех кто ответил: присматриваюсь
Есть вариант быстро стартануть карьеру и начать зарабатывать от 60к меньше чем через год
Вот самый полный курс по фронту на сегодня:
Профессия Frontend-разработчик с нуля до PRO
А вот причины почему надо идти:
📌 Сезонная скидка на курс - 50%
📌 Гарантируют трудоустройство
📌 Первые полгода вы учитесь бесплатно
Есть вариант быстро стартануть карьеру и начать зарабатывать от 60к меньше чем через год
Вот самый полный курс по фронту на сегодня:
Профессия Frontend-разработчик с нуля до PRO
А вот причины почему надо идти:
📌 Сезонная скидка на курс - 50%
📌 Гарантируют трудоустройство
📌 Первые полгода вы учитесь бесплатно
👎3