JS
💻 Для разработчиков

JavaScript Старт

11 тем, 99 уроков: переменные, операторы, условия, циклы, строки, числа, массивы, объекты, функции, DOM и финальные проекты

Что ты создашь
📘Прочный фундамент
Практика в браузере
🎯Мини-проекты
🎓Сертификат курса
📘 99 уроков1-2 вечера🎓 Продвинутый
🎯 Цель
Освоить JavaScript Старт
+1040XP
🏆СертификатPDF
🎓Курс пройден
Прогресс0 / 99 · 0%
Следующий шаг: Что такое JavaScript

Программа курса

01

Переменные и типы

0 / 8 уроков
  1. 01

    Что такое JavaScript

    Язык программированияconsole.logПервый запуск⚡ +10
    ▶ Сейчас
  2. 02

    Переменные: let и const

    Что такое переменнаяletconstПравила именования⚡ +10
    Открыт
  3. 03

    Строки

    Кавычки одинарные / двойныеШаблонные строки `${ }`Длина и склейка⚡ +10
    Открыт
  4. 04

    Числа

    Один тип `number`Целые и дробныеБазовые операции⚡ +10
    Открыт
  5. 05

    Логический тип: true и false

    `true` / `false`Сравнения возвращают booleanЛогические операторы⚡ +10
    Открыт
  6. 06

    null и undefined

    Два «нет значения»`undefined` — не присвоено`null` — пусто специально⚡ +10
    Открыт
  7. 07

    typeof — узнать тип

    Оператор `typeof`Возвращает строкуИзвестная странность с null⚡ +10
    Открыт
  8. 08

    Динамическая типизация

    Тип привязан к ЗНАЧЕНИЮПереприсваивание меняет типСравнение с другими языками⚡ +10
    Открыт
02

Операторы

0 / 6 уроков
  1. 09

    Арифметические операторы

    + - * /Как в математикеВозвращают число⚡ +10
    Открыт
  2. 10

    Деление: / и %

    Дробное `/`Остаток `%`Чётность через `% 2`⚡ +10
    Открыт
  3. 11

    Степень: **

    `a ** b`Современная замена `Math.pow`Право-ассоциативный⚡ +10
    Открыт
  4. 12

    Сокращения: +=, -=, *=, /=

    `x += 1`Эквивалент `x = x + 1`Все 4 операции⚡ +10
    Открыт
  5. 13

    Инкремент и декремент: ++ и --

    `x++` и `x--`Постфикс vs префиксКогда уместно⚡ +10
    Открыт
  6. 14

    Конкатенация строк: + и шаблоны

    `+` со строкамиШаблонные строки `${}`Когда что использовать⚡ +10
    Открыт
03

Условия

0 / 10 уроков
  1. 15

    if — простое условие

    Синтаксис `if`Блок `{ ... }`Когда срабатывает⚡ +10
    Открыт
  2. 16

    else — альтернативный путь

    `if ... else`Один из двух вариантовВместе всегда⚡ +10
    Открыт
  3. 17

    else if — несколько веток

    Цепочка `else if`Сверху внизПервое срабатывает — остальные нет⚡ +10
    Открыт
  4. 18

    Сравнение значений: == vs ===

    `===` строгое равенство`==` мягкое (с приведением)Почему всегда `===`⚡ +10
    Открыт
  5. 19

    Сравнение: <, >, <=, >=

    Реляционные операторыВозвращают `true`/`false`Чейнить нельзя⚡ +10
    Открыт
  6. 20

    Логические операторы: &&, ||, !

    `&&` — и`||` — или`!` — не⚡ +10
    Открыт
  7. 21

    Тернарный оператор: a ? b : c

    Короткая форма `if/else`Возвращает значениеКогда уместно⚡ +10
    Открыт
  8. 22

    switch — выбор по значению

    `switch (val)``case` + `break``default`⚡ +10
    Открыт
  9. 23

    truthy и falsy значения

    JS превращает в booleanFalsy: 6 особых значенийВсё остальное — truthy⚡ +10
    Открыт
  10. 24

    Современный JS: ?. и ??

    `?.` — optional chaining`??` — nullish coalescingЗащита от `null`/`undefined`⚡ +10
    Открыт
