Решайте практические тесты из собеседований на нашем втором канале @tests_js

prompt

Так как браузер используется как демо-среда, необходимо знать функцию prompt.

Функция prompt принимает два аргумента:
 - title
Текст для отображения в окне.
 - default
Необязательный второй параметр, который устанавливает начальное значение в поле для текста в окне.

Пользователь может напечатать что-либо в поле ввода и нажать OK. Введённый текст будет присвоен переменной result. 
Пользователь также может отменить ввод нажатием на кнопку «Отмена» или нажав на клавишу Esc. 
В этом случае значением result станет null.

#promt #фуекции

Побитовые операторы

Побитовые операторы работают с 32-разрядными целыми числами (при необходимости приводят к ним), на уровне их внутреннего двоичного представления.

Поддерживаются следующие побитовые операторы:
- AND (и) - &
- OR (или) - |
- XOR (исключающее или) - ^
- NOT (не) - ~
- LEFT SHIFT (левый сдвиг) - <<
- RIGHT SHIFT (правый сдвиг) - >>
- ZERO-FILL RIGHT SHIFT (правый сдвиг с заполнением нулями) - >>>

#побитовые_операторы #основы

Точка с запятой

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

В JavaScript интерпретирует перенос строки как «неявную» точку с запятой. Это называется автоматическая вставка точки с запятой.

В большинстве случаев новая строка подразумевает точку с запятой. Но «в большинстве случаев» не значит «всегда»!

Код на картинке выше выведет 6, потому что
JavaScript не вставляет здесь точку с запятой. 
Интуитивно очевидно, что, если строка заканчивается знаком "+", значит, это «незавершённое выражение», поэтому точка с запятой не требуется. 

И в этом случае всё работает, как задумано.

#точка_с_запятой #основы

Решайте практические тесты из собеседований на нашем втором канале @tests_js

Квадратные скобки в объекте

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

На примере выше JavaScript видит, что мы обращаемся к свойству user.likes, а затем идёт непонятное слово birds. В итоге синтаксическая ошибка.

Точка требует, чтобы ключ был именован по правилам именования переменных. То есть не имел пробелов, не начинался с цифры и не содержал специальные символы, кроме $ и _.

Для таких случаев существует альтернативный способ доступа к свойствам через квадратные скобки. Такой способ сработает с любым именем свойства:

#квадратные_скобки #объекты

Условный оператор „?“

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

Так называемый «условный» оператор «вопросительный знак» позволяет нам сделать это более коротким и простым способом.

Оператор представлен знаком вопроса ?. Его также называют «тернарный», так как этот оператор, единственный в своём роде, имеет три аргумента.

Сначала вычисляется условие: если оно истинно, тогда возвращается значение1, в противном случае – значение2.

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

Решайте практические тесты из собеседований на нашем втором канале @tests_js

Комментарии

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

Комментарии могут находиться в любом месте скрипта. Они не влияют на его выполнение, поскольку движок просто игнорирует их.

Однострочные комментарии начинаются с двойной косой черты //.
Часть строки после // считается комментарием. Такой комментарий может как занимать строку целиком, так и находиться после инструкции.

Многострочные комментарии начинаются косой чертой со звёздочкой /* и заканчиваются звёздочкой с косой чертой */.
Содержимое комментария игнорируется, поэтому, если мы поместим код внутри /* … */, он не будет исполняться.

#коментарии #основы

alert

Так как браузер используется как демо-среда, необходимо знать функцию alert.
Эта функция показывает сообщение и ждёт, пока пользователь нажмёт кнопку «ОК».

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

alert принимает только один строковый аргумент!

#alert #функции

Синтаксис new Function

Существует ещё один вариант объявлять функции. Он используется крайне редко, но иногда другого решения не найти.

Функция создаётся с заданными аргументами arg1...argN и телом functionBody.

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

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

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

#функции #new_function

Внутреннее устройство массива

Массив – это особый подвид объектов. 
Квадратные скобки, используемые для того, чтобы получить доступ к свойству arr[0] – это по сути обычный синтаксис доступа по ключу, как obj[key], где в роли obj у нас arr, а в качестве ключа – числовой индекс.

Массивы расширяют объекты, так как предусматривают специальные методы для работы с упорядоченными коллекциями данных, а также свойство length. 
Но в основе всё равно лежит объект.

Следует помнить, что в JavaScript существует 8 основных типов данных. 
Массив является объектом и, следовательно, ведёт себя как объект.

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

#массив #внутреннее_устройство_массива

Проверка isFinite и isNaN

Это специальные числовые значения:

 - Infinity — особенное численное значение, которое ведёт себя в точности как математическая бесконечность ∞.
 - NaN представляет ошибку.

Эти числовые значения принадлежат типу number, но они не являются «обычными» числами, поэтому есть функции для их проверки:

 - isNaN(value) преобразует значение в число и проверяет является ли оно NaN.
