Курс JavaScript базовий

Протягом 18 занять ви опануєте головні принципи використання цієї мови при побудові користувацьких інтерфейсів і при створенні сценаріїв, які використовують об'єктно-орієнтовані техніки та функціональні підходи. Цей курс стане фундаментом для подальшого вивчення бібліотек і фреймворків, що базуються на мові JavaScript.

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

Пошук елементів та DOM дерево

• Поняття оточення в JavaScript
• DOM - Document Object Model
• BOM - Browser Object Model
• Пошук елементів у DOM, використання методів querySelector і querySelectorAll
• Типи вузлів DOM дерева
• Основні властивості вузлів DOM дерева
• Методи для навігації вузлами DOM дерева

Зміна DOM дерева. CSS стилі

• Способи створення вузлів в DOM дереві
• Вставка і видалення вузлів
• Способи клонування вузлів DOM дерева
• Властивості і атрибути елементів
• Методи для роботи з атрибутами
• Робота з одними атрибутами data
• Використання CSS стилів, властивості className і classList
• Обчислені стилі і робота з ними

Події. Частина 1

• Що таке подія
• Основні події
• Обробка подій через HTML атрибути
• Обробка подій через властивості вузлів DOM дерева
• Обробка подій за допомогою методу AddEventListener

Події. Частина 2

• Об'єкт Event для отримання додаткових даних при обробці події
• Події DOMContentLoaded і load
• Приклади обробки подій миші
• Приклади обробки подій клавіатури

Події. Частина 3

• Фази проходу події DOM деревом
• Реєстрація обробника події на різні фази
• Скасування виконання дії, за замовчуванням пов'язаної з подією
• Скасування спливання або занурення події
• Приклади використання делегування події при використанні методу addEventListener

Функції-конструктори

• Різниця між функцією-фабрикою і функцією-конструктором
• Використання функцій-конструкторів
• Робота з прототипами
• Циклічна конструкція for / in
• Використання ключового слова instanceof

Класи

• Поняття класів
• Використання ключового слова class
• Конструктори і методи класів
• Getter і setter
• Закриті та відкриті поля класів

Класи. Наслідування

• Наслідування класів в JavaScript
• Ключове слово extends
• Робота з конструкторами в класах-спадкоємцях
• Використання ключового слова super
• Перевизначення методів
• Статичні методи і властивості

Контекст функції

• Що таке контекст функції
• Зміна контексту через методи apply, call і bind
• Планування виклику функції, використання методів setTimeout і setInterval
• Контекст в стрілочних функціях
• Особливості використання контексту при використанні функцій зворотного виклику

Замикання

• Глобальний об'єкт і глобальні змінні, що таке globalThis
• Контекст виконання
• Лексичне оточення
• Замикання
• Приклади використання замикань

Форми і елементи управління

• Тег form
• Способи отримання форми і її елементів через JavaScript код
• Приклади роботи з основними елементами управління через JavaScript код

Перевірка даних форми

• Обробка події submit
• Події blur і focus
• Події copy, paste і cut
• Вбудована перевірка користувацького введення (HTML5 валідація)
• Додавання своєї логіки до вбудованої перевірки користувацького введення форм
• Основи роботи з регулярними виразами і приклади застосування регулярних виразів для перевірки користувацького введення
• Створення сценарію для перевірки користувацького введення

Cookies i Web Storage

• Що таке cookies і як з ними працювати в JavaScript
• Огляд Web Storage API
• Використання sessionStorage і localStorage
• Подія storage

Обробка виключень

• Що таке виключення
• Конструкція try catch
• Використання блоку finally
• Використання ключового слова throw
• Створення користувацьких виключень

Асинхронний код. Promise

• Що таке синхронний і асинхронний код
• Використання функцій зворотного виклику для організації асинхронного коду
• Використання Promise для асинхронного коду
• Ланцюжки promise
• Обробка винятків при роботі з Promise
• Використання методів Promise API

Мережеві запити

• Що таке HTTP
• Структура HTTP протоколу, як виглядає запит і відповідь
• Використання методу fetch для відправки HTTP запиту через JavaScript код
• Налаштування HTTP запиту під час роботи з методом fetch
• Скасування HTTP запиту, відправленого через метод fetch

Практичне заняття

Частина 1

Практичне заняття

Частина 2

Особливості курсу

• Практичні заняття і перевірка ДЗ
• Безкоштовний відеокурс
• Онлайн тестування і сертифікація

Викладачі курсу

• Віталій Мазяр - Web Frontend Developer
• Богдан Мартиненко - Frontend Developer
• Тарас Заславський - Frontend Developer
• Владислав Бєлік - React Frontend Developer
• Ростислав Сілівейстр - Web Frontend Developer
• Олексій Татаренков - Frontend Developer
• Олексій Кучеренко - тренер-консультант напрямку Frontend
• Олександр Виноградов - Software Developer