Изучение JavaScript

Пункт 2. Сборка мусора

• Сборка мусора выполняется автоматически.
• Объекты сохраняются в памяти, пока они достижимы.
• Наличие ссылки не гарантирует, что объект достижим (от корня): несколько взаимосвязанных объектов могут стать недостижимыми как единое целое.

Пункт 3. Тип данных Symbol

В качестве ключей для свойств объекта могут использоваться только строки или символы. «Символ» представляет собой уникальный идентификатор. Создается с помощью функции Symbol(). Символ (symbol) – примитивный тип данных, использующийся для создания уникальных идентификаторов. Символы не преобразуются в строки автоматически.

Свойства, чьи ключи – символы, не перебираются циклом for … in

Даже если символы имеют одно и то же имя, это – разные символы. Для создания одинаковых символов нужно использовать глобальный реестр: вызов Symbol.for(key), который создаёт глобальный символ с key в качестве имени.

Пункт 4. Методы объекта, “this”

Функцию, которая является свойством объекта, называют методом этого объекта. Для выполнения действий методу объекта необходим доступ к информации, которая хранится в объекте. Для доступа к информации внутри объекта метод может использовать ключевое слово this

• Методы позволяют объектам «действовать»: object.doSomething()
• Методы могут ссылаться на объект через this
• Значение this определяется во время исполнения кода.
• Когда функция вызывается синтаксисом «метода» – object.method() значением thisво время вызова является объект перед точкой.
• стрелочные функции являются особенными – у них нет this

Пункт 5. Автоматическое тестирование с использованием фреймворка Mocha

Автоматическое тестирование техникой Behavior Driven Development (BDD)

В BDD сначала пишут спецификацию, а потом реализацию. Спецификация используется тремя способами:

• 1.Тесты – показывают, что функции работают правильно
• 2.Документация – describe и it нужны для описания поведения функции
• 3.Примеры – тесты, которые являются готовыми примерами использования функции.

Код, хорошо покрытый тестами, имеет лучшую архитектуру.

Пункт 6. Полифилы

Babel – это транспилер, он переписывает современный JS-код в предыдущий стандарт

Чтобы современные функции поддерживались в старых движках требуется транспилер (Babel) и полифил:

core js поддерживает много функций

polyfill.io – сервис, который автоматически создаёт скрипт с полифилом в зависимости от необходимых функций и браузера пользователя

Глава 4. Объекты: основы

Пункт 1. Объекты

Объект создаётся с помощью фигурных скобок { … } с необязательным списком свойств: « ключ: значение »

При присваивании к переменной объект созданный с помощью только скобок – называется литерал объекта, а с помощью слова Object() – конструктор объекта

Для обращения к свойству используется запись типа: ( alert(название объекта.название свойства объекта/или ключ); ).

Для удаления ключа из объекта используется оператор delete

Если название ключа состоит из нескольких слов, то оно должно быть помещано в кавычки

Последнее свойство объекта может заканчиваться запятой – это упростит добавление новых свойств в будущем

Доступ к ключу состоящему из нескольких слов осуществляется с помощью квадратных скобок [ ], Также скобки помогут при использовании переменной, которая появилась в результате выражения

Для проверки существования свойства в объекте используется конструкция: «key» in object

Цикл for .. in используется для просмотра всех свойств объекта:

1.For (название переменной, в которой находится объект key in object) { alert (key); } – выведутся названия свойств / ключи

2.Alert ( object [ key]) – выведутся значения ключей

Объекты присваиваются и копируются по ссылке. В новой переменной будет храниться ссылка на существующий объект. Все операции с использованием скопированных ссылок выполняются с одним и тем же объектом.

Чтобы сделать клон используется Object.assign / _.cloneDeep(obj)

В JS есть и другие типы объектов, кроме Object (plain object – простой объект):

• Array для хранения упорядоченных коллекций данных
• Date для хранения информации о дате и времени
• Error для хранения информации об ошибке и т.д.

Пункт 2. Советы по стилю кода

• Обратные кавычки позволяют разделять строку на части (string)
• Не более 9 строк кода подряд по вертикали
• Стиль написания напоминает стиль написания css-кода
• Для лучшего написания можно использовать плагин ESLint