Нужна ли нам эта функция? Разве не можем ли мы просто сравнить === NaN? К сожалению, нет. 
Значение NaN уникально тем, что оно не является равным ни чему другому, даже самому себе.

 - isFinite(value) преобразует аргумент в число и возвращает true, если оно является обычным числом, т.е. не NaN/Infinity.

#isFinite #isNaN

Флаги свойств

Помимо значения value, свойства объекта имеют три специальных атрибута (так называемые «флаги»).

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

Обычно они скрыты. Когда мы создаём свойство «обычным способом», все они имеют значение true. 
Но мы можем изменить их в любое время.

Метод Object.getOwnPropertyDescriptor позволяет получить полную информацию о свойстве.
Синтаксис можете увидеть на картинке выше.

 - obj
Объект, из которого мы получаем информацию.
 - propertyName
Имя свойства.

Возвращаемое значение – это объект, так называемый «дескриптор свойства»: он содержит значение свойства и все его флаги.

#флаги_свойств #объекты

Рекурсия

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

В процессе выполнения задачи в теле функции могут быть вызваны другие функции для выполнения подзадач. Частный случай подвызова – когда функция вызывает сама себя. Это как раз и называется рекурсией.

В качестве примера возьмем функцию pow(x, n), которая возводит x в натуральную степень n. 
Иначе говоря, умножает x на само себя n раз.

На картинке выше когда функция pow(x, n) вызывается, исполнение делится на две ветви:

 - Если n == 1, тогда всё просто. Эта ветвь называется базой рекурсии, потому что сразу же приводит к очевидному результату: pow(x, 1) равно x.

 - Мы можем представить pow(x, n) в виде: x * pow(x, n - 1).

Эта ветвь – шаг рекурсии: мы сводим задачу к более простому действию (умножение на x) и более простой аналогичной задаче (pow с меньшим n).

Функция pow рекурсивно вызывает саму себя до n == 1.

#рекурсия #функции

innerHTML: содержимое элемента

Свойство innerHTML позволяет получить HTML-содержимое элемента в виде строки.

Мы также можем изменять его. Это один из самых мощных способов менять содержимое на странице.

На картинке выше содержимое document.body, скрипт полностью заменяет его.

#dom #браузер

Кавычки

В JavaScript есть разные типы кавычек.
Строку можно создать с помощью одинарных, двойных либо обратных кавычек.

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

Ещё одно преимущество обратных кавычек — они могут занимать более одной строки, как на картинке выше.

Одинарные и двойные кавычки в языке с незапамятных времён: тогда потребность в многострочных строках не учитывалась. Что касается обратных кавычек, они появились существенно позже, и поэтому они гибче.

#кавычки #строки

Function Expression

Функция в JavaScript – это не магическая языковая структура, а особого типа значение.
Синтаксис, который часто используется называется Function Declaration (Объявление Функции).

Существует ещё один синтаксис создания функций, который называется Function Expression (Функциональное Выражение).

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

Смысл обоих примеров кода одинаков: "создать функцию и поместить её значение в переменную sayHi"

#функции #function_expression

Браузерные события

Событие – это сигнал от браузера о том, что что-то произошло. 
Все DOM-узлы подают такие сигналы (хотя события бывают и не только в DOM).

Вот список самых часто используемых DOM-событий:

События мыши:
 - click – происходит, когда кликнули на элемент левой кнопкой мыши (на устройствах с сенсорными экранами оно происходит при касании).
 - contextmenu – происходит, когда кликнули на элемент правой кнопкой мыши.
 - mouseover / mouseout – когда мышь наводится на / покидает элемент.
 - mousedown / mouseup – когда нажали / отжали кнопку мыши на элементе.
 - mousemove – при движении мыши.

События на элементах управления:
 - submit – пользователь отправил форму <form>.
 - focus – пользователь фокусируется на элементе, например нажимает на <input>.

Клавиатурные события:
 - keydown и keyup – когда пользователь нажимает / отпускает клавишу.

#браузерные_события #DOM

Глобальный объект

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

В браузере он называется window, в Node.js — global, в другой среде исполнения может называться иначе.
Недавно globalThis был добавлен в язык как стандартизированное имя для глобального объекта, которое должно поддерживаться в любом окружении. 

Ко всем свойствам глобального объекта можно обращаться напрямую.
В браузере глобальные функции и переменные, объявленные с помощью var (не let/const!), становятся свойствами глобального объекта.

#глобальный_объект #window

Имена переменных

В JavaScript есть два ограничения, касающиеся имён переменных:

 - Имя переменной должно содержать только буквы, цифры или символы $ и _.
 - Первый символ не должен быть цифрой.

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

Самое интересное – знак доллара '$' и подчёркивание '_' также можно использовать в названиях.
Это обычные символы, как и буквы, без какого-либо особого значения.

Важно помнить!!! Регистр имеет значение. Переменные с именами apple и AppLE – это две разные переменные.

#имена_переменных #основы