ТОП-30 онлайн-курсов JavaScript: обучение JS на бесплатных и платных курсах

По окончании курса Вы будете понимать и уметь:

• Вы владеете JavaScript, свободно разрабатываете и отлаживаете программы на этом языке.
• Вы умеете создавать компоненты и объединять их в интерфейсы средней сложности.
• Ваши интерфейсы работают стабильно, без глюков, их можно удобно дорабатывать и развивать.
• Понимать возможности JavaScript для манипуляции элементами HTML-страниц
• Управлять элементами HTML-страниц с помощью JavaScript
• Реализовывать различные эффекты (drag’n’drop, анимационные эффекты, запоминание информации в cookie, работа с окнами)

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

Модуль 1. Введение в JavaScript, основные сведения, синтаксис

• Краткая история JavaScript, текущая версия (1.5)
• Внедрение сценариев в HTML
• Синтаксис, зарезервированные слова
• Понятие операторов
• Практика: Первый сценарий
• Понятие переменной, литерала
• Классификация типов данных, оператор typeof
• Краткое описание всех типов данных
• Глобальный объект
• Тривиальные типы данных null, undefined
• Базовые типы String, Number, Boolen
• Работа с числами — объект Math, функции (методы глобального объекта) parseInt(), parseFloat()
• Практика: Изучение методов экземпляров String
• Практика: Изучение методов экземпляров Number, методов глобального объекта и объекта Math

Модуль 2. Инструкции и функции

• Понятие инструкции
• Объединение инструкций, оператор «,»
• Блок инструкций {}
• Условные инструкции (if, if/else, if/else if/else)
• Инструкции цикла (while, do/while, for, for/in)
• Инструкция переключения (switch/case/default)
• Инструкции continue, break
• Инструкция перехвата и обработки исключения (try/catch/finally, тип данных Error)
• Практика: Построение таблицы в цикле (использование элемента <style> и правил CSS для модификации внешнего вида таблицы)
• Практика: Определение правильного окончания слова с разными числительными
• Функции
• Имена функций, их создание и вызов
• Область видимости переменных
• Аргументы функций, объект arguments, рекурсивный вызов
• Инструкция return
• Практика: Использование функции для модернизации предыдущего примера с окончанием слова
• Практика: Создание функции для работы с любым количеством переданных аргументов
• Практика: Создание функции, возвращающей значение

Модуль 3. Массивы и объекты

• Массивы, тип данных Array
• Свойства и методы экземпляров Array
• Практика: Изучение методов массивов
• Объекты в JS, тип данных Object
• Свойства и методы экземпляров Object
• Углубление понятия свойств и методов любого объекта в JavaScript
• Контекст исполнения функции в качестве метода объекта
• Практика: Вызов глобальной функции как метода объекта, ключевое слово this
• Пользовательские объекты
• Понятие класса-конструктора, оператор instanceof, свойство constructor
• Механизм наследования, prototype
• Практика: Создание пользовательского класса-конструктора, передача аргументов
• Практика: Модификация пользовательского класса-конструктора с помощью prototype

Модуль 4. Регулярные выражения и даты

• Шаблоны для поиска в строках, тип данных RegExp
• Синтаксис регулярных выражений
• Спецсимволы, неалфавитные символы (управляющие последовательности)
• Классы символов
• Повторение
• Альтернатива, группировка и ссылки (внутри вне шаблона)
• Флаги
• Свойства экземпляров RegExp
• Методы экземпляров RegExp и String для поиска с использованием шаблонов
• Практика: Использование рассмотренных методов для поиска
• Практика: Составление шаблона для проверки корректности e-mail
• Создание дат, тип данных Date
• Свойства и методы экземпляров Date
• Практика: Получение текущей и заданной дат
• Практика: Получение даты с заданным смещением (неделя — 7 суток, месяц — 30 суток)
• Практика: Использование экземпляров Date в качестве «секундомера»
• Заключительная часть – закрепление знаний про объекты, их свойства и методы, синтаксис доступа к ним

Модуль 5. Глобальный объект Window

