Разделы
Типы данных
| Тип | Пример | typeof |
|---|---|---|
| Number | const n = 42; | "number" |
| String | const s = "hi"; | "string" |
| Boolean | const b = true; | "boolean" |
| Array | const a = [1,2,3]; | "object" |
| Object | const o = {x:1}; | "object" |
| undefined | переменная объявлена, но не задана | "undefined" |
| null | const x = null; | "object" |
Переменные: let, const, var
| Ключевое слово | Можно переприсвоить | Когда использовать |
|---|---|---|
| const | Нет | По умолчанию — для всего, что не будет меняться |
| let | Да | Когда значение переменной точно будет меняться |
| var | Да | Устаревший вариант, в новом коде не используется |
Операторы сравнения
| Оператор | Значение |
|---|---|
=== | Строгое равенство (сравнивает и значение, и тип) |
!== | Строгое неравенство |
== | Нестрогое равенство (с приведением типов, лучше избегать) |
> >= < <= | Больше, больше или равно, меньше, меньше или равно |
&& | Логическое И (оба условия истинны) |
|| | Логическое ИЛИ (хотя бы одно условие истинно) |
! | Логическое НЕ (инвертирует значение) |
Методы массивов
| Метод | Что делает | Пример |
|---|---|---|
| push() | Добавляет элемент в конец | arr.push(5) |
| pop() | Удаляет и возвращает последний элемент | arr.pop() |
| shift() | Удаляет и возвращает первый элемент | arr.shift() |
| unshift() | Добавляет элемент в начало | arr.unshift(0) |
| map() | Создаёт новый массив, применяя функцию к каждому элементу | arr.map(x => x * 2) |
| filter() | Создаёт новый массив только с подходящими элементами | arr.filter(x => x > 5) |
| forEach() | Проходит по каждому элементу, ничего не возвращает | arr.forEach(x => console.log(x)) |
| find() | Возвращает первый подходящий элемент | arr.find(x => x > 5) |
| includes() | Проверяет, есть ли значение в массиве | arr.includes(5) |
| slice() | Возвращает часть массива, не изменяя оригинал | arr.slice(1, 3) |
| splice() | Удаляет/добавляет элементы, изменяя оригинал | arr.splice(1, 2) |
| join() | Собирает массив в строку через разделитель | arr.join(", ") |
| reduce() | Сводит массив к одному значению (например, сумме) | arr.reduce((s,x)=>s+x, 0) |
Методы строк
| Метод / свойство | Что делает | Пример |
|---|---|---|
| length | Длина строки | "hello".length → 5 |
| toUpperCase() | Переводит в верхний регистр | "hi".toUpperCase() → "HI" |
| toLowerCase() | Переводит в нижний регистр | "HI".toLowerCase() → "hi" |
| slice() | Возвращает часть строки | "hello".slice(0,2) → "he" |
| split() | Разбивает строку в массив по разделителю | "a,b".split(",") → ["a","b"] |
| includes() | Проверяет, содержит ли строка подстроку | "hello".includes("ell") → true |
| trim() | Убирает пробелы по краям строки | " hi ".trim() → "hi" |
| replace() | Заменяет часть строки | "hi".replace("h","H") → "Hi" |
Условия и циклы
| Конструкция | Синтаксис |
|---|---|
| if / else | if (x > 5) { ... } else { ... } |
| if / else if / else | if (x>90){...} else if (x>70){...} else {...} |
| switch | switch (x) { case 1: ...; break; default: ...; } |
| for | for (let i = 0; i < 10; i++) { ... } |
| while | while (условие) { ... } |
Функции
| Вид | Синтаксис |
|---|---|
| Обычная функция | function sum(a, b) { return a + b; } |
| Функциональное выражение | const sum = function(a, b) { return a + b; }; |
| Стрелочная функция | const sum = (a, b) => a + b; |
| Вызов функции | sum(2, 3); // 5 |
Основы DOM
| Метод / свойство | Что делает |
|---|---|
| document.querySelector() | Находит первый элемент по CSS-селектору |
| document.querySelectorAll() | Находит все элементы по CSS-селектору |
| element.innerHTML | Читает или задаёт HTML-содержимое элемента |
| element.textContent | Читает или задаёт текст внутри элемента |
| element.addEventListener() | Вешает обработчик события (клик, ввод и т.д.) |
| element.classList.add() / remove() / toggle() | Управляет CSS-классами элемента |
| element.value | Значение поля ввода (input, select) |
| element.style | Прямое управление CSS-стилями элемента |
Что дальше
Хочешь разобраться глубже?
Все эти темы подробно разобраны в бесплатном курсе JavaScript — с практическими заданиями после каждого урока.