Squares sequence
Выполните функцию, которая возвращает массив длины n, начинающийся с заданного числа x и квадратов предыдущего числа. Если n отрицательно или равно нулю, верните пустой массив.
Примеры:
👉 @frontendInterview
Выполните функцию, которая возвращает массив длины n, начинающийся с заданного числа x и квадратов предыдущего числа. Если n отрицательно или равно нулю, верните пустой массив.
Примеры:
2, 5 --> [2, 4, 16, 256, 65536] 3, 3 --> [3, 9, 81]👉 @frontendInterview
👎1
Страдаете от недостатка заказов на фрилансе?
Конкуренция на крупных биржах просто зашкаливает. Новички давят демпингом, а старички – авторитетом.
@LinkUp.market – молодая, но очень перcпективная фриланс биржа внутри Telegram. Тут можно легко построить карьеру фрилансера, прокачать личный бренд и собрать базу постоянных клиентов, которые будут кормить вас долгие годы.
Свой первый заказ сможете получить уже сегодня
Вот ссылка – https://t.iss.one/+sxHaL9B-asZlNTQy
🚀 Дерзайте!
Конкуренция на крупных биржах просто зашкаливает. Новички давят демпингом, а старички – авторитетом.
@LinkUp.market – молодая, но очень перcпективная фриланс биржа внутри Telegram. Тут можно легко построить карьеру фрилансера, прокачать личный бренд и собрать базу постоянных клиентов, которые будут кормить вас долгие годы.
Свой первый заказ сможете получить уже сегодня
Вот ссылка – https://t.iss.one/+sxHaL9B-asZlNTQy
🚀 Дерзайте!
В чём различия между Long-Polling, Websockets и Server-Sent Events?
Ajax Long-Polling
1. Клиент запрашивает веб-страницу с сервера, используя обычный HTTP.
2. Клиент получает запрошенную веб-страницу и выполняет JavaScript на странице, которая запрашивает файл с сервера.
3. Сервер не сразу отвечает запрошенной информацией, а ждёт, пока не появится новая информация.
4. Когда появляется новая информация, сервер отвечает новой информацией.
5. Клиент получает новую информацию и немедленно отправляет другой запрос на сервер, перезапуская процесс.
HTML Websockets
1. Клиент запрашивает веб-страницу с сервера, используя обычный HTTP.
2. Клиент получает запрошенную веб-страницу и выполняет JavaScript на странице, которая открывает соединение с сервером.
3. Сервер и клиент теперь могут отправлять друг другу сообщения, когда доступны новые данные (с обеих сторон).
- Трафик в реальном времени от сервера к клиенту и от клиента к серверу.
- С помощью WebSocket можно подключиться к серверу из другого домена.
- Также можно использовать сторонний сервер веб-сокетов. Таким образом, вам нужно будет реализовать только клиентскую часть.
Server-Sent Events
1. Клиент запрашивает веб-страницу с сервера, используя обычный HTTP.
2. Клиент получает запрошенную веб-страницу и выполняет JavaScript на странице, которая открывает соединение сервером.
4. Сервер отправляет событие клиенту, когда появляется новая информация.
- Трафик в реальном времени от сервера к клиенту.
- Соединения с серверами из других доменов возможны только при правильных настойках CORS.
👉 @frontendInterview
Ajax Long-Polling
1. Клиент запрашивает веб-страницу с сервера, используя обычный HTTP.
2. Клиент получает запрошенную веб-страницу и выполняет JavaScript на странице, которая запрашивает файл с сервера.
3. Сервер не сразу отвечает запрошенной информацией, а ждёт, пока не появится новая информация.
4. Когда появляется новая информация, сервер отвечает новой информацией.
5. Клиент получает новую информацию и немедленно отправляет другой запрос на сервер, перезапуская процесс.
HTML Websockets
1. Клиент запрашивает веб-страницу с сервера, используя обычный HTTP.
2. Клиент получает запрошенную веб-страницу и выполняет JavaScript на странице, которая открывает соединение с сервером.
3. Сервер и клиент теперь могут отправлять друг другу сообщения, когда доступны новые данные (с обеих сторон).
- Трафик в реальном времени от сервера к клиенту и от клиента к серверу.
- С помощью WebSocket можно подключиться к серверу из другого домена.
- Также можно использовать сторонний сервер веб-сокетов. Таким образом, вам нужно будет реализовать только клиентскую часть.
Server-Sent Events
1. Клиент запрашивает веб-страницу с сервера, используя обычный HTTP.
2. Клиент получает запрошенную веб-страницу и выполняет JavaScript на странице, которая открывает соединение сервером.
4. Сервер отправляет событие клиенту, когда появляется новая информация.
- Трафик в реальном времени от сервера к клиенту.
- Соединения с серверами из других доменов возможны только при правильных настойках CORS.
👉 @frontendInterview
👍9❤2
Что делает эта функция?
Anonymous Quiz
84%
Складывает все элементы массива
6%
Находит наибольшее число в массиве
10%
Возвращает функцию reduce
❤2
Forwarded from Юрий
Оставьте сомнения и сделайте уверенный шаг к карьере веб-разработчика на мини-курсе Skillbox. Научитесь зарабатывать на фрилансе! Вы с нуля создадите 3 проекта — сайт, приложение и сервис — и изучите основы самых востребованных технологий.
Регистрация: https://epic.st/I68Wze
На мини-курсе вы научитесь:
— создавать веб-страницы, используя язык разметки HTML и технологию CSS;
— реализовывать серверную часть (backend) веб-приложений на языке PHP;
— работать с базой данных MySQL при помощи языка запросов SQL;
— создавать приложения на языке программирования JavaScript;
— автоматически получать информацию с других сайтов;
— размещать сайты в интернете.
📍Спикер — Даниил Пилипенко, основатель и директор центра подбора IT-специалистов SymbioWay. 19 лет работает в сфере Java и веб-разработки, руководит командами разработки в разных проектах.
Каждый участник получит подборку полезных материалов, а также подарки от Skillbox!
🌟Полезные знания — на расстоянии клика. Учитесь где угодно и когда угодно!
Реклама. ЧОУ ДПО «Образовательные технологии «Скилбокс (Коробка навыков)», ИНН: 9704088880
Регистрация: https://epic.st/I68Wze
На мини-курсе вы научитесь:
— создавать веб-страницы, используя язык разметки HTML и технологию CSS;
— реализовывать серверную часть (backend) веб-приложений на языке PHP;
— работать с базой данных MySQL при помощи языка запросов SQL;
— создавать приложения на языке программирования JavaScript;
— автоматически получать информацию с других сайтов;
— размещать сайты в интернете.
📍Спикер — Даниил Пилипенко, основатель и директор центра подбора IT-специалистов SymbioWay. 19 лет работает в сфере Java и веб-разработки, руководит командами разработки в разных проектах.
Каждый участник получит подборку полезных материалов, а также подарки от Skillbox!
🌟Полезные знания — на расстоянии клика. Учитесь где угодно и когда угодно!
Реклама. ЧОУ ДПО «Образовательные технологии «Скилбокс (Коробка навыков)», ИНН: 9704088880
👍2❤1
Дайте определение функции высшего порядка.
Функция высшего порядка — это любая функция, которая принимает одну или несколько функций в качестве аргументов, которые она использует для работы с данными, и/или возвращает функцию в качестве результата. Классическим примером является метод map, который принимает массив и функцию в качестве аргументов. Затем map использует эту функцию для преобразования каждого элемента в массиве, возвращая новый массив с преобразованными данными. Другими популярными примерами в JS являются filter и reduce.
👉 @frontendInterview
Функция высшего порядка — это любая функция, которая принимает одну или несколько функций в качестве аргументов, которые она использует для работы с данными, и/или возвращает функцию в качестве результата. Классическим примером является метод map, который принимает массив и функцию в качестве аргументов. Затем map использует эту функцию для преобразования каждого элемента в массиве, возвращая новый массив с преобразованными данными. Другими популярными примерами в JS являются filter и reduce.
👉 @frontendInterview
👍15👎1
Что возвращает функция?
Anonymous Quiz
19%
Всегда возвращает true
6%
Всегда возвращает false
75%
Если mood равно true, то вернёт "I like this", а иначе "I don't like this"
В чём разница между классом в ES6 и функцией-конструктором в ES5?
Основное отличие в конструкторе возникает при использовании наследования. Если мы хотим создать класс Student (который будет являться подклассом класса Person) и добавить поле studentId, то в дополнение к вышеописанному мы должны сделать следующее:
Наследование в синтаксисе ES5 является намного более многословным, а в ES6 более понятное и усваиваемое.
👉 @frontendInterview
Основное отличие в конструкторе возникает при использовании наследования. Если мы хотим создать класс Student (который будет являться подклассом класса Person) и добавить поле studentId, то в дополнение к вышеописанному мы должны сделать следующее:
// ES5 функция-конструктор
function Student(name, studentId) {
// Вызов конструктора суперкласса для инициализации производных от суперкласса членов.
Person.call(this, name);
// Инициализация собственных членов подкласса.
this.studentId = studentId;
}
Student.prototype = Object.create(Person.prototype);
Student.prototype.constructor = Student;
// ES6 класс
class Student extends Person {
constructor (name, studentId) {
super(name);
this.studentId = studentId;
}
}Наследование в синтаксисе ES5 является намного более многословным, а в ES6 более понятное и усваиваемое.
👉 @frontendInterview
👏9👍4
Изучаем vi и Vim. Не просто редакторы, 8-е издание
Среди текстовых редакторов, используемых программистами, самыми важными является vi и его вариации. В обновленном издании пользователи Unix и Linux изучат основы редактирования текста как в vi, так и в Vim (vi improved), прежде чем перейти к более продвинутым инструментам в каждой из программ. Авторы описывают основные новейшие версии Vim.
Если вы программист или компьютерный аналитик, либо работаете с веб- или консольными интерфейсами, Vim упростит решение сложных задач. Вы освоите многооконное редактирование, глобальный поиск/замену и прочие мощные инструменты для программистов, а также научитесь писать интерактивные макросы и сценарии, расширяющие возможности программы.
👉 @frontendInterview
Среди текстовых редакторов, используемых программистами, самыми важными является vi и его вариации. В обновленном издании пользователи Unix и Linux изучат основы редактирования текста как в vi, так и в Vim (vi improved), прежде чем перейти к более продвинутым инструментам в каждой из программ. Авторы описывают основные новейшие версии Vim.
Если вы программист или компьютерный аналитик, либо работаете с веб- или консольными интерфейсами, Vim упростит решение сложных задач. Вы освоите многооконное редактирование, глобальный поиск/замену и прочие мощные инструменты для программистов, а также научитесь писать интерактивные макросы и сценарии, расширяющие возможности программы.
👉 @frontendInterview
👍3❤2👎2
Самый высокий и самый низкий
В этой задаче вам дается строка чисел, разделенных пробелами, и вы должны вернуть наибольшее и наименьшее число
Примеры:
👉 @frontendInterview
В этой задаче вам дается строка чисел, разделенных пробелами, и вы должны вернуть наибольшее и наименьшее число
Примеры:
highAndLow("1 2 3 4 5"); // return "5 1"
highAndLow("1 2 -3 4 5"); // return "5 -3"
highAndLow("1 9 3 4 -5"); // return "9 -5"👉 @frontendInterview
👍2👎1🔥1
for...of
Инструкция for...of выполняет цикл обхода перечисляемых свойств итерируемого объекта.
Итерируемый объект можно воспринимать как коллекцию элементов. К итерируемым объектам относятся: Array, String, Map, Set, TypedArray, а также массивоподобные объекты такие как объект arguments и DOM-коллекции.
В каждой итерации цикла выполняются инструкции, которые могут ссылаться на значение текущего элемента коллекции.
Пример
Выводим форматированное представление для элементов объекта Map:
👉 @frontendInterview
Инструкция for...of выполняет цикл обхода перечисляемых свойств итерируемого объекта.
Итерируемый объект можно воспринимать как коллекцию элементов. К итерируемым объектам относятся: Array, String, Map, Set, TypedArray, а также массивоподобные объекты такие как объект arguments и DOM-коллекции.
В каждой итерации цикла выполняются инструкции, которые могут ссылаться на значение текущего элемента коллекции.
Пример
Выводим форматированное представление для элементов объекта Map:
const skills = new Map()
skills.set(1, 'JS')
skills.set(2, 'CSS')
skills.set(3, 'PHP')
for (let value of skills) {
console.log(`${value[0]}.`, value[1])
}
// 1. JS
// 2. CSS
// 3. PHP👉 @frontendInterview
👍9
Зачем нужен title в этом коде?
Anonymous Quiz
11%
Это тег, который определяет заголовок документа
61%
Это атрибут, который описывает содержимое элемента в виде всплывающей подсказки
27%
Это семантическая подпись для браузера
👍12
forced-colors
Одно из значений директивы
Режим принудительных цветов (forced colors mode) ограничивает количество цветов, чтобы повысить читаемость текста за счёт изменения контраста текста и фона. В основном используются цвета с высоким контрастом. Этот режим автоматически изменяет цвета и в системе, и на сайтах.
Когда браузер узнаёт о выборе режима принудительных цветов, он ограничивает цветовую палитру до небольшого набора цветов. С помощью forced-colors можно гибче настраивать поддержку этого режима на сайте.
Пример
Если посмотрите демку в режиме принудительных цветов без директивы и с ней, в первом случае иконка с отпечатком пальца останется чёрной (#000000), а во втором — перекрасится в белый цвет как у кнопки.
👉 @frontendInterview
Одно из значений директивы
@media для проверки пользовательских настроек. Отслеживает режим принудительных цветов. Одна из его реализаций — режим высокой контрастности в Windows.Режим принудительных цветов (forced colors mode) ограничивает количество цветов, чтобы повысить читаемость текста за счёт изменения контраста текста и фона. В основном используются цвета с высоким контрастом. Этот режим автоматически изменяет цвета и в системе, и на сайтах.
Когда браузер узнаёт о выборе режима принудительных цветов, он ограничивает цветовую палитру до небольшого набора цветов. С помощью forced-colors можно гибче настраивать поддержку этого режима на сайте.
Пример
<button class="button button-aqua">
<svg
xmlns="https://www.w3.org/2000/svg"
width="36"
height="36"
viewBox="0 0 24 24"
fill="none"
stroke="#000000"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="button-icon"
>
<path d="M2 12C2 6.5 6.5 2 12 2a10 10 0 0 1 8 4"/>
<path d="M5 19.5C5.5 18 6 15 6 12c0-.7.12-1.37.34-2"/>
<path d="M17.29 21.02c.12-.6.43-2.3.5-3.02"/>
<path d="M12 10a2 2 0 0 0-2 2c0 1.02-.1 2.51-.26 4"/>
<path d="M8.65 22c.21-.66.45-1.32.57-2"/>
<path d="M14 13.12c0 2.38 0 6.38-1 8.88"/>
<path d="M2 16h.01"/>
<path d="M21.8 16c.2-2 .131-5.354 0-6"/>
<path d="M9 6.8a6 6 0 0 1 9 5.2c0 .47 0 1.17-.02 2"/>
</svg>
<span class="visually-hidden">
Зайти по отпечатку пальца
</span>
</button> @media (forced-colors: active) {
.button-icon {
stroke: buttonText;
}
}Если посмотрите демку в режиме принудительных цветов без директивы и с ней, в первом случае иконка с отпечатком пальца останется чёрной (#000000), а во втором — перекрасится в белый цвет как у кнопки.
👉 @frontendInterview
🔥4