Объекты

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

В JavaScript объекты используются очень часто, это одна из основ языка.

Объект может быть создан с помощью фигурных скобок {…} с необязательным списком свойств. 
Свойство – это пара «ключ: значение», где ключ – это строка (также называемая «именем свойства»), а значение может быть чем угодно.

На картинке выше создан объект user, где находятся два свойства:
- Первое свойство с именем "name" и значением "John"
- Второе свойство с именем "age" и значением 30.

Можно сказать, что наш объект user – это ящик с двумя папками, подписанными «name» и «age».

#типы_данных #objects

JSON

Это текстовый формат представления данных в нотации объекта JavaScript. 
Предназначен JSON, также как и некоторые другие форматы такие как XML и YAML, для обмена данными.

В JavaScript JSON очень часто применяется в качестве формата для передачи информации от веб-сервера клиенту (веб-браузеру) при AJAX запросе.

Основные методы:
 - JSON.parse()
Разбирает строку JSON, возможно с преобразованием получаемого значения и его свойств и возвращает разобранное значение.
 - JSON.stringify()
Возвращает строку JSON, соответствующую указанному значению, возможно с включением только определённых свойств или с заменой значений свойств определяемым пользователем способом.

#JSON #типы_данных

Дата и время

Встречайте новый встроенный объект: Date. Он содержит дату и время, а также предоставляет методы управления ими.
Например, его можно использовать для хранения времени создания/изменения, для измерения времени или просто для вывода текущей даты.

Для создания нового объекта Date нужно вызвать конструктор new Date() с одним из следующих аргументов:

- new Date()
Без аргументов – создать объект Date с текущими датой и временем.

 - new Date(milliseconds)
Создать объект Date с временем, равным количеству миллисекунд (тысячная доля секунды), прошедших с 1 января 1970 года UTC+0.

#date #типы_данных

Инструкция if

Инструкция if(...) вычисляет условие в скобках и, если результат true, то выполняет блок кода.

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

Рекомендовано использовать фигурные скобки {} всегда, когда вы используете инструкцию if, даже если выполняется только одна команда. Это улучшает читабельность кода.

#условное_ветвление #инструкция_if

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

Существует простой и краткий синтаксис для создания функций, который часто лучше, чем синтаксис Function Expression.
Он называется «функции-стрелки» или «стрелочные функции» (arrow functions)

На картинке выше (a, b) => a + b задаёт функцию с двумя аргументами a и b, которая при запуске вычисляет выражение справа a + b и возвращает его результат.

#function #функции_стрелки

String

Строка (string) в JavaScript должна быть заключена в кавычки.

В JavaScript существует три типа кавычек.

Двойные кавычки: "Привет".
Одинарные кавычки: 'Привет'.
Обратные кавычки: `Привет`.

Двойные или одинарные кавычки являются «простыми», между ними нет разницы в JavaScript.

Обратные же кавычки имеют расширенную функциональность. Они позволяют встраивать выражения в строку, заключая их в ${…}.

#string #типы_данных

Несколько операторов "?"

Последовательность операторов вопросительного знака ? позволяет вернуть значение, которое зависит от более чем одного условия.

Поначалу может быть сложно понять, что происходит. Но при ближайшем рассмотрении мы видим, что это обычная последовательная проверка.

#условное_ветвление #условный_оператор_?

Цикл «do…while»

Проверку условия можно разместить под телом цикла, используя специальный синтаксис do..while

Цикл сначала выполнит тело, а затем проверит условие condition, и пока его значение равно true, он будет выполняться снова и снова.

#Циклы_while_for #do_while

Преобразование типов

Чаще всего операторы и функции автоматически приводят переданные им значения к нужному типу.
Например, alert автоматически преобразует любое значение к строке. Математические операторы преобразуют значения к числам.

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

Примеры преобразование:

Строковое преобразование - String(value)

Численное преобразование - Number(value)

Логическое преобразование - Boolean(value)

#преобразование_типов #типы_данных

Булевый (логический) тип

Булевый тип (boolean) может принимать только два значения: true (истина) и false (ложь).

Такой тип, как правило, используется для хранения значений да/нет: true значит «да, правильно», а false значит «нет, не правильно».

#boolean #типы_данных

Var вместо let

В старых скриптах вы также можете найти другое ключевое слово: var вместо let:

Ключевое слово var – почти то же самое, что и let. Оно объявляет переменную, но немного по-другому, «устаревшим» способом.

#var #переменные

Примитивные и ссылочные типы данных

