JavaScript [htmlacademy] Интенсивный онлайн‑курс: Профессиональный JavaScript. Уровень 1. (14-й поток)

[ATLANT ♆]

Автор: htmlacademy
Название: Интенсивный онлайн‑курс: Профессиональный JavaScript. Уровень 1. (14-й поток)

Описание:
Курс рассчитан на людей без навыков программирования. Для прохождения понадобятся навыки вёрстки, которые можно получить пройдя интерактивные курсы или интенсив «Профессиональный HTML и CSS, уровень 1».

Программа обучения:
Знакомство. Рассмотрим схему работы на интенсиве, какие инструменты понадобятся. Начнём разбирать основы JavaScript:

Организационные вопросы:

• Обзор проектов.
• Схема работы на интенсиве.
• Введение в программирование:
• Программирование и алгоритмы.
• Данные.
• Линейные алгоритмы.
• Ветвящиеся алгоритмы.

Основы JavaScript:

• Типы данных.
• Операторы.
• Приведение типов.
• Переменные.
• Функции.
• Условные операторы.

Встроенные API. Разбираемся со сложными типами данных: массивы и объекты, циклические алгоритмы, а также посмотрим на встроенные в JavaScript объекты для работы с окном браузера,открытой страницей, DOM-элементами и графикой:

Отладка кода.

Сложные типы данных:

• Циклические алгоритмы.
• Массивы.
• Объекты.

Встроенные объекты:

• document, элемент для работы c DOM-деревом.
• canvas, элемент для работы c программируемой графикой.

DOM. Пробуем создавать, удалять, перемещать и управлять DOM-элементами. Опишем данные, которые будем отображать на странице, а затем, с помощью шаблонов отрисуем их:

Управление DOM-деревом:

• DOM-дерево: структура.
• Поиск элементов на странице.
• Управление атрибутами DOM-элементов.
• Перемещение элементов в DOM-дереве.

Подходы к созданию DOM-элементов:

• Управление разметкой: insertAdjacentHTML, innerHTML, textContent.
• Создание DOM-объектов.

Шаблонизация:

• Строковая шаблонизация.
• Специальный тег <template>.

Обработка событий. Рассмотрим динамическое взаимодействие с пользователем: как сделать так, чтобы страница начала реагировать на ввод текста в формы, нажатие на определённые элементы, прокрутки и прочее. Заодно попробуем сделать страницу более доступной: как добавить правильную работу с клавиатурой и зачем это нужно:

Асинхронность, Event Loop.

События:

• Обработчики событий.
• Объект Event, управление событиями.
• Фазы событий и делегирование.
• Клавиатурные события и доступность.
• Валидация форм.

Модули. Обсудим принцип DRY (не повторяйся) и как им пользоваться для того, чтобы писать меньше кода, но при этом делать больше:

Перетаскивание:

• Изменение координат элементов на странице.
• Drag and Drop.
• Области видимости функций:
• Области видимости.
• Глобальная область видимости.
• Замыкания.
• Потеря окружения.

Модульность:

• Повторное использование кода, принцип DRY.
• Функции как модули.
• Понятие модуля, виды модулей.
• Инкапсуляция.
• Немедленно выполняющиеся функции (IIFE).

Работа с сетью. Взглянем на протокол HTTP и инструменты, которые позволяют делать запросы из браузера. Рассмотрим, как меняется взаимодействие пользователя с сайтом при начале работы с сетью, что может пойти не так и что с этим делать:

• Исключения.
• Оператор множественного выбора switch.
• Протокол HTTP и форматы данных:
• XML.
• JSON.
• JSONP.
• Объект XMLHttpRequest.
• Обработка ошибок в запросах.

Структуры данных. Разберём непопулярную среди фронтенд-разработчиков тему структур данных. Что такое данные, почему у них есть структура, и на доступных примерах посмотрим, как использование структур данных может облегчить разработчику жизнь:

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

• Ключевое слово this.
• Изменение контекста.

Продвинутая работа с массивами:

• Управление массивами: вставка и удаление элементов.
• Выборки из массива: slice и filter.
• Сортировка.
• Итераторы по массивам.
• Свёртка массивов: some, every и reduce.

Оптимизации производительности:

• Оценка эффективности алгоритмов.
• Пропуск кадров — тротлинг (throttle).
• Устранение дребезга — дебаунс (debounce).

Компонентный подход. Разберём продвинутую работу с объектами, узнаем как можно удобным способом создавать большое количество одинаковых объектов и зачем это нужно:

Типизированные объекты:

• Функции-конструкторы.
• Прототипы.
• Цепочки прототипов, наследование.
• Полиморфизм, переопределение методов.

Рефакторинг.

Узкие места в JavaScript. Посмотрим на особенности JavaScript, которые лучше не забывать учитывать при разработке. Заодно взглянем на дополнительные полезные техники, не разобранные на интенсиве:

• Необязательные точки с запятой.
• Подвешивание (hoisting) переменных и функций.
• Продвинутые техники программирования.
• Регулярные выражения.
• Минификация кода.

Финал. Подводим итоги интенсива. Что делать дальше.

Скачать:

Для просмотра скрытого содержимого вы должны войти или зарегистрироваться.

 

[Jumanji113]

есть обновление?

 

[MilkShake]

есть обновление?

Ссылка на материал обновлена.

 

[Karina V]

обновите ссылку пожалуйста

 

[MilkShake]

обновите ссылку пожалуйста

Ссылка на материал обновлена.