• DOM как связь базового JavaScript и HTML страницы
• Краткая история развития DOM, текущая версия (2)
• Глобальный объект Window, его свойства и методы
• Объекты, доступные как свойства Window, их свойства и методы:
• location
• history
• navigator
• screen
• document
• Практика: Использование методов prompt(), confirm(), alert() для задания условия выполнения действий и информирования пользователя
• Практика: Отложенный вызов кода (setTimeout(), setInterval()), использование методов для счетчиков времени
• Практика: Открытие окна, работа с его положением, получение и потеря фокуса, скроллирование, закрытие окна
• Практика: Отслеживание свойства closed открытого окна, взаимодействие окон с помощью переменной и свойства opener
• frames[] и понятие HTML коллекции
• Взаимодействие окон (глобальных объектов) во фреймовой структуре
• Практика: Работа с переменными в разных окнах (top, parent, self), закрепление понимания, что глобальные переменные — свойства объекта window, глобальные функции — методы этого объекта

Модуль 6. Объект Document, базовая модель событий

• Свойства и методы объекта Document
• Доступ к отдельным элементам страницы с помощью свойств объекта Document:
• body
• title
• forms
• images
• links
• anchors
• applets
• embeds
• Доступ к атрибутам элементов страницы
• Способ сохранения информации для посещенной страницы – cookie
• Практика: Модификация работы по открытию окна: добавление формирования содержимого
• Практика: Чтение и запись cookie
• Базовая или исходная модель событий
• Список событий и элементы страницы, где они могут возникнуть
• Применение кода в качестве обработчика события
• Вызов функций в значении атрибута
• Регистрация функций-обработчиков в качестве свойства элемента, ключевое слово this
• Передача ссылок на событие и элемент, в котором оно возникло
• Практика: Регистрация обработчиков событий в HTML коде, недостатки этого способа
• Практика: Регистрация обработчиков событий в коде скрипта, передача ссылки на событие

Модуль 7. Отдельные HTML элементы и работа с ними

• Таблицы и ее элементы
• Свойства и методы таблицы, ее элементов
• Практика: Динамическое создание таблицы (модификация примера из 2 модуля курса «Базовый JavaScript»)
• Формы и элементы управления
• Свойства и методы формы, ее элементов
• События, связанные с формой и ее элементами
• Практика: Правильная организация формы, ее проверка перед отправкой, фильтрация ввода с клавиатуры
• Изображения
• Свойства изображений
• События, связанные с изображениями
• Практика: Динамическое создание изображения, организация просмотра увеличенных изображений

Модуль 8. Объектная модель документа (DOM)

• Реализация W3C DOM различными браузерами
• Архитектура DOM, дерево элементов
• Типы узлов, работа с атрибутами
• Свойства и методы различных типов узлов
• Доступ к значению атрибутов через свойства
• Работа со встроенными стилями (атрибут style (inline))
• Работа с таблицами стилей (элементы <link> для внешних таблиц (linking) и <style> для встроенных таблиц (ebbedding))
• Методы экземпляров RegExp и String для поиска с использованием шаблонов
• Практика: Динамическое создание таблицы (модификация примера из 2-го модуля курса «Базовый JavaScript»)
• Практика: Поиск элементов страницы и манипуляции с ними
• Практика:
• Построение списка со ссылками из массива
• Практика:
• Изменение внешнего вида посредством работы с таблицами стилей

Модуль 9. Модель событий в объектной модели документа

• Отличия целевых элементов для некоторых событий по сравнению с базовой моделью
• Модель возникновения, распространения и обработки событий в W3C DOM и IE
• Использование всплытия событий для регистрации единственного обработчика, исключения
• Свойства события
• Кроссбраузерное назначение функций-обработчиков событий
• Практика: Принципы построения кроссбраузерного служебного кода
• Практика: Реализация drag’n’drop
• Практика: Построение раскрывающегося по клику списка

Модуль 10. Основы использования библиотеки jQuery

• Обзор jQuery;
• jQuery селекторы;
• Манипуляции DOM;
• Манипуляции CSS;
• Использование jQuery для создания обработчиков событий;
• Использование jQuery для создания визуальных эффектов.
• Основы применения анимации
• Практика: по теме

Модуль 11. Асинхронное программирование в JavaScript:

• Асинхронное программирование;
• Преимущества асинхронного программирования;
• Функция обратного вызова — основа асинхронного программирования
• XMLHttpRequest;
• Использование XML для AJAX;
• Использование JSON для AJAX;
• Использование jQuery для AJAX вызовов;
• Отложенные (deferred) объекты.

Модуль 12. Model-View-Controller библиотеки (frameworks) для JavaScript:

• Что такое MVC?
• Типичные возможности MVC-библиотек;
• js;
• Другие MVC-библиотеки.

Модуль 13. JavaScript -инструменты:

• Отладка JavaScript;
• Сжатие кода;
• Тестирование приложений на JavaScript.

Модуль 14. Будущее JavaScript:

• ECMAScript 6.