Особенность примитивных типов данных заключается в том, что они неизменяемы (иммутабельны) и передаются по значению. 
В отличие от объектов, которые передаются по ссылке. 
При этом важно понимать, что объект или примитив, это не сама переменная, а соответствующий указатель на объект или само значение примитивного типа, которое этой переменной присвоено.

На картинке выше, при присваивание строчной переменной происходит создание новой переменной с таким же значением.
В результате мы имеем две независимые переменные, каждая из которых хранит строку "Привет!".

А при копирование объекта, у нас создается копия ссылки, сам же объект не дублируется.

#объекты #типы_данных

Методы массивов

Массивы предоставляют множество методов для работы с ними.

Добавление элемента в конец массива - push('item')
Удаление последнего элемента массива - pop()
Удаление первого элемента массива - shift()
Добавление элемента в начало массива - unshift('item')
Поиск номера элемента в массиве - indexOf('item')
Удаление элемента с определённым индексом - splice(pos, 1)
Создание копии массива - slice()

#массив #array

Класс

Классы в JavaScript представляют собой синтаксический сахар над существующим в JavaScript механизмом прототипного наследования.
Синтаксис классов не вводит новую объектно-ориентированную модель, а предоставляет более простой и понятный способ создания объектов и организации наследования.

На картинке выше вы можете увидеть синтаксис class в JavaScript

Используйте вызов new MyClass() для создания нового объекта со всеми перечисленными методами.

#сlass #ООП

Каррирование

Каррирование – продвинутая техника для работы с функциями.
Каррирование – это трансформация функций таким образом, чтобы они принимали аргументы не как f(a, b, c), а как f(a)(b)(c).

Каррирование не вызывает функцию. Оно просто трансформирует её.

Если посмотреть на картинку выше можете увидеть, что каррирование это обёртка над функцией. Другими словами, curry(f) для функции f(a, b) трансформирует её в f(a)(b).

#разное #каррирование

confirm

В браузерной обёртке над нативным JS есть ряд функций, среди которых confirm.

Функция confirm отображает модальное окно с текстом вопроса question и двумя кнопками: OK и Отмена.

Результат – true, если нажата кнопка OK. В других случаях – false.

#confirm #функции

Создание объектов через "new"

Обычный синтаксис {...} позволяет создать только один объект.
Но зачастую нам нужно создать множество однотипных объектов.
Это можно сделать при помощи функции-конструктора и оператора "new".

Функции-конструкторы являются обычными функциями. Но есть два соглашения:
- Имя функции-конструктора должно начинаться с большой буквы.
- Функция-конструктор должна вызываться при помощи оператора "new".

Когда функция вызывается как new User(...), происходит следующее:
- Создаётся новый пустой объект, и он присваивается this.
- Выполняется код функции. Обычно он модифицирует this, добавляет туда новые свойства.
- Возвращается значение this.

#объекты #new

Оператор объединения с null '??'

Оператор объединения с null представляет собой два вопросительных знака ??.

Результат выражения a ?? b будет следующим:

 - a, если значение a определено,
 - b, если значение a не определено.

То есть оператор ?? возвращает первый аргумент, если он не null/undefined, иначе второй.

Как правило, оператор ?? нужен для того, чтобы задать значение по умолчанию для потенциально неопределённой переменной.

Важно!!! Эта возможность была добавлена в язык недавно. В старых браузерах может понадобиться полифил.

#Оператор_объединения #undefined

setTimeout

Мы можем вызвать функцию не в данный момент, а позже, через заданный интервал времени. Это называется «планирование вызова».

setTimeout позволяет вызвать функцию один раз через определённый интервал времени.

Синтаксис - на картинке выше

Параметры:
 - func|code
Функция или строка кода для выполнения. Обычно это функция. По историческим причинам можно передать и строку кода, но это не рекомендуется.
 - delay
Задержка перед запуском в миллисекундах (1000 мс = 1 с). Значение по умолчанию – 0.
 - arg1, arg2
Аргументы, передаваемые в функцию (не поддерживается в IE9-)

#setTimeout #планирование

Прерывание цикла «break»

Обычно цикл завершается при вычислении условия в false.

Но мы можем выйти из цикла в любой момент с помощью специальной директивы break.

Например, на картинке выше код подсчитывает сумму вводимых чисел до тех пор, пока посетитель их вводит, а затем – выдаёт.

Директива break в строке (*) полностью прекращает выполнение цикла и передаёт управление на строку за его телом, то есть на alert.

Вообще, сочетание «бесконечный цикл + break» – отличная штука для тех ситуаций, когда условие, по которому нужно прерваться, находится не в начале или конце цикла, а посередине.

#break #циклы