Пункт 3. Комментарии

« // » - однострочные комментарии / « /* … */ » - многострочные комментарии

В комментариях можно указывать почему вы решили задачу именно этим образом.

Пункт 4. Ниндзя-код

• Писать понятный код
• Названия переменных должны говорить за себя
• В счетчике числа используются всегда однобуквенные переменные: i, j, k
• Имена переменных должны быть уникальны
• Не использовать кириллицу

Пункт 15. Function Expression и функции-стрелки

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

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

«;» не нужно ставить в конце блока кода и синтаксических конструкций ( if {…}, for {…}, function а {…} и т.д.) Функциональное выражение начинается с присваивания переменной функции, поэтому «;» обязательна.

Функции – «колбэки»

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

Аргументы функции называются «call back» - обратный вызов

Функции – стрелки

let func = (arg1, arg2, … argN) => expression

Пункт 16. Особенности JavaScript

• Всегда помнить про «;»
• Скрипт начинать с `usestrict’
• Три способа объявления переменных:
• 1.let
• 2.const
• 3.var
• простейшие функции для взаимодействия с пользователем:
• 1.prompt (question, [default]) – возвращается либо что ввел посетитель / либо null
• 2.confirm (question) – ответ «ок» / «отмена», возвращает true / false
• 3.alert (message) – выводит сообщение
• Виды операторов:
• 1.Арифметические ( « * », « + », « - », « / », « % », « ** »)
• 2.Оператор присваивания « = »
• 3.Битовый операции
• 4.Условный оператор « ? » (параметр ? resultA : resultB – если параметр true, то возвращается resultA, иначе resultB)
• 5.Логические операторы « && И », « || ИЛИ » « ! НЕТ »
• 6.Проверка на равенство
• oНестрогое равенство « == » значения разных типов конвертируется в число, кроме null и undefiend (равны только самим себе)
• oСтрогое равенство « === » не выполняет конвертацию.
• o Операторы сравнения « > » / « < » сравнивают строки посимвольно
• 7.Оператор « , »
• Циклы
• 1.While (условие) { … }
• 2.Do { … } while (условие);
• 3.For (переменная; условие для переменной; счетчик) { … }
• a.Переменная объявленная в цикле for видна только внутри него
• b.Break / continue – позволяют выйти из цикла / текущей итерации
• Конструкция switch заменяет несколько проверок if. При сравнении использует строгое равенство « === »
• Функции:
• 1.Function declaration – функция в основном потоке кода
• 2.Function expression – функция как часть выражения
• 3.Стрелочные функции
• Локальные функции видны только внутри функции
• могут быть значения по умолчанию
• Функции всегда что-то возвращают, без оператора return – результатом будет undefiend

Глава 3. Качество кода

Пункт 1. Отладка в браузере Chrome

Отладка – поиск и исправление ошибок в скрипте

Пункт 12. Циклы while и for

• While (условие) { Тело цикла } Выполняется до итерации пока условие истинно
• Do…….while { тело цикла} помещается до условий, выполняется после итерации
• For (начало; условие; шаг) { тело цикла } Выполняется до итерации пока условие не ложно
• Прерывание цикла break
• Переход к следующей итерации continue
• Метки для break / continue (название метки: перед циклом – внутри цикла break название метки)

Пункт 13. Конструкция «switch»

Эта конструкция заменяет собой сразу несколько «if». Состоит из одного или нескольких блоков «case» и необязательного блока «default». Условие-переменная строго сверяется с каждым case по очереди, если совпадения есть, то выполняется код до конца switch или до близжайшего break, если ни один case не совпал, то выполняется default, если предусмотрен. Значения должны быть одного типа.

Пункт 14. Функции

Создание функции происходит с помощью «function». После объявления функции вводится её имя, потом список параметров в круглых скобках через запятую, а в фигурных скобках тело функции

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

Параметры – это аргументы функции

Выбор имени функции:

• «show» - функция что-то показывает
• «get» - возвращает значение
• «calc» - что-то вычисляет
• «create» - что-то создает
• «check» - что-то проверяет и возвращает логическое значение