04

Циклы

0 / 10 уроков
  1. 25

    for — стандартный счётчик

    3 части в скобкахТело в `{ }`Когда использовать⚡ +10
    Открыт
  2. 26

    while — цикл с проверкой условия

    `while (условие) { ... }`Когда количество шагов неизвестноНе забудь обновлять⚡ +10
    Открыт
  3. 27

    do...while — выполнить хотя бы раз

    Тело сначала, проверка потомГарантирует один проходРедко, но бывает нужно⚡ +10
    Открыт
  4. 28

    for...of — пройти по элементам

    Цикл по массивуБез индексаСамый чистый способ⚡ +10
    Открыт
  5. 29

    for...in — пройти по ключам объекта

    Цикл по ключам объектаНЕ для массивов!Когда уместен⚡ +10
    Открыт
  6. 30

    break — выйти из цикла

    Прерывание досрочноСразу после `break`Только текущий цикл⚡ +10
    Открыт
  7. 31

    continue — пропустить шаг

    Перейти к следующей итерацииТекущая обрываетсяУдобно для фильтра⚡ +10
    Открыт
  8. 32

    .forEach — метод массива

    Метод массива, не циклПринимает функциюВместо `for...of` для простых случаев⚡ +10
    Открыт
  9. 33

    Вложенные циклы

    Цикл внутри циклаТаблицы / сеткиСложность растёт быстро⚡ +10
    Открыт
  10. 34

    Накопление: счётчик и сумма

    Шаблон счётчикаШаблон суммыОбъяви ДО цикла⚡ +10
    Открыт
05

Строки

0 / 10 уроков
  1. 35

    Длина строки и доступ к символам

    `.length``s[i]` и `s.charAt(i)`Индексация с 0⚡ +10
    Открыт
  2. 36

    Срез строки: .slice()

    `s.slice(start, end)``end` НЕ включаетсяОтрицательные индексы⚡ +10
    Открыт
  3. 37

    Регистр: .toUpperCase() и .toLowerCase()

    Все в верхний регистрВсе в нижнийВозвращают новую строку⚡ +10
    Открыт
  4. 38

    Поиск: .includes(), .indexOf()

    `.includes(sub)` → boolean`.indexOf(sub)` → число`-1` если не найдено⚡ +10
    Открыт
  5. 39

    Замена: .replace() и .replaceAll()

    Заменить ОДНО вхождение`.replaceAll` — всеВозвращает новую строку⚡ +10
    Открыт
  6. 40

    Разбиение и склейка: .split() и .join()

    `s.split(sep)` → массив`arr.join(sep)` → строкаЗеркальные операции⚡ +10
    Открыт
  7. 41

    .trim() — убрать пробелы по краям

    Убрать пробелы и `\n``.trimStart`, `.trimEnd`Перед сохранением вводов⚡ +10
    Открыт
  8. 42

    startsWith и endsWith

    `s.startsWith(prefix)``s.endsWith(suffix)`Возвращают boolean⚡ +10
    Открыт
  9. 43

    Многострочные шаблонные строки

    Бэктики позволяют переводы строк`\n` тоже работаетУдобно для шаблонов⚡ +10
    Открыт
  10. 44

    Сравнение строк и Number()

    Сравнение по алфавиту`Number("42")` → число`String(42)` → строка⚡ +10
    Открыт
06

Числа и Math

