uk.javascript.info Open in urlscan Pro
2606:4700:20::681a:c11  Public Scan

Form analysis
3 forms found in the DOM

GET /search

<form class="sitetoolbar__search" method="GET" action="/search">
  <div class="sitetoolbar__search-input">
    <div class="text-input"><input class="text-input__control" name="query" placeholder="Пошук на Javascript.info" required="required" type="text"></div><button class="sitetoolbar__find" type="submit">Пошук</button>
  </div>
</form>

/search/

<form class="tablet-menu-search" action="/search/"><input class="tablet-menu-search__input" type="search" name="query" placeholder="Пошук у підручнику" required="required"><button class="tablet-menu-search__button" type="submit" name="type"
    value="articles">Пошук</button></form>

/search/

<form class="frontpage-search" action="/search/">
  <div class="text-input text-input_big"><input class="text-input__frontpage-search__input text-input__control" type="search" name="query" placeholder="Пошук у підручнику" required="required"></div><button
    class="frontpage-search__button button button_action button_big" type="submit" name="type" value="article">Пошук</button>
</form>

Text Content

UK
 * ARعربي
 * ENEnglish
 * ESEspañol
 * FAفارسی
 * FRFrançais
 * IDIndonesia

 * ITItaliano
 * JA日本語
 * KO한국어
 * RUРусский
 * TRTürkçe
 * UKУкраїнська

 * ZH简体中文

Ми хочемо зробити цей проєкт з відкритим кодом доступним для людей у всьому
світі.

Допоможіть перекласти цей підручник вашою мовою!




КупитиEPUB/PDF


Пошук
Пошук
Навчальна карта
Світла темаТемна тема
Поділитися
عربيEnglishEspañolفارسیFrançaisIndonesiaItaliano日本語한국어РусскийTürkçeУкраїнська简体中文


СУЧАСНИЙ ПІДРУЧНИК З JAVASCRIPT

Перед вами підручник з JavaScript, починаючи з основ, що включає багато тонкощів
в JavaScript/DOM.


Пошук
Останнє оновлення: 7 березня 2024 р.
КупитиEPUB/PDF
Поділитися:
301 ★githubDiscord Chat (English)


ЗМІСТ

Основний курс містить 2 частини, які охоплюють JavaScript як мову програмування
та роботу з браузером. Також є додаткові серії тематичних статей.

Частина 1Мова програмування JavaScriptЧастина 2Браузер: документ, події,
інтерфейсиЧастина 3Додаткові статті


МОВА ПРОГРАМУВАННЯ JAVASCRIPT

Тут ви можете вивчити JavaScript, починаючи з нуля і закінчуючи просунутими
концепціями, як ООП.

Ми зосередимось на самій мові, зрідка роблячи примітки щодо середовищ її
виконання.

Вступ
 * Вступ до JavaScript
 * Довідники й специфікації
 * Редактори коду
 * Інструменти розробника

Основи JavaScript
 * Привіт, світ!
 * Структура коду
 * Сучасний режим, "use strict"
 * Змінні
 * Типи даних
 * Взаємодія: alert, prompt, confirm
 * Перетворення типу
 * Базові оператори, математика
 * Оператори порівняння
 * Умовні розгалуження: if, '?'
 * Логічні оператори
 * Оператор об’єднання з null '??'
 * Цикли: while і for
 * Конструкція "switch"
 * Функції
 * Функціональні вирази
 * Стрілкові функції, основи
 * Особливості JavaScript
 * Більше…

Якість коду
 * Налагодження в браузері
 * Стандарт оформлення коду
 * Коментарі
 * Ніндзя-код
 * Автоматичне тестування за допомогою Mocha
 * Поліфіли та транспілятори

Об’єкти: основи
 * Об’єкти
 * Копіювання об’єктів та посилання
 * Збирання сміття
 * Методи об’єкта, "this"
 * Конструктори, оператор "new"
 * Опціональний ланцюжок '?.'
 * Тип даних Символ
 * Перетворення об’єктів в примітиви

Типи даних
 * Методи примітивів
 * Числа
 * Рядки
 * Масиви
 * Методи масивів
 * Ітеративні об’єкти
 * Map та Set
 * WeakMap та WeakSet
 * Object.keys, values, entries
 * Деструктуроване присвоєння
 * Дата і час
 * Методи JSON, toJSON
 * Більше…

Розширена робота з функціями
 * Рекурсія та стек
 * Залишкові параметри та синтаксис поширення
 * Область видимості змінної, замикання
 * Застаріле ключове слово "var"
 * Глобальний об’єкт
 * Об’єкт функції, NFE
 * Синтаксис "new Function"
 * Планування: setTimeout та setInterval
 * Декоратори та переадресація виклику, call/apply
 * Прив’язка контексту до функції
 * Повторення стрілкових функцій
 * Більше…

Властивості об’єкта, їх конфігурація
 * Прапори та дескриптори властивостей
 * Гетери і сетери властивостей

Прототипи, наслідування
 * Успадкування через прототипи
 * F.prototype
 * Вбудовані прототипи
 * Методи прототипів, об’єкти без __proto__

Класи
 * Базовий синтаксис класу
 * Наслідування класу
 * Статичні властивості та методи
 * Приватні та захищені властивості та методи
 * Розширення вбудованих класів
 * Перевірка класу: "instanceof"
 * Міксини

