Последовательности команд

"Сделай что-то, потом что-то".

Понятие о числах и строках

Как они записываются в коде.

Комментарии с //

Нужно потому, что дальше каждую вещь мы будем комментировать.

Просто попробовать

Эскейпинг в строках

\n для новой строки или \" для кавычки.

Объявление функций и передача аргументов

Что такое функция; как делать свои функции; как принимать аргументы.

p5: mouseX и mouseY

Это не нужно для жизни в целом, но помогает мне придумывать упражнения.

Солнышко привязано к мышке; рисовалка

if и операторы сравнения

Простые условия. Форма с else и без него. Операторы >, <, >=, <=, ===, !==.

"Если солнышко слева, пусть оно меняет цвет, будто бы закат". Три фазы солнышка, чтобы был chained if.

Понятие "результат функции" и return

Функции могут что-то возвращать в дополнение к тому, что они делают.

return моментально заканчивает функцию.

Пишем свою функцию, которая будет ограничивать координаты солнышка, чтобы оно не выходило за границу экрана.

Переменные

Что такое переменная; как объявлять переменные; как менять переменные.

Операторы ++, --, +=, -=.

Рисовалка, но стрелочки меняют размер кисти. Солнышко, но оно двигается клавишами.

Синтаксис JS

Для каждого куска кода надо понимать, что это такое (объявление функции; вызов функции; аргумент; и т.д.)

Понимание лексинга: например, почему letx= писать нельзя. Где пробелы нужны, а где нет.

Основы последовательности вычислений JS

Команды выполняются по очереди. Порядок вычисления выражений: аргументы функций до вызова функций, "что присваиваем" до присваивания.

Пока не трогаем call-by-reference vs. call-by-value.

jsviz2.klve.nl — визуализатор последовательности вычислений

Цикл for

Что делает каждый из трех параметров цикла. Что такое "тело цикла".

Нестандартные шаги (например, i += 10 вместо i++).

Решить Задания на циклы.

Навык "получить нужные значения, если уже есть такая-то переменная"

Например, есть 1 2 3 4, хотим получить 10 20 30 40.

Решить Задания на циклы, раздел "Пары чисел".

Стандартные математические операции

+, -, *, /, %, **, скобки.

Попробовать каждую операцию. Использовать % для концентрических кругов зеброй или шахматной доски.

p5: translate, scale, rotate

Просто для интереса и практики.

Калейдоскоп (translate и rotate)

Вращающийся калейдоскоп (увеличивать переменную и доп. rotate)

Повторить калейдоскоп несколько раз (scale)

Истинный калейдоскоп с помощью scale(1, -1)

Булы и булевы операции

true и false. Понимание, что if использует булы и каждый оператор сравнения дает булы. ||, &&, !.

Решить Задания на булевы операции.

На ! пока не придумал.

Проект "елочки"

Пока не разбил. Но там будет: dist(), HSB, random(), массивы и объекты, color blending.

Хотим максимально повторить пример справа.

Свалка (пока не отсортировал)

Навык "чтение списка аргументов"

В длинных вызовах функций сложно понять, где заканчивается один аргумент и начинается другой. Надо уметь быстро читать список аргументов и понимать, где какой аргумент по номеру.

?

Навык "вынести в переменную"

Надо уметь взять любое большое выражение и вынести его в новую переменную.

Взять любой код раньше и вынести все, что получится.

? на практике не осиляю учить этому навыку

Основы useState в React

Уметь создавать переменные с useState и менять их. Делать несколько переменных и не путаться в них. Понимать, что одну переменную можно использовать в нескольких местах.

Решить Задания на useState.

Последовательность вычислений JS: x++ vs ++x, присваивание как выражение

Оба дают какой-то результат и оба имеют эффект. Может помочь понять понятие эффекта.

Почему console.log(x++) и console.log(++x) дают разные результаты. Как работает x = y = 3.

Разница между expression (выражение) и statement (инструкция)

Список инструкций и объявлений в MDN.

Посмотреть, почему x = if ... не работает.

Синтаксис JSX

Для каждого куска кода надо понимать, что это такое (открывающий/закрывающий элемент; название/значение атрибута; и т.д.)

Артем проходит по коду и объясняет каждый кусок

Скоупинг

Implicit type coercion

Анонимные функции

Понятие типа

Сильно вложенные вызовы функций, понятие "обернуть в X"

`for ... of`

Short-circuiting

Рекурсия

Исключения (exceptions), `try ... catch`

Фрагменты в JSX

Template literals

null, undefined

Использование команды npm (что именно надо?)

Чтение документации на примере популярных библиотек (lodash, ?)

Регекспы

Основы git

Поиск по своему коду в VSCode

Основы command line (бинарники, аргументы, флаги, текущая директория)

Понятие callback (cf. event handlers)

Модули и импорты

Ликбез по сетям (IP, host, port, домены, hosting, DNS, TLS, ???)

CSS (ух)

HTML vs JSX

Что такое node.js