Переменные и типы данных в JS

Переменны и типы данных Способы обьявления переменных Переменная Переменная – это «именованное хранилище» для данных. Мы можем использовать переменные для хранения товаров, посетителей и других данных. Имена переменных не должны начинаться с цифр, или зарезервированных имен. Начинать можно тольок с доллара. Назавания нужно писать в стиле кемел кейс Переменные в разном регистре, это разные переменные Способы задания переменных, это LET и CONST. Вар уже устаревшее и не актуальное. Так как переменная существует, еще до ее обьявления Конст необходимо использовать, там где это возможно! Как таковых констант в JS не существует ! Как пример Видим, что хоть обьект задан в виде константы, его можно изменить. А тут видим пример, что вначале мы вызываем переменную var, а только потом ее обьявляем, и все работает, это не правильно. Переменные Let и const видны только в блоке ограниченном фигурными скобками. Вар видно везде! В данной структуре видим ошибку, но если поместим переменную var то все будет работать Новый стандарт, не поддерживается в старых версиях браузера, тоесть переменная let не будет работать в старых браузерах, для этого нам и нужен use strict ТИПЫ ДАННЫХ JS К числовым типам, так же относятся инфинити(бесконечность) и NаN это когда операция не может быть выполнена, например текст поделить на строку В данном случае, видим, что при умножении строки на число, получается тип данных NaN, не число. Строка всегда пишется в кавычках(кавычки можно использовать любые. Даже бектики. Главное не смешивать кавычки). Сама строка может содержать в себе любые данные Логические типы только true или false Тип данных null, это когда данных не существует, достаточно редкая underfind это когда переменная есть, но у нее нету никаких значений Symbol и bigInt почти не используются в реальной практике ОБЬЕКТЫ Это коллекция данных, структура которых используются для хранения абсолютно любых данных Обьект внутри себя содержит данные, они же свойства, или действия, они же методы Обратится к свойству можно двумя способами, через точку или квадратные скобки. Массив Это не отдельный тип данных, это частный случай обьекта Используеться для хранения данных которые идут строго по порядку Можно поместить любой тип данных, числа обьекты и тд Чтобы получить какойто элемент массива, необходимо указать его имя и в квадратных списках порядковый номер. Так как счет начинается с нуля, то и номер указываем как n-1 console.log(arr[2]); ПРОСТОЕ ВЗАИМОДЕЙСТВИЕ С ПОЛЬЗОВАТЕЛЕМ Уже знаем, что alert() это всплывающее сообщение. Confirm() это так же вопрос пользователю, но вариантов ответа только два, да или нет, соответственно в переменную запишеться результат true или false Prompt(), это когда мы задаем вопрос, а пользователь вводит ответ(пример ниже на картинке). Все данные из Prompt приходят в виде строки, если поставить плюс перед этим, то данные сконвертятся в число Второй аргумент, это значение по умолчанию, можно оставлять пустым Typeof позволяет узнать какой тип данных ИНТЕРПОЛЯЦИЯ ИЛИ КОНКАТИНАЦИЯ Чтобы к строке прибавить допустим переменную или произвольное значение, используется + как на примере выше. Переменные пишуться без кавычек, а строки как всегда. Это простой способ конкатинации, но при больших выражениях могут возникнуть проблемы. Поэтому лучше использовать интерполяцию, как на примере ниже. ОПЕРАТОРЫ Операторы сравнения Многие операторы сравнения известны нам из математики. В JavaScript они записываются так: • Больше/меньше: a > b, a < b. • Больше/меньше или равно: a >= b, a <= b. • Равно: a == b. Обратите внимание, для сравнения используется двойной знак равенства ==. Один знак равенства a = b означал бы присваивание. • Не равно. В математике обозначается символом ≠, но в JavaScript записывается как a != b. В этом разделе мы больше узнаем про то, какие бывают сравнения, как язык с ними работает и к каким неожиданностям мы должны быть готовы. В конце вы найдёте хороший рецепт того, как избегать «причуд» сравнения в JavaScript. Результат сравнения имеет логический тип Все операторы сравнения возвращают значение логического типа: • true – означает «да», «верно», «истина». • false – означает «нет», «неверно», «ложь». Например: alert( 2 > 1 ); // true (верно) alert( 2 == 1 ); // false (неверно) alert( 2 != 1 ); // true (верно) Результат сравнения можно присвоить переменной, как и любое значение: let result = 5 > 4; // результат сравнения присваивается переменной result alert( result ); // true Сравнение строк Чтобы определить, что одна строка больше другой, JavaScript использует «алфавитный» или «лексикографический» порядок. Другими словами, строки сравниваются посимвольно. Например: alert( 'Я' > 'А' ); // true alert( 'Коты' > 'Кода' ); // true alert( 'Сонный' > 'Сон' ); // true Алгоритм сравнения двух строк довольно прост: 1. Сначала сравниваются первые символы строк. 2. Если первый символ первой строки больше (меньше), чем первый символ второй, то первая строка больше (меньше) второй. Сравнение завершено. 3. Если первые символы равны, то таким же образом сравниваются уже вторые символы строк. 4. Сравнение продолжается, пока не закончится одна из строк. 5. Если обе строки заканчиваются одновременно, то они равны. Иначе, большей считается более длинная строка. В примерах выше сравнение 'Я' > 'А' завершится на первом шаге, тогда как строки 'Коты' и 'Кода' будут сравниваться посимвольно: 1. К равна К. 2. о равна о. 3. т больше, чем д. На этом сравнение заканчивается. Первая строка больше. Используется кодировка Unicode, а не настоящий алфавит Приведённый выше алгоритм сравнения похож на алгоритм, используемый в словарях и телефонных книгах, но между ними есть и различия. Например, в JavaScript имеет значение регистр символов. Заглавная буква "A" не равна строчной "a". Какая же из них больше? Строчная "a". Почему? Потому что строчные буквы имеют больший код во внутренней таблице кодирования, которую использует JavaScript (Unicode). Мы ещё поговорим о внутреннем представлении строк и его влиянии в главе Строки. Сравнение разных типов При сравнении значений разных типов JavaScript приводит каждое из них к числу. Например: alert( '2' > 1 ); // true, строка '2' становится числом 2 alert( '01' == 1 ); // true, строка '01' становится числом 1 Логическое значение true становится 1, а false – 0. Например: alert( true == 1 ); // true alert( false == 0 ); // true Забавное следствие Возможна следующая ситуация: • Два значения равны. • Одно из них true как логическое значение, другое – false. Например: let a = 0; alert( Boolean(a) ); // false let b = "0"; alert( Boolean(b) ); // true alert(a == b); // true! С точки зрения JavaScript, результат ожидаем. Равенство преобразует значения, используя числовое преобразование, поэтому "0" становится 0. В то время как явное преобразование с помощью Boolean использует другой набор правил. Строгое сравнение Использование обычного сравнения == может вызывать проблемы. Например, оно не отличает 0 от false: alert( 0 == false ); // true Та же проблема с пустой строкой: alert( '' == false ); // true Это происходит из-за того, что операнды разных типов преобразуются оператором == к числу. В итоге, и пустая строка, и false становятся нулём. Как же тогда отличать 0 от false? Оператор строгого равенства === проверяет равенство без приведения типов. Другими словами, если a и b имеют разные типы, то проверка a === b немедленно возвращает false без попытки их преобразования. Давайте проверим: alert( 0 === false ); // false, так как сравниваются разные типы Ещё есть оператор строгого неравенства !==, аналогичный !=. Оператор строгого равенства дольше писать, но он делает код более очевидным и оставляет меньше места для ошибок. Базовые операторы, математика Многие операторы знакомы нам ещё со школы: сложение +, умножение *, вычитание - и так далее. В этой главе мы начнём с простых операторов, а потом сконцентрируемся на специфических для JavaScript аспектах, которые не проходят в школьном курсе арифметики. Термины: «унарный», «бинарный», «операнд» Прежде, чем мы двинемся дальше, давайте разберёмся с терминологией. • Операнд – то, к чему применяется оператор. Например, в умножении 5 * 2 есть два операнда: левый операнд равен 5, а правый операнд равен 2. Иногда их называют «аргументами» вместо «операндов». • Унарным называется оператор, который применяется к одному операнду. Например, оператор унарный минус "-" меняет знак числа на противоположный: • let x = 1; • • x = -x; alert( x ); // -1, применили унарный минус • Бинарным называется оператор, который применяется к двум операндам. Тот же минус существует и в бинарной форме: • let x = 1, y = 3; alert( y - x ); // 2, бинарный минус вычитает значения Формально, в последних примерах мы говорим о двух разных операторах, использующих один символ: оператор отрицания (унарный оператор, который обращает знак) и оператор вычитания (бинарный оператор, который вычитает одно число из другого). Математика Поддерживаются следующие математические операторы: • Сложение +, • Вычитание -, • Умножение *, • Деление /, • Взятие остатка от деления %, • Возведение в степень **. Первые четыре оператора очевидны, а про % и ** стоит сказать несколько слов. Взятие остатка % Оператор взятия остатка %, несмотря на обозначение, никакого отношения к процентам не имеет. Результат a % b – это остаток от целочисленного деления a на b. Например: alert( 5 % 2 ); // 1, остаток от деления 5 на 2 alert( 8 % 3 ); // 2, остаток от деления 8 на 3 Возведение в степень ** В выражении a ** b оператор возведения в степень умножает a на само себя b раз. Например: alert( 2 ** 2 ); // 4 (2 умножено на себя 2 раза) alert( 2 ** 3 ); // 8 (2 * 2 * 2, 3 раза) alert( 2 ** 4 ); // 16 (2 * 2 * 2 * 2, 4 раза) Математически, оператор работает и для нецелых чисел. Например, квадратный корень является возведением в степень 1/2: alert( 4 ** (1/2) ); // 2 (степень 1/2 эквивалентна взятию квадратного корня) alert( 8 ** (1/3) ); // 2 (степень 1/3 эквивалентна взятию кубического корня) Сложение строк при помощи бинарного + Давайте рассмотрим специальные возможности операторов JavaScript, которые выходят за рамки школьной арифметики. Обычно при помощи плюса '+' складывают числа. Но если бинарный оператор '+' применить к строкам, то он их объединяет в одну: let s = "моя" + "строка"; alert(s); // моястрока Обратите внимание, если хотя бы один операнд является строкой, то второй будет также преобразован в строку. Например: alert( '1' + 2 ); // "12" alert( 2 + '1' ); // "21" Как видите, не важно, первый или второй операнд является строкой. Вот пример посложнее: alert(2 + 2 + '1' ); // будет "41", а не "221" Здесь операторы работают один за другим. Первый + складывает два числа и возвращает 4, затем следующий + объединяет результат со строкой, производя действие 4 + '1' = 41. Сложение и преобразование строк — это особенность бинарного плюса +. Другие арифметические операторы работают только с числами и всегда преобразуют операнды в числа. Например, вычитание и деление: alert( 6 - '2' ); // 4, '2' приводится к числу alert( '6' / '2' ); // 3, оба операнда приводятся к числам Приведение к числу, унарный + Плюс + существует в двух формах: бинарной, которую мы использовали выше, и унарной. Унарный, то есть применённый к одному значению, плюс + ничего не делает с числами. Но если операнд не число, унарный плюс преобразует его в число. Например: // Не влияет на числа let x = 1; alert( +x ); // 1 let y = -2; alert( +y ); // -2 // Преобразует не числа в числа alert( +true ); // 1 alert( +"" ); // 0 На самом деле это то же самое, что и Number(...), только короче. Необходимость преобразовывать строки в числа возникает очень часто. Например, обычно значения полей HTML-формы — это строки. А что, если их нужно, к примеру, сложить? Бинарный плюс сложит их как строки: let apples = "2"; let oranges = "3"; alert( apples + oranges ); // "23", так как бинарный плюс объединяет строки Поэтому используем унарный плюс, чтобы преобразовать к числу: let apples = "2"; let oranges = "3"; // оба операнда предварительно преобразованы в числа alert( +apples + +oranges ); // 5 // более длинный вариант // alert( Number(apples) + Number(oranges) ); // 5 С точки зрения математика, такое изобилие плюсов выглядит странным. Но с точки зрения программиста тут нет ничего особенного: сначала выполнятся унарные плюсы, которые приведут строки к числам, а затем бинарный '+' их сложит. Сокращённая арифметика с присваиванием Часто нужно применить оператор к переменной и сохранить результат в ней же. Например: let n = 2; n = n + 5; n = n * 2; Эту запись можно укоротить при помощи совмещённых операторов += и *=: let n = 2; n += 5; // теперь n = 7 (работает как n = n + 5) n *= 2; // теперь n = 14 (работает как n = n * 2) alert( n ); // 14 Условные операторы Условные операторы позволяют проверить некие условия. Первый условный оператор называется if else () Допустим условие, проверяем, если сейчас 7 утра, то я встаю и иду на учебу, иначе(если какое то другое время), то я делаю чтото другое. Как пример простейшей проверки, если 4 =4, то мы выполняем условие в фигурных скобках В этом примере видим уже доп условие else, проверяем если 4 = 9, то далается одно, но если то не правда, то переходим к блоку else. Проверять можно не только равенства, но и больше меньше, строки цифры и так далее. Так же условие может расширяться, при помощи добавления конструкции else if. Я думаю тут все понятно и логично, мы проверяем переменную и в зависимости от результатов, выводим результат. Но Если условий слишком много, то можно использовать второй оператор, который называеться switch Он проверяет, какието данные, смотрит на возможные ТОЧНЫЕ совпадение, и в случае совпадения выдает результат. Тоесть всегда идет строгое сравнение. Это базовая структура switch. В скобках пишем что проверяем. Case, это наши возможные результаты. В данном случае понятно что если вдруг будет 49, то это не верно и он выдаст данное сообщение. Case всегда выглядит так, что сравниваем, что выполнится в данном случае и break. Break выходит из кейса и он обязателен, кейсов может быть сколько угодно. В конце видим немного другую структуру, которая называется default, она стоит безу условия проверки. Она означает, что если вообще не будет никаких совпадений, то выполнится действие по умолчанию!