=================================================================
модуль 1 - введение
Продолжительность: две недели
1. Общая информация
- История возникновения и эволюция JavaScript.
- Предметная область использования, зачем знать JavaScript.
- JavaScript и Java, коротко про ECMAScript.
- В чем разница ECMAScript5 и ECMAScript6.
- Обзор структуры курса и методики обучения.
2. Базовые знания
- Редакторы кода, какой выбрать.
- Структура кода, подключение скриптов.
- Понятие переменных.
- 6 типов данных (новый тип Symbol из ECMAScript6).
- Операторы.
- Преобразование типов.
3. Обзор домашнего задания "Базовые знания"
=================================================================
модуль 2
Начало работы, базовые конструкции и синтаксис. DOM
Продолжительность: 4 недели
1. Практическое занятие. Редактор кода + Git
- Установка IDE.
- Что такое система контроля версий Git.
- Примеры работы в консоли (создание и подключение к репозиторию, commit, pull, push).
- Работа с помощью программы SourceTree.
2. Основные операторы
- Операторы сравнения (<, >).
- Логические операторы (||, &&, !).
- Тернарный оператор (?
.
- Условные операторы (if, ?).
- Циклы while, for, for...in.
3. Обзор домашнего задания «Основные операторы»
4. Функции, основные понятия
- Определение функции.
- Особенности работы с переменными.
- Function expression и function declaration.
- Глобальные функции.
5. Обзор домашнего задания «Функции»
6. Объекты
- Понятие и создание объекта.
- Работа с объектами, перебор свойств.
- Объект Array, основные методы.
- Объект String, основные методы.
- Объект Date, основные методы.
7. Обзор домашнего задания «Объекты»
8. Работа с DOM
- Что такое DOM структура документа.
- Навигация по DOM структуре.
- Обзор основных методов объекта document: getElement* и querySelector*.
- Создание, удаление и добавление элементов в DOM дерево.
- Работа со стилями средствами JavaScript.
- Что такое BOM.
9. Обзор домашнего задания «DOM»
=================================================================
модуль 3
События, замыкание, модуль. AJAX. THIS
Продолжительность: 4 недели
1. События
- Введение в браузерные события.
- Обзор наиболее популярных событий мышки и клавиатуры.
- Назначение обработчика событий.
- Всплывание (bubbling) и распространение событий.
- Делегирование событий.
2. Обзор домашнего задания «События»
3. Замыкание функции, модуль
- Scope функции или лексическое окружение.
- Что такое замыкание.
- Function and variable hoisting.
- Самовызывающаяся функция.
- Что такое модуль, базовый пример реализации.
4. Обзор домашнего задания «Замыкание функции, модуль»
5. Работа с AJAX
- Как устроены сетевые взаимодействия. Общий обзор.
- JSON. Структура и основные приемы работы.
- Что такое AJAX и для чего он используется.
- Функция XMLHttpRequest, как основа AJAX технологии.
- Практическая реализация AJAX взаимодействия с сервером на примере простого Node сервера.
6. Обзор домашнего задания «Работа с AJAX»
7. Ключевое слово this
- Какую роль выполняет this в JavaScript.
- Особенности работы this при создании новых объектов.
- Пример «модуля» с методами объявленными через this.
- Пример потери контекста, решение проблемы, анонимной функции.
- Функция bind() и карринг.
- Назначение call() и apply().
8. Обзор домашнего задания «Ключевое слово this»
=================================================================
модуль 4
- EcmaScript 6, Инструментарий frontend разработчика
- Продолжительность: 2 недели
1. ES6: Обзор основных возможностей
- Что такое ES6 или ES2015.
- Какие возможности ES6 можно использовать уже сейчас.
- Работа с функциями (стрелочные функции, аргументы по умолчанию)
- Новый вид переменных let. отличие от var
- Деструктуризация
- Работа со строками(интерполяция)
- Объекты и Классы
2. Обзор домашнего задания «ES6: Обзор основных возможностей»
3. Инструментарий Frontend разработчика
- Что необходимо уметь Frontend разработчику кроме HTML/CSS/JavaScript.
- Некоторые приемы работы в консоли.
- Обзор NPM (Node Package Manager).
- Gulp: незаменимый инструмент для сборки проекта.
- LESS: мощный фреймворк для работы с CSS.
- Работа с инструментами для разработчиков в Chrome
=================================================================
модуль 5
Объектно ориентированное программирование
Продолжительность: 1,5 недели
1. Наследование и ООП (Часть 1)
- Что такое Объектно Ориентированное Программирование, основные принципы.
- Понятие объекта с точки зрения ООП.
- Наследование и цепочка прототипов в JavaScript.
- Пример прототипного наследования для готовых объектов используя __proto__.
2. Наследование и ООП (Часть 2)
- Пример прототипного наследования используя Object.create().
- Пример реализации прототипного наследования используя функцию конструктор.
- Наследование одного класса другим с помощью современного и классического метода.
3. Обзор домашнего задания «Наследование и ООП»
Подмены выполняются на уровне браузерного ядра — максимальная защита от идентификации устройства