Обробка помилок
 * Робота з помилками, "try...catch"
 * Нестандартні помилки, розширення Error

Проміси, async/await
 * Введення: колбеки
 * Проміси
 * Ланцюжок промісів
 * Проміси: обробка помилок
 * Promise API
 * Промісифікація
 * Мікрозадачі
 * Async/await

Генератори, розширена ітерація
 * Генератори
 * Асинхронні ітератори та генератори

Модулі
 * Вступ до модулів
 * Експорт та імпорт
 * Динамічні імпорти

Різне
 * Proxy та Reflect
 * Eval: виконання рядка коду
 * Каррінг
 * Посилальний Тип
 * BigInt
 * Юнікод, внутрішня будова рядків
 * WeakRef та FinalizationRegistry


БРАУЗЕР: ДОКУМЕНТ, ПОДІЇ, ІНТЕРФЕЙСИ

Навчимося керувати сторінкою браузера, а саме: додавати елементи, змінювати їх
розмір і розташування, динамічно створювати інтерфейси та взаємодіяти з
користувачем.

Документ
 * Браузерне середовище, специфікації
 * DOM дерево
 * Навігація по DOM
 * Пошук: getElement*, querySelector*
 * Властивості вузлів: тип, тег та вміст
 * Атрибути та властивості
 * Внесення змін в документ
 * Стилі та класи
 * Розмір і прокрутка елемента
 * Розміри вікна і прокрутка
 * Координати
 * Більше…

Вступ до подій
 * Вступ до подій браузера
 * Бульбашковий механізм (спливання та занурення)
 * Делегування подій
 * Типові дії браузера
 * Запуск користувацьких подій

Події інтерфейсу
 * Події миші
 * Moving the mouse: mouseover/out, mouseenter/leave
 * Drag'n'Drop з подіями миші
 * Події вказівника
 * Клавіатура: keydown та keyup
 * Прокрутка

Форми та інтерактивні елементи
 * Властивості та методи форми
 * Фокусування: focus/blur
 * Події: change, input, cut, copy, paste
 * Форми: подія та метод submit

Завантаження документа і ресурсів
 * Сторінка: DOMContentLoaded, load, beforeunload, unload
 * Скрипти: async, defer
 * Завантаження ресурсів: onload та onerror

Різне
 * Mutation Observer (спостерігач за мутаціями)
 * Selection і Range
 * Цикл подій (event loop): мікрозавдання (microtasks) та макрозавдання
   (macrotasks)


ДОДАТКОВІ СТАТТІ

Список додаткових тем, які передбачають, що ви охопили перші дві частини
підручника. Тут немає чіткої ієрархії, ви можете читати статті у будь-якому
порядку.
Frames and windows
 * Спливаючі вікна та методи window
 * Міжвіконна комунікація
 * Clickjacking атака

Binary data, files
 * ArrayBuffer, бінарні масиви
 * TextDecoder та TextEncoder
 * Blob
 * File та FileReader

Network requests
 * Fetch
 * FormData
 * Fetch: Хід завантаження
 * Fetch: Переривання
 * Fetch: Запити між різними джерелами
 * Fetch API
 * URL об’єкти
 * XMLHttpRequest
 * Відновлюване завантаження файлу
 * Тривале опитування
 * WebSocket
 * Server Sent Events
 * Більше…

Зберігання даних у браузері
 * Файли cookies, document.cookie
 * LocalStorage, sessionStorage
 * IndexedDB

Animation
 * Крива Безьє
 * CSS-анімації
 * JavaScript-анімації

Веб компоненти
 * З висоти орбітального польоту
 * Кастомні елементи
 * Тіньовий DOM (Shadow DOM)
 * Елемент template
 * Слоти тіньового DOM, композиція
 * Стилізація тіньового DOM
 * Тіньовий DOM та події

Регулярні вирази
 * Вступ: шаблони та прапори
 * Символьні класи
 * Юнікод: прапорець "u" та клас \p{...}
 * Якорі: початок рядка ^ і кінець $
 * Багаторядковий режим якорів ^ $, прапора "m"
 * Межа слова: \b
 * Екранування, спеціальні символи
 * Набори та діапазони [...]
 * Квантифікатори +, *, ? та {n}
 * Жадібні та ліниві квантифікатори
 * Групи захоплення
 * Зворотні посилання в шаблоні: \N і \k<ім’я>
 * Альтернація (АБО) |
 * Перевірка уперед та назад
 * Катастрофічний пошук з поверненням
 * Липкий прапорець "y", пошук на заданій позиції
 * Методи регулярних виразів та рядків
 * Більше…

Поділитися
Навчальна карта


КОМЕНТАРІ

прочитайте це, перш ніж коментувати…
 * Якщо у вас є пропозиції, щодо покращення підручника, будь ласка, створіть
   обговорення на GitHub або одразу створіть запит на злиття зі змінами.
 * Якщо ви не можете зрозуміти щось у статті, спробуйте покращити її, будь
   ласка.
 * Щоб вставити код, використовуйте тег <code>, для кількох рядків – обгорніть
   їх тегом <pre>, для понад 10 рядків – використовуйте пісочницю (plnkr, jsbin,
   codepen…)


 * © 2007—2024  Ілля Кантор
 * про проєкт
 * зв’яжіться з нами