Address
:
[Go to site:
main page
,
start
]
Usuń skrypty
Akceptuj cookies
Pokaż obrazy
Użyj Referer
Rotate13
Base64
Usu meta tagi
Usuń tytuł srony
Sesja cookies
Показать задачи
Язык JavaScript
Введение
Введение в JavaScript
Справочники и спецификации
Редакторы кода
Консоль разработчика
Основы JavaScript
Привет, мир!
Вызвать alert
Покажите сообщение с помощью внешнего скрипта
Структура кода
Строгий режим — "use strict"
Переменные
Работа с переменными
Придумайте правильные имена
Какие буквы (заглавные или строчные) использовать для имён констант?
Типы данных
Шаблонные строки
Взаимодействие: alert, prompt, confirm
Простая страница
Преобразование типов
Базовые операторы, математика
Постфиксная и префиксная формы
Результат присваивания
Преобразование типов
Исправьте сложение
Операторы сравнения
Операторы сравнения
Условное ветвление: if, '?'
if (строка с нулём)
Название JavaScript
Покажите знак числа
Перепишите 'if' в '?'
Перепишите 'if..else' в '?'
Логические операторы
Что выведет alert (ИЛИ)?
Что выведет alert (ИЛИ)?
Что выведет alert (И)?
Что выведет alert (И)?
Что выведет этот код?
Что выведет этот код (||=, &&=)?
Проверка значения из диапазона
Проверка значения вне диапазона
Вопрос об "if"
Проверка логина
Операторы нулевого слияния и присваивания: '??', '??='
Что выведет этот код?
Какой будет результат выполнения этого кода?
Перепишите код используя операторы ??, ??=
Циклы while и for
Последнее значение цикла
Какие значения выведет цикл while?
Какие значения выведет цикл for?
Выведите чётные числа
Замените for на while
Повторять цикл, пока ввод неверен
Вывести простые числа
Конструкция "switch"
Напишите "if", аналогичный "switch"
Переписать условия "if" на "switch"
Функции
Обязателен ли "else"?
Перепишите функцию, используя оператор '?' или '||'
Функция min(a, b)
Функция pow(x,n)
Function Expression
Стрелочные функции, основы
Перепишите с использованием функции-стрелки
Особенности JavaScript
Качество кода
Отладка в браузере
Советы по стилю кода
Плохой стиль
Комментарии
Ниндзя-код
Автоматическое тестирование c использованием фреймворка Mocha
Что не так с этим тестом?
Полифилы
Объекты: основы
Объекты
Привет, object
Проверка на пустоту
Объекты-константы?
Сумма свойств объекта
Умножаем все числовые свойства на 2
Копирование объектов и ссылки
Сборка мусора
Методы объекта, "this"
Использование "this" в литерале объекта
Создайте калькулятор
Цепь вызовов
Конструктор, оператор "new"
Две функции - один объект
Создайте калькулятор при помощи конструктора, new Calculator
Создайте new Accumulator
Опциональная цепочка '?.'
Тип данных Symbol
Преобразование объектов в примитивы
Типы данных
Методы примитивов
Можно ли добавить свойство строке?
Числа
Сумма пользовательских чисел
Почему 6.35.toFixed(1) == 6.3?
Ввод числового значения
Бесконечный цикл по ошибке
Случайное число от min до max
Случайное целое число от min до max
Строки
Сделать первый символ заглавным
Проверка на спам
Усечение строки
Выделить число
Массивы
Скопирован ли массив?
Операции с массивами
Вызов в контексте массива
Сумма введённых чисел
Подмассив наибольшей суммы
Методы массивов
Переведите текст вида border-left-width в borderLeftWidth
Фильтрация по диапазону
Фильтрация по диапазону "на месте"
Сортировать в порядке по убыванию
Скопировать и отсортировать массив
Создать расширяемый калькулятор
Трансформировать в массив имён
Трансформировать в объекты
Отсортировать пользователей по возрасту
Перемешайте массив
Получить средний возраст
Оставить уникальные элементы массива
Создайте объект с ключами из массива
Перебираемые объекты
Map и Set
Фильтрация уникальных элементов массива
Отфильтруйте анаграммы
Перебираемые ключи
WeakMap и WeakSet
Хранение отметок "не прочитано"
Хранение времени прочтения
Object.keys, values, entries
Сумма свойств объекта
Подсчёт количества свойств объекта
Деструктурирующее присваивание
Деструктурирующее присваивание
Максимальная зарплата
Дата и время
Создайте дату
Покажите день недели
День недели в европейской нумерации
Какой день месяца был много дней назад?
Последнее число месяца?
Сколько сегодня прошло секунд?
Сколько секунд осталось до завтра?
Форматирование относительной даты
Формат JSON, метод toJSON
Преобразуйте объект в JSON, а затем обратно в обычный объект
Исключить обратные ссылки
Продвинутая работа с функциями
Рекурсия и стек
Вычислить сумму чисел до данного
Вычислить факториал
Числа Фибоначчи
Вывод односвязного списка
Вывод односвязного списка в обратном порядке
Остаточные параметры и оператор расширения
Область видимости переменных, замыкание
Учитывает ли функция последние изменения?
Какие переменные доступны?
Независимы ли счётчики?
Объект счётчика
Функция внутри if
Сумма с помощью замыканий
Видна ли переменная?
Фильтрация с помощью функции
Сортировать по полю
Армия функций
Устаревшее ключевое слово "var"
Глобальный объект
Объект функции, NFE
Установка и уменьшение значения счётчика
Сумма с произвольным количеством скобок
Синтаксис "new Function"
Планирование: setTimeout и setInterval
Вывод каждую секунду
Что покажет setTimeout?
Декораторы и переадресация вызова, call/apply
Декоратор-шпион
Задерживающий декоратор
Декоратор debounce
Тормозящий (throttling) декоратор
Привязка контекста к функции
Связанная функция как метод
Повторный bind
Свойство функции после bind
Исправьте функцию, теряющую "this"
Использование частично применённой функции для логина
Повторяем стрелочные функции
Свойства объекта, их конфигурация
Флаги и дескрипторы свойств
Свойства - геттеры и сеттеры
Прототипы, наследование
Прототипное наследование
Работа с прототипами
Алгоритм поиска
Куда будет произведена запись?
Почему наедаются оба хомяка?
F.prototype
Изменяем "prototype"
Создайте новый объект с помощью уже существующего
Встроенные прототипы
Добавить функциям метод "f.defer(ms)"
Добавьте функциям декорирующий метод "defer()"
Методы прототипов, объекты без свойства __proto__
Добавьте toString в словарь
Разница между вызовами
Классы
Класс: базовый синтаксис
Перепишите класс
Наследование классов
Ошибка создания экземпляра класса
Улучшенные часы
Статические свойства и методы
Класс расширяет объект?
Приватные и защищённые методы и свойства
Расширение встроенных классов
Проверка класса: "instanceof"
Странный instanceof
Примеси
Обработка ошибок
Обработка ошибок, "try..catch"
Finally или просто код?
Пользовательские ошибки, расширение Error
Наследование от SyntaxError
Промисы, async/await
Введение: колбэки
Промисы
Можно ли "перевыполнить" промис?
Задержка на промисах
Анимация круга с помощью промиса
Цепочка промисов
Промисы: сравните then и catch
Промисы: обработка ошибок
Ошибка в setTimeout
Promise API
Промисификация
Микрозадачи
Async/await
Перепишите, используя async/await
Перепишите, используя async/await
Вызовите async–функцию из "обычной"
Генераторы, продвинутая итерация
Генераторы
Псевдослучайный генератор
Асинхронные итераторы и генераторы
Модули
Модули, введение
Экспорт и импорт
Динамические импорты
Разное
Proxy и Reflect
Ошибка при чтении несуществующего свойства
Получение элемента массива с отрицательной позиции
Observable
Eval: выполнение строки кода
Eval-калькулятор
Каррирование
Ссылочный тип
Проверка синтаксиса
Объясните значение "this"
Побитовые операторы
Побитовый оператор и значение
Проверка, целое ли число
Симметричны ли операции ^, |, &?
Почему результат разный?
BigInt
Юникод, внутреннее устройство строк
Intl: интернационализация в JavaScript
Отсортируйте массив с буквой ё
WeakRef и FinalizationRegistry
Браузер: документ, события, интерфейсы
Документ
Браузерное окружение, спецификации
DOM-дерево
Навигация по DOM-элементам
Дочерние элементы в DOM
Вопрос о соседях
Выделите ячейки по диагонали
Поиск: getElement*, querySelector*
Поиск элементов
Свойства узлов: тип, тег и содержимое
Считаем потомков
Что содержит свойство nodeType?
Тег в комментарии
Где в DOM-иерархии "document"?
Атрибуты и свойства
Получите атрибут
Сделайте внешние ссылки оранжевыми
Изменение документа
createTextNode vs innerHTML vs textContent
Очистите элемент
Почему остаётся "aaa"?
Создайте список
Создайте дерево из объекта
Выведите список потомков в дереве
Создайте календарь в виде таблицы
Цветные часы с использованием setInterval
Вставьте HTML в список
Сортировка таблицы
Стили и классы
Создать уведомление
Размеры и прокрутка элементов
Найти размер прокрутки снизу
Узнать ширину полосы прокрутки
Поместите мяч в центр поля
В чём отличие CSS-свойств width и clientWidth
Размеры и прокрутка окна
Координаты
Найдите координаты точек относительно окна браузера
Покажите заметку рядом с элементом
Покажите заметку около элемента (абсолютное позиционирование)
Расположите заметку внутри элемента (абсолютное позиционирование)
Введение в события
Введение в браузерные события
Скрыть элемент по нажатию кнопки
Спрятать себя
Какой обработчик запустится?
Передвиньте мяч по полю
Создать раскрывающееся меню
Добавить кнопку закрытия
Карусель
Всплытие и погружение
Делегирование событий
Спрячьте сообщения с помощью делегирования
Раскрывающееся дерево
Сортируемая таблица
Поведение "подсказка"
Действия браузера по умолчанию
Почему не работает return false?
Поймайте переход по ссылке
Галерея изображений
Генерация пользовательских событий
Интерфейсные события
Основы событий мыши
Выделяемый список
Движение мыши: mouseover/out, mouseenter/leave
Улучшенная подсказка
"Умная" подсказка
Drag'n'Drop с событиями мыши
Слайдер
Расставить супергероев по полю
Клавиатура: keydown и keyup
Отследить одновременное нажатие
События указателя
Прокрутка
Бесконечная страница
Кнопка вверх/вниз
Загрузка видимых изображений
Формы, элементы управления
Свойства и методы формы
Добавьте пункт к выпадающему списку
Фокусировка: focus/blur
Редактируемый div
Редактирование TD по клику
Мышь, управляемая клавиатурой
События: change, input, cut, copy, paste
Депозитный калькулятор
Отправка формы: событие и метод submit
Модальное диалоговое окно с формой
Загрузка документа и ресурсов
Страница: DOMContentLoaded, load, beforeunload, unload
Скрипты: async, defer
Загрузка ресурсов: onload и onerror
Загрузите изображения с колбэком
Разное
MutationObserver: наблюдатель за изменениями
Selection и Range
Событийный цикл: микрозадачи и макрозадачи
Что код выведет в консоли?
Что код выведет в консоли?
Тематические разделы
Фреймы и окна
Открытие окон и методы window
Общение между окнами
Атака типа clickjacking
Бинарные данные и файлы
ArrayBuffer, бинарные массивы
Соедините типизированные массивы
TextDecoder и TextEncoder
Blob
File и FileReader
Сетевые запросы
Fetch
Получите данные о пользователях GitHub
FormData
Fetch: ход загрузки
Fetch: прерывание запроса
Fetch: запросы на другие сайты
Почему нам нужен Origin?
Fetch API
Объекты URL
XMLHttpRequest
Возобновляемая загрузка файлов
Длинные опросы
WebSocket
Server Sent Events
Хранение данных в браузере
Куки, document.cookie
LocalStorage, sessionStorage
Автосохранение поля формы
IndexedDB
Анимация
Кривые Безье
CSS-анимации
Анимировать самолёт (CSS)
Анимировать самолёт с перелётом (CSS)
Анимированный круг
Анимация круга с помощью колбэка
JavaScript-анимации
Анимируйте прыгающий мячик
Анимируйте мячик, прыгающий вправо
Веб-компоненты
С орбитальной высоты
Пользовательские элементы (Custom Elements)
Элемент "живой таймер"
Shadow DOM
Элемент "template"
Слоты теневого DOM, композиция
Настройка стилей теневого DOM
Теневой DOM и события
Регулярные выражения
Введение: шаблоны и флаги
Символьные классы
Юникод: флаг "u" и класс \p{...}
Якоря: начало строки ^ и конец $
Регулярное выражение ^$
Многострочный режим якорей ^ $, флаг "m"
Граница слова: \b
Найдите время
Экранирование, специальные символы
Наборы и диапазоны [...]
Java[^script]
Найдите время как hh:mm или hh-mm
Квантификаторы +, *, ? и {n}
Как найти многоточие "..." ?
Регулярное выражение для HTML-цветов
Жадные и ленивые квантификаторы
Совпадение для /d+? d+?/
Поиск HTML-комментариев
Поиск HTML-тегов
Скобочные группы
Проверьте MAC-адрес
Найти цвет в формате #abc или #abcdef
Найти все числа
Разобрать выражение
Обратные ссылки в шаблоне: \N и \k<имя>
Альтернация (или) |
Найдите языки программирования
Найдите пары BB-кодов
Найдите строки в кавычках
Найдите весь тег
Опережающие и ретроспективные проверки
Найдите неотрицательные целые
Вставьте после фрагмента
Катастрофический возврат
Поиск на заданной позиции, флаг "y"
Методы RegExp и String
CSS для JavaScript-разработчика
О чём пойдёт речь
Единицы измерения: px, em, rem и другие
Все значения свойства display
Свойство float
Разница inline-block и float
Дерево с многострочными узлами
Постраничная навигация (CSS)
Добавить рамку, сохранив ширину
Свойство position
Модальное окно
Центрирование горизонтальное и вертикальное
Поместите мяч в центр поля (CSS)
Форма + модальное окно
vertical-align + table-cell + position = ?
Свойства font-size и line-height
Свойство white-space
Свойство outline
Свойство box-sizing
Свойство margin
Нерабочие margin?
Расположить текст внутри INPUT
Лишнее место под IMG
Свойство overflow
Особенности свойства height в %
Знаете ли вы селекторы?
Выберите элементы селектором
Отступ между элементами, размер одна строка
Отступ между парами, размером со строку
CSS-спрайты
Правила форматирования CSS