0 / 8 уроков
  1. 45

    Math.round, .floor, .ceil — округление

    `round` — к ближайшему`floor` — вниз`ceil` — вверх⚡ +10
    Открыт
  2. 46

    Math.abs, Math.sign

    `abs(x)` — модуль`sign(x)` — знак ±1 / 0Чисто-числовые⚡ +10
    Открыт
  3. 47

    Math.min и Math.max

    Минимум / максимум из аргументовС массивом — через `...`Принимают ЛЮБОЕ количество⚡ +10
    Открыт
  4. 48

    Math.random — случайные числа

    Возвращает 0 ≤ x < 1Целое в диапазонеИгры, сэмплинг, тесты⚡ +10
    Открыт
  5. 49

    parseInt и Number — парсинг чисел

    `Number("42")` — строгий`parseInt("42px")` — лояльный`+x` — короткий способ⚡ +10
    Открыт
  6. 50

    .toFixed() — форматирование дробных

    Указанное число знаков после запятойВозвращает СТРОКУ (!)Цены, проценты⚡ +10
    Открыт
  7. 51

    NaN, Infinity и проверки

    `NaN` — не число`Infinity` — бесконечность`Number.isNaN`, `Number.isFinite`⚡ +10
    Открыт
  8. 52

    Number.isInteger и проверка чисел

    `Number.isInteger(x)`Целое vs дробноеБезопасный диапазон⚡ +10
    Открыт
07

Массивы

0 / 12 уроков
  1. 53

    Создание массива и доступ

    `[a, b, c]``arr[i]`Индекс с 0⚡ +10
    Открыт
  2. 54

    .length и итерация

    `.length`for-цикл по индексуfor...of по элементам⚡ +10
    Открыт
  3. 55

    .push() и .pop() — конец массива

    `.push(x)` добавить`.pop()` забратьМутация!⚡ +10
    Открыт
  4. 56

    .shift() и .unshift() — начало массива

    `.unshift(x)` в начало`.shift()` забрать с началаМедленнее push/pop⚡ +10
    Открыт
  5. 57

    .indexOf() и .includes() — поиск

    `.includes(x)` → boolean`.indexOf(x)` → индекс / -1Сравнение через `===`⚡ +10
    Открыт
  6. 58

    .slice() — копия куска

    `arr.slice(start, end)`Возвращает НОВЫЙ массивНе мутирует⚡ +10
    Открыт
  7. 59

    .map() — преобразование

    Каждый элемент → новыйВозвращает массив той же длиныДекларативный стиль⚡ +10
    Открыт
  8. 60

    .filter() — отбор по условию

    Только подходящиеВозвращает НОВЫЙ массивДлина может быть меньше⚡ +10
    Открыт
  9. 61

    .reduce() — свёртка в одно значение

    `reduce(fn, init)`Сумма / счёт / max / minАккумулятор + текущий⚡ +10
    Открыт
  10. 62

    .find(), .some(), .every()

    `.find` — первый подходящий`.some` — есть хоть один?`.every` — все подходят?⚡ +10
    Открыт
  11. 63

    Spread `...` — копии и слияние

    `[...arr]` копия`[...a, ...b]` слияние`Math.max(...nums)`⚡ +10
    Открыт
  12. 64

    Сортировка: .sort()

    Сортирует на местеБез аргумента — лексикографическиСравнитель `(a, b) => a - b`⚡ +10
    Открыт
08

Объекты

0 / 10 уроков
  1. 65

    Создание объекта литералом

    `{ key: value }`Несколько свойствЗапятая между⚡ +10
    Открыт
  2. 66

    Доступ: точка vs квадратные скобки

    `obj.field``obj["field"]`Когда что нужно⚡ +10
    Открыт
  3. 67

    Изменение и добавление полей

    `obj.field = newVal`Новое поле — присвоитьРаботает с `const`⚡ +10
    Открыт
  4. 68

    delete — удалить поле

    `delete obj.field`Поле исчезаетИммутабельная альтернатива⚡ +10
    Открыт
  5. 69

    Object.keys, .values, .entries

    Все ключи / значения / парыВозвращают массивыДля итерации⚡ +10
    Открыт
  6. 70

    Деструктуризация объекта

    `const { a, b } = obj`Несколько полей разомЗначения по умолчанию⚡ +10
    Открыт
  7. 71

    Shorthand: { name } вместо { name: name }

    Имя совпадает — пиши короткоСовременный стильМеньше повторов⚡ +10
    Открыт
  8. 72

    Spread `...` для объектов

    `{ ...obj }` копия`{ ...a, ...b }` слияниеИммутабельные обновления⚡ +10
    Открыт
  9. 73

    Computed keys: { [key]: value }

    Динамический ключИмя из переменной`[...]` в литерале⚡ +10
    Открыт
  10. 74

    Методы и this

    Функция как поле`this` = объектНЕ стрелочные для методов⚡ +10
    Открыт
09

Функции

0 / 12 уроков
  1. 75

    Объявление функции

    `function name(args) { }`Параметры и `return`Вызов: `name(args)`⚡ +10
    Открыт
  2. 76

    Функция-выражение vs declaration

    `function name() { }``const name = function() { }`Hoisting различается⚡ +10
    Открыт
  3. 77

    Стрелочные функции

    `(args) => ...`Без `function` и `return`Современный стиль⚡ +10
    Открыт
  4. 78

    Параметры по умолчанию

    `function f(x = 10)`Если аргумент `undefined`Любое выражение⚡ +10
    Открыт
  5. 79

    Rest-параметры: ...args

    `function f(...args)`Собирает в массивЛюбое количество⚡ +10
    Открыт
  6. 80

    Spread при вызове

    Распаковать массив в аргументыУдобно с Math.max и т.п.Зеркало rest-параметров⚡ +10
    Открыт
  7. 81

    Замыкания (closures)

    Функция помнит окружениеСчётчик через closureИзоляция состояния⚡ +10
    Открыт
  8. 82

    Функция как аргумент (HOF)

    Higher-order functionsПередаём функцию.map / .filter — примеры⚡ +10
    Открыт
  9. 83

    Возврат функции из функции

    Фабрики функцийКаррирование (curry)Гибкие API⚡ +10
    Открыт
  10. 84

    this в обычной vs стрелочной

    Обычная — динамический thisСтрелочная — лексический thisКогда какую⚡ +10
    Открыт
  11. 85

    Hoisting: declaration vs expression

    Declaration «всплывает»Expression — нетСтиль современных команд⚡ +10
    Открыт
  12. 86

    IIFE — немедленно вызванная функция

    `(function() { ... })()`Создаёт изолированную областьСтарый паттерн⚡ +10
    Открыт
10

DOM и события

0 / 8 уроков
  1. 87

    getElementById — найти элемент

    Что такое DOMПоиск элемента по idЧтение и запись⚡ +10
    Открыт
  2. 88

    querySelector — CSS-селекторы

    Универсальный поискquerySelector vs querySelectorAllЗнакомый синтаксис CSS⚡ +10
    Открыт
  3. 89

    textContent vs innerHTML

    Изменить текст элементаtextContent — безопасноinnerHTML — с HTML-тегами⚡ +10
    Открыт
  4. 90

    element.style — менять CSS из JS

    Прямой доступ к стилямcamelCase вместо kebab-caseКогда лучше classList⚡ +10
    Открыт
  5. 91

    classList — переключать классы

    Стили через CSS, логика через JSadd/remove/toggle/containsЧище чем .style⚡ +10
    Открыт
  6. 92

    addEventListener — реагируем на клик

    Сердце интерактивностиСтрелочный колбэкevent vs e⚡ +10
    Открыт
  7. 93

    Создание элементов: createElement + appendChild

    Динамический DOMcreateElementappendChild / append⚡ +10
    Открыт
  8. 94

    Формы: input.value

    Чтение пользовательского ввода.value у inputСобытие input vs change⚡ +10
    Открыт
11

Финальные проекты

0 / 5 уроков
  1. 95

    Проект 1: Калькулятор

    Чтение из inputПреобразование в числоswitch для операции⚡ +10
    Открыт
  2. 96

    Проект 2: Счётчик кликов

    Состояние в переменнойОбновление UI на каждое событиеИдея localStorage⚡ +10
    Открыт
  3. 97

    Проект 3: TODO-список

    Массив задачПерерисовка спискаУдаление по индексу⚡ +10
    Открыт
  4. 98

    Проект 4: Таймер с setInterval

    setInterval / clearIntervalХранение id таймераСтарт / стоп / сброс⚡ +10
    Открыт
  5. 99

    Проект 5: Мини-квиз

    Массив объектов-вопросовПодсчёт правильных ответовФинальный отчёт
    Курс пройден
    Открыт
JavaScript Старт — курс программирования онлайн