Курсы JavaScript on-line

Базовые понятия:

• короткая история JS;
• что такое JS в разрезе браузера;
• выбор и установка программ для работы;
• краткий обзор консоли браузера;
• подключение JS к HTML-страницы;
• синтаксические правила в JS;
• типы данных - специфические значения и их назначения;
• создание переменных: понятие переменной и константы;
• понятие хойстинга;
• идентификаторы, зарезервированные слова;
• понятие оператора, оператор typeof;
• знакомство с функциями BOM.

Практика: создание HTML и JS файлов, подключение сценариев, решение практических задач на типы данных.

Работа с операторами JS:

• основные операторы;
• операторы сравнения;
• логические операторы;
• приведение типов данных: неявное и явное.

Практика: решения задач разного уровня сложности со всеми видами операторов. Практические задания на приведение типов.

Циклы:

• условные операторы;
• конструкция switch;
• знакомство с циклами;
• цикл for;
• цикл while;
• цикл do while;
• сравнения циклов, ознакомление с ситуациями в которых целесообразно / нецелесообразно использовать определенные виды циклов;
• вложенные циклы.

Практика: написание кода для каждого вида циклов. Замена одного цикла другим. Циклический перебор данных внутри внешнего цикла (построение таблицы умножения).

Функции:

• понятие функции;
• синтаксис функции;
• функции в ES6;
• параметры функции и работа с ними.

Практика: написанные функции, которая работает с несколькими аргументами.

Особенности функций:

• области видимости;
• замыкания;
• рекурсивные функции;
• понятие метода;
• отличие метода и функции.

Практика: написания кода с замыканием. Использование рекурсии.

Массивы:

• знакомство с массивами данных;
• запись данных в массив;
• методы массива: push, pop, shift, unshift;
• перебор элементов массива;
• другие методы массивов.

Практика: создание и наполнение массивов. Практическое применение методов массива.

Объекты:

• понятие объекта;
• хранения данных в объекте;
• работа с данными объекта;
• перебор данных по ключам;
• методы объектов;
• глобальный объект.

Практика: создание объекта, перебор его свойств. Исследования глобального объекта браузера.

Введение в DOM:

• понятие DOM;
• понятие BOM;
• краткий экскурс по основным объектам BOM, их назначение;
• построение DOM-дерева;
• виды узлов;
• перемещения по узлам DOM-дерева;
• поиск элементов вручную.

Практика: создание тестовой HTML-страницы, исследования ее DOM-дерева. Организация доступа к узлам DOM.

Работа с DOM:

• методы для удобного поиска элементов в DOM-дереве;
• основные свойства узлов-элементов;
• создание текстовых узлов;
• создание узлов-элементов;
• добавления текстовых узлов и узлов-элементов на страницу;
• работа со стилями через JS;
• подмена стилей.

Практика: создание HTML-страницы посредством DOM-узлов. Изменение содержания элемента и его стилей с помощью JS.

События:

• работа с прокруткой элементов;
• знакомство с событиями браузера;
• перехват событий, всплывающие события;
• объект события;
• практическая работа с событиями браузера;
• конструкция try / catch.

Практика: навешивание различных событий на различные элементы. Перехват событий.

Старт учебного проекта.

Практика:

• выбор темы проекта (с предложенных);
• создание базового HTML для работы со страницей;
• организация модального окна с помощью асинхронных функций.

Продолжение работы над проектом.

Практика: доработка учебного проекта (в зависимости от выбранной темы).