JavaScript Базовий

Старт курсу

24 грудня (19:00-21:00, 3 рази на тиждень) Українська

26 грудня (09:00-11:00, 3 рази на тиждень) Українська

Для кого цей курс

• Початківці з базовими навичками роботи з JavaScript.
• Студенти, які пройшли курс JavaScript Стартовий
• Розробники з невеликим досвідом в програмуванні іншими мовами.
• Тестувальники

Попередні вимоги

• Знання базового синтаксису JavaScript (проходження курсу JavaScript Стартовий)
• Знання HTML та основних CSS властивостей і CSS селекторів

JavaScript Базовий

Старт курсу

24 грудня (19:00-21:00, 3 рази на тиждень) Українська

26 грудня (09:00-11:00, 3 рази на тиждень) Українська

Тривалість:

36 год.

Кількість уроків:

18 занять

Вартість навчання:

238 USD

Форма навчання

Денне навчання

Онлайн навчання

Корпоративне

Записатися купити

Опис курсу
JavaScript Базовий

Вивчення курсу JavaScript Базовий передбачає наявність початкових знань і умінь, які відповідають програмі курсу JavaScript Стартовий. На курсі JavaScript Базовий ви зможете детально вивчити семантику та особливості роботи з конструкціями мови JavaScript. Протягом 18 занять ви опануєте головні принципи використання цієї мови при побудові користувацьких інтерфейсів і при створенні сценаріїв, які використовують об'єктно-орієнтовані техніки та функціональні підходи. Цей курс стане фундаментом для подальшого вивчення бібліотек і фреймворків, що базуються на мові JavaScript. Останні 2 заняття будуть присвячені виключно практиці для надійного закріплення пройденого матеріалу. Успішно завершивши навчання на даному курсі, вам набагато легше буде зрозуміти і почати використовувати такий фреймворк, як Angular, або бібліотеку React.
В курсі можна виділити декілька головних тем:
• Робота з DOM
• Обробка подій
• Об'єктно-орієнтоване програмування, класи та наслідування
• Поглиблене вивчення функцій - контекст, лексичне оточення, замикання
• Збереження даних на клієнтській стороні
• Робота з асинхронним кодом
• Мережеві запити
Для кожного уроку передбачено домашнє завдання, виконавши яке, ви не тільки закріпите матеріал, але і побачите додаткові варіанти використання вивчених конструкцій.

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

1

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

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

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

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

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

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

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

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

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

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

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

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

Класи

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

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

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

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

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

10

Замикання

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

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

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

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

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

Cookies і Web Storage

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

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

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

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

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

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

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

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

Частина 1
18

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

Частина 2

По завершенню курсу Ви будете вміти

Працювати з DOM деревом, знаходити елементи, створювати, видаляти і змінювати стан існуючих елементів
Працювати зі стилями через JavaScript код
Використовувати події, застосовувати техніку делегування подій, працюючи з різними фазами події (Capture Phase і Bubble Phase)
Використовувати HTML template і шаблонізатор mustache.js
Працювати з функціями-конструкторами і прототипами
Використовувати класи і наслідування класів, розуміти принципи об'єктно-орієнтованого підходу при розробці на JavaScript

Працювати з функціями і використовувати замикання - розуміти, що таке лексичне оточення, контекст
Працювати з формами і перевіряти дані, уведені до форми
Працювати з даними на стороні клієнта, використовуючи cookies і Web Storage
Обробляти виключення і створювати користувацькі виключення
Організовувати асинхронний код за допомогою функцій зворотного виклику і Promise
Створювати мережеві запити за допомогою методу fetch

JavaScript Базовий

Для кого цей курс

Попередні вимоги

JavaScript Базовий

Форма навчання

Опис курсу
JavaScript Базовий

Що ви отримаєте на курсі

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

Цей курс входить до спеціальності

FrontEnd Developer

зі стажуванням після навчання

Ранкова група

Вечірня група

Full-stack Developer

з працевлаштуванням

Вечірня група

Відгуки з DOU

Відгуки з Facebook

Відгуки з Google

Записатися на курс

Старт курсів

Ранкова група

Вечірня група

Записатися на курс

JavaScript Базовий

Для кого цей курс

Попередні вимоги

JavaScript Базовий

Форма навчання

Опис курсу JavaScript Базовий

Що ви отримаєте на курсі

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

Цей курс входить до спеціальності

FrontEnd Developer

зі стажуванням після навчання

Ранкова група

Вечірня група

Full-stack Developer

з працевлаштуванням

Вечірня група

Відгуки з DOU

Відгуки з Facebook

Відгуки з Google

Записатися на курс

Старт курсів

Ранкова група

Вечірня група

Опис курсу
JavaScript Базовий