переменная в джава скрипт это
Переменные в JavaScript
Курс: Основы HTML и CSS
Курс: Разработка на C#
Курс: Python-разработчик с нуля
Осваивайте профессию, начните зарабатывать, а платите через год!
Курсы Python Акция! Бесплатно!
Станьте хакером на Python за 3 дня
Веб-вёрстка. CSS, HTML и JavaScript
Станьте веб-разработчиком с нуля
Объявление переменных
Прежде чем использовать переменную в JavaScript, ее необходимо объявить. Для объявления или, другими словами, создания переменной используется ключевое слово var (от variable — переменная):
Значение переменной сохраняется в соответствующей области памяти и в дальнейшем доступ к нему осуществляется при обращении по имени. Если же переменную не инициализировать, то ее начальное значение остается неопределенным undefined :
При желании можно объявить сразу несколько переменных, разделив их запятыми:
JavaScript – это нетипизированный язык. Это означает, что переменная JavaScript может содержать значение любого типа, в отличие от Java- или C-переменной, в которой может содержаться только определенный тип данных, заданный при ее объявлении.
Так, в JavaScript можно присвоить переменной число, а затем присвоить той же переменной строку. Тип значения переменной может меняться во время выполнения программы, и JavaScript позаботится об этом автоматически.
Значение в переменной можно изменять сколько угодно раз:
При объявлении можно инициализировать переменную, а затем скопировать значение переменной в новую переменную.
Когда одна переменная с примитивным значением присваивается другой, создается копия значения, хранящегося в ячейке памяти, а затем она записывается по адресу другой переменной, например:
Имена переменных
Вслед за первым символом имени переменной можно использовать последовательность букв, цифр и символа подчеркивания без пробелов и знаков препинания. Поскольку JavaScript чувствителен к регистру, буквы включают символы от «A» до «Z» (верхний регистр) и символы от «a» до «z» (нижний регистр). Вы можете использовать буквы ISO 8859-1 или Unicode, например, å или ü.
Примеры правильных имен переменных:
Примеры неправильных имен переменных:
Например, следующий сценарий выдаст синтаксическую ошибку:
Имя переменной должно быть понятным и максимально чётко соответствовать хранимым в ней данным.
Область видимости переменной
Внутри тела функции локальная переменная имеет преимущество перед глобальной переменной с тем же именем:
Переменные Javascript
Переменные в JavaScript это контейнеры для хранения различных данных.
В следующем примере x, y, z это переменные:
Как видно из этого примера, переменные
Идентификаторы JavaScript
Все переменные JavaScript должны идентифицироваться при помощи уникальных имен. Эти уникальные имена называются идентификаторами.
Идентификаторы могут быть короткими (как x и y) или же более описательными (age, sum, totalVolume).
Общие правила составления имен для переменных (уникальных идентификаторов) следующие:
Оператор присваивания
В JavaScript знак «равно» (=) является оператором «присваивания», а не оператором «равен чему-то».
И это прямое отличие от математики. В математике следующее выражение не имеет смысла:
В JavaScript же данное выражение вполне себе наполнено смыслом — оно означает, что значение x + 5 присваивается переменной x (вычисляется значение x + 5, а результат помещается в переменную x, т. е. значение в переменной x увеличивается на 5.)
Оператор «равен чему-то» в JavaScript записывается как ==.
Типы данных в JavaScript
Переменные JavaScript могут хранить как числа, так и текст.
В программировании текстовые значения называются текстовые строки.
JavaScript может работать с многими типами данных, но на данном этапе достаточно знать о числах и строках.
Строки записываются в двойных или одинарных кавычках. Числа записываются без кавычек. Если поместить число в кавычки, то оно будет восприниматься обработчиком JavaScript, как текстовая строка.
Декларирование (создание) переменных JavaScript
Процесс создания переменной в JavaScript называется «декларирование» переменной.
Переменная JavaScript декларируется при помощи ключевого слова var:
Чтобы присвоить переменной значение, следует воспользоваться оператором присваивания:
Также присвоить значение можно и во время декларирования переменной:
В следующем примере мы создаем переменную с именем carName и сразу же присваиваем ей значение «Volvo». Затем мы «выводим» значение переменной в HTML параграфе с атрибутом :
Декларирование всех переменных в начале скрипта считается хорошей практикой программирования.
Одно выражение, много переменных
Вы можете декларировать в одном выражении несколько переменных.
Для этого нужно начать выражение с ключевого слова var и разделять декларируемые переменные запятой:
Декларация может располагаться на нескольких строках:
Значение = undefined
В компьютерных программах переменные часто декларируются без определения значений. В этом случае предполагается, что значение в дальнейшем должно быть вычислено, либо предоставлено позднее в результате, например, пользовательского ввода. При этом у переменной, декларированной без значения, на самом деле будет значение undefined.
После выполнения кода следующего примера у переменной carName будет установлено значение undefined:
Повторное декларирование переменных JavaScript
Если вы повторно декларируете переменную JavaScript, то она не потеряет значение, которое у нее было до этого.
После выполнения следующего кода в переменной carName все еще будет храниться значение «Volvo»:
Арифметика JavaScript
Как и в математике, с переменными JavaScript вы можете при помощи, например, оператора сложения (+) осуществлять арифметические вычисления:
Также можно складывать и строки, но при этом строки будут конкатенироваться, т.е. объединяться:
Если поместить число в кавычки, то остальные числа будут восприниматься как строки, и будет проведена операция конкатенации строк:
Типы данных, константы и переменные в JavaScript
Переменные (ключевые слова var, let и const)
Переменная – это именованный участок памяти для хранения данных.
Представить себе переменную можно как некоторую область памяти, в которую вы можете как записать некоторую информацию, так и прочитать её из неё. Доступ к этому месту в памяти выполняется по имени, которое вы установили переменной при её создании.
В процессе выполнения программы значения переменной могут меняться. Но в определённый момент времени переменная всегда имеет какое-то одно значение.
Для того чтобы получить значение переменной к ней нужно просто обратиться по имени.
Объявление переменных с помощью let и const
1. Переменная объявленная посредством let имеет область видимости, ограниченную блоком. Т.е. она видна только внутри фигурных скобок, в которых она создана, а также в любых других скобках, вложенных в эти. Вне них она не существует.
Переменная, объявленная через ключевое слово var имеет функциональную область видимости. Т.е. она ограничена только пределами функции.
Такая переменная будет видна за пределами блока, в котором она создана.
2. Переменные, созданные с помощью let не поднимаются к началу текущего контекста, т.е. hoisting для них не выполняется. Другими словами, к такой переменной нельзя обратиться до её объявления.
Переменные, созданные с помощью var поднимаются к началу текущего контекста. Это означает что к таким переменным вы можете обратиться до их объявления.
Константы (const)
Именование констант рекомендуется выполнять прописными буквами. Если константа состоит из несколько слов, то их между собой желательно отделять с помощью нижнего подчёркивания.
При попытке изменить значение константы вам будет брошена ошибка.
Когда переменной вы присваиваете значение, имеющее объектный тип данных, в ней уже будет храниться не сам этот объект, а ссылка на него. Это необходимо учитвать при работе с переменными в JavaScipt.
В этом случае когда вы константе присваиваете некий объект, то вы не можете изменить ссылку, хранящуюся в самой константе. Но сам объект доступен для изменения.
Слабая типизация. Именование переменых
JavaScript является языком с динамической или слабой типизацией. Это означает, что при объявлении переменной ей не нужно указывать тип данных, который она может принимать. Следовательно, в переменную можно сначала поместить значение, имеющее один тип данных, а потом другой.
Значение переменной можно изменять неограниченное количество раз.
Хорошей практикой при разработке клиентских сценариев считается использование в определённой переменной только одного типа данных, т.е. не записывать в переменную значения, имеющие различные типы данных. Чтобы понять какой тип данных стоит ожидать в переменной рекомендуется при создании сразу же инициализировать её определённым значением.
Но создавать, таким образом, переменные не рекомендуется.
Типы данных
В JavaScript типы данных можно разделить на примитивные и объектные.
Переменные, содержащие примитивные типы данных хранят значение явно.
В JavaScript выделяют 5 примитивных типов данных:
Если одной переменной присвоить значение другой, которая содержит примитивный тип данных, то она получит собственную копию этого значения.
Переменные, содержащие объект, на самом деле хранят не сам объект, а ссылку на него.
Если одной переменной присвоить значение другой, которая содержит объект (ссылку на него), то она тоже получит ссылку на него. В результате этой операции две эти переменные будут содержать ссылку на один и тот же объект.
Число (number)
Формат представления чисел в JavaScript осуществляется в соответствии со стандартом IEEE 754-2008.
Целые числа в JavaScript можно задавать не только в десятичной системе счисления, но и в восьмеричной (0) или шестнадцатеричной системе счисления (0x) с использованием префиксов, указанных в круглых скобках:
Записывать числа возможно в экспоненциальной форме :
Числовой тип данных кроме чисел содержит ещё специальные числовые значения :
Специальное значения Infinity означает очень большое положительное число, т.е. число, которое не может быть представлено в JavaScript по причине того, что оно слишком велико.
Пример выражений в результате вычисления которых будет возвращены специальные числовые значения :
Значение NaN возвращается в результате выполнения математических операций, которые JavaScript не может вычислить.
При этом очень интересным является то, что значение NaN в JavaScript не равно ничему включая себя.
Логический тип данных (Boolean)
Boolean – примитивный тип данных, который имеет всего два значения: true (истина) и false (ложь).
Строка (String)
Строка (String) – это тип данных, который используется в JavaScript для представления текста.
Строка JavaScript может состоять из 0 или большего количества символов.
В качестве формата строки в JavaScript всегда использутся кодировка Unicode.
В JavaScript нет разницы между одинарными и двойными кавычками.
Но, в некоторых случаях есть смысл использовать именно одинарные кавычки, а не двойные и наоборот.
Например, когда строка содержит двойные кавычки, её более удобно заключить в одинарные. Это избавит от необходимости экранирования в ней двойных кавычек.
Строка в JavaScript может содержать специальные символы. Например, \n (перевод строки), \t (табуляция), \r (возврат каретки) и др.
Значение «undefined»
Этот тип данных имеет объявленная переменная, которой ещё не присвоено значение.
Значение undefined также будет возвращено при обращении к несуществующему свойству объекта.
Значение «null»
Объект (Object)
Объект – это структура данных, состоящая из пар имя-значение.
Создание объекта с помощью нотации литерала объекта осуществляется следующим образом:
Как видно, имя от значения отделяется с помощью двоеточия, а пары между собой с помощью запятой.
При этом если в качестве значения пары выступает функция, то она называется методом этого объекта. Все остальные пары, т.е. пары в которых в качестве значения не используется функция, называются свойствами объекта.
Обращение к свойствам объекта выполняется через точку или посредством скобочной записи.
Оператор typeof
Оператор typeof используется для получения информации о типе данных выражения в виде строки.
Синтаксис оператора typeof (вариант без круглых скобок):
Синтаксис оператора typeof (с использованием круглых скобок):
Переменные, области и поднятие переменных в JavaScript
Переменные – фундаментальная составляющая многих языков программирования; они являются одним из наиболее важных понятий для начинающих программистов. В JavaScript существует множество различных свойств переменных, а также несколько правил, которые необходимо соблюдать при их именовании. В JavaScript есть три ключевых слова, используемые для объявления переменной – var, let и const – и каждое из них влияет на то, как будет интерпретироваться переменная в коде.
Данный мануал ознакомит вас с переменными, научит их объявлять и именовать, а также объяснит разницу между var, let и const. Кроме того, вы узнаете, что такое поднятие переменных и как область влияет на поведение переменной.
Что такое переменные
Переменная – это именованный фрагмент памяти, используемый для хранения разных значений. Часть информации, на которую можно сослаться несколько раз, может быть сохранена в переменной для последующего использования или модификации. В JavaScript значение, содержащееся внутри переменной, может быть любым типом данных, включая число, строку или объект.
До спецификации языка ECMAScript 2015 (ES6), на котором основан JavaScript в данный момент, существовал только один способ объявить переменную – с использованием ключевого слова var. Потому большинство старых кодов и мануалов используют для объявления переменных только var. Давайте рассмотрим различия между var, let и const.
Ключевое слово var позволяет продемонстрировать концепцию самой переменной. В приведенном ниже примере мы объявляем переменную и присваиваем ей значение.
// Assign the string value 8host to the username identifier
var username = «8host_blog»;
Это выражение состоит из нескольких частей:
Теперь можно использовать переменную username в коде. JavaScript запомнит, что username представляет значение 8host_blog.
// Check if variable is equal to value
if (username === «8host_blog») <
console.log(true);
>
true
Как упоминалось ранее, переменные могут выражаться любым типом данных JavaScript. В этом примере переменные выражаются строкой, числом, объектом, логическим значением и нулевым значением.
// Assignment of various variables
var name = «Morty»;
var spartans = 300;
var kingdoms = [ «mammals», «birds», «fish» ];
var poem = < roses: "red", violets: "blue" >;
var success = true;
var nothing = null;
С помощью console.log можно просмотреть значение любой переменной:
// Send spartans variable to the console
console.log(spartans);
300
Переменные хранят в памяти данные, которые впоследствии можно использовать или изменить. Переменные также можно переназначить и присвоить им новое значение. Простой пример ниже демонстрирует, как в переменной можно сохранить, а затем обновить пароль.
// Assign value to password variable
var password = «hunter2»;
// Reassign variable value with a new value
password = «hunter3»;
console.log(password);
‘hunter3’
В реальной программе пароль, скорее всего, будет надежно сохранен в базе данных. Однако этот простой пример иллюстрирует ситуацию, в которой вы можете обновить значение переменной. Значение переменной password было hunter2, но ей было присвоено новое значение, hunter3, и теперь JavaScript будет использовать новое значение.
Именование переменных
В JavaScript имена переменных называются идентификаторами. Несколько правил именования идентификаторов можно найти в мануале Синтаксис и структура кода JavaScript. Вот они вкратце:
JavaScript также имеет соглашение об использовании верблюжьего регистра (camelCase) в именах функций и переменных, объявленных с помощью var или let. При этом первое слово пишется в нижнем регистре, а каждое следующее слово начинается с заглавной буквы (слова пишутся без пробелов между ними). Большинство переменных, которые не являются константами, будут следовать этому соглашению, за некоторыми исключениями. Имена переменных, которые являются константами (объявлены ключевым словом const), обычно записываются в верхнем регистре.
Кажется, правил довольно много, но так кажется только на первый взгляд. Часто работая с JavaScript, вы быстро их запомните.
Разница между var, let и const
Для объявления переменных JavaScript использует три разных ключевых слова, которые добавляют дополнительный уровень сложности. Эти ключевые слова отличаются областями видимости переменной, поднятием и возможностью переназначения.
Ключевое слово | Область видимости | Поднятие | Переназначение | Обновление |
var | На уровне функции | Да | Да | Да |
let | На уровне блока | Нет | Да | Нет |
const | На уровне блока | Нет | Нет | Нет |
Возможно, вам интересно, какое из трех ключевых слов вы должны использовать в своих программах. Принято использовать const как можно чаще, а let – в циклах и для переназначения. Как правило, var используется в устаревшем коде.
Область видимости JavaScript
Область видимости в JavaScript относится к текущему контексту кода, который определяет доступность переменных. Область бывает локальной и глобальной:
В приведенном ниже примере мы создадим глобальную переменную.
// Initialize a global variable
var creature = «wolf»;
Вы знаете, что переменные можно переназначить. В локальной области видимости можно создавать новые переменные с тем же именем, что и переменные во внешней области, не изменяя и не переопределения исходного значения.
В приведенном ниже примере создается глобальная переменная species. Внутри функции есть локальная переменная с тем же именем. Отправляя их в консоль, вы увидите, что значение переменной отличается в зависимости от области действия, а исходное значение не изменяется.
// Initialize a global variable
var species = «human»;
function transform() <
// Initialize a local, function-scoped variable
var species = «werewolf»;
console.log(species);
>
// Log the global and local variable
console.log(species);
transform();
console.log(species);
human
werewolf
human
В этом примере локальная переменная имеет область видимости на уровне функции. Переменные, объявленные ключевым словом var, всегда относятся к этой области (то есть они распознают функции как имеющие отдельную область). Таким образом, локальная переменная недоступна в глобальной области.
Однако новые ключевые слова let и const относятся к области на уровне блока. Это означает, что новая локальная область создается из любого блока, включая функциональные блоки, операторы if, а также циклы for и while.
Чтобы проиллюстрировать разницу между переменными на уровне функции и блока, создайте новую переменную в блоке if с помощью let.
В этом примере переменная species имеет одно глобальное значение (human) и одно локальное значение (werewolf). Однако если использовать var, будет другой результат.
В результате как глобальная переменная, так и переменная на уровне блока выдают одно значение, werewolf. Это связано с тем, что вместо создания новой локальной переменной var переназначает ту же переменную в той же области. var не понимает, что if должен быть частью другой, новой области. Обычно рекомендуется объявлять переменные на уровне блоков, поскольку это уменьшает риск непреднамеренно переопределить значения переменных.
Поднятие переменных
В большинстве примеров до сих пор для объявления переменной использовалось ключевое слово var, и переменная инициализировалась со значением. После объявления и инициализации можно получить доступ к значению или переназначить переменную.
Если попробовать использовать переменную до того, как она будет объявлена и инициализирована, вернется результат undefined.
// Attempt to use a variable before declaring it
console.log(x);
// Variable assignment
var x = 100;
undefined
Однако если опустить ключевое слово var, переменная не будет объявлена, а только инициализирована. Это вернет ReferenceError и остановит выполнение скрипта.
// Attempt to use a variable before declaring it
console.log(x);
// Variable assignment without var
x = 100;
ReferenceError: x is not defined
Это связано с поднятием – это такое поведение JavaScript, при котором объявления переменных и функций перемещаются в верхнюю часть их области. Поскольку поднимается только фактическое объявление, а не инициализация, в первом примере возвращается undefined.
Чтобы лучше продемонстрировать это понятие, мы написали следующий код и объяснили, как его читает JavaScript:
// The code we wrote
console.log(x);
var x = 100;
// How JavaScript interpreted it
var x;
console.log(x);
x = 100;
Перед выполнением скрипта JavaScript сохраняет x в памяти как переменную. Поскольку переменная вызывалась до того, как была определена, результат возвращается undefined, а не 100. Однако это не вызывает ReferenceError и не останавливает скрипт. Хотя ключевое слово var фактически не изменило местоположение var, это демонстрирует, как работает поднятие. Это поведение может вызвать проблемы, потому что программист, который написал этот код, скорее всего, ожидает, что вывод х будет true, а не undefined.
Также поднятие может привести к непредсказуемым результатам, как в следующем примере:
// Initialize x in the global scope
var x = 100;
function hoist() <
// A condition that should not affect the outcome of the code
if (false) <
var x = 200;
>
console.log(x);
>
hoist();
undefined
В этом примере глобальная переменная x равна 100. В зависимости от оператора if x может измениться на 200, но поскольку условие было false, оно не должно влиять на значение x. Вместо этого x был поднят до начала функции hoist(), и значение стало undefined.
Это непредсказуемое поведение может вызвать ошибки в программе. Поскольку let и const определяются на уровне блока, они не будут подниматься таким образом, как в примере ниже.
// Initialize x in the global scope
let x = true;
function hoist() <
// Initialize x in the function scope
if (3 === 4) <
let x = false;
>
console.log(x);
>
hoist();
true
Дублируемое объявление переменных, которое возможно с var, вызовет ошибку с let и const.
// Attempt to overwrite a variable declared with var
var x = 1;
var x = 2;
console.log(x);
2
// Attempt to overwrite a variable declared with let
let y = 1;
let y = 2;
console.log(y);
Uncaught SyntaxError: Identifier ‘y’ has already been declared
Итак, на переменные, объявленные с var, может повлиять поднятие. Поднятие – это механизм в JavaScript, в котором объявления переменных сохраняются в памяти. Это может привести к неопределенным переменным в коде. Ключевые слова let и const решают эту проблему, вызывая ошибку при попытке использовать переменную перед ее объявлением или объявить переменную более одного раза.
Константы
Многие языки программирования используют константы – это значения, которые нельзя изменить. То есть значения, назначенные константе, не могут быть переназначены.
По общему соглашению идентификаторы const пишутся в верхнем регистре. Это отличает их от других переменных.
В приведенном ниже примере переменная SPECIES инициализируется как константа с помощью ключевого слова const. Попытка переназначить переменную приведет к ошибке.
// Assign value to const
const SPECIES = «human»;
// Attempt to reassign value
SPECIES = «werewolf»;
console.log(SPECIES);
Uncaught TypeError: Assignment to constant variable.
Поскольку значения const нельзя переназначить, их необходимо объявить и инициализировать в одно и то же время, иначе возникнет ошибка.
// Declare but do not initialize a const
const TODO;
console.log(TODO);
Uncaught SyntaxError: Missing initializer in const declaration
Значения, которые не могут измениться при программировании, называются неизменяемыми, а значения, которые могут быть изменены – изменяемыми (это очевидно). Значения константы не могут быть переназначены, однако они изменяемы, поскольку свойства объектов, объявленных с помощью const, можно изменять.
// Create a CAR object with two properties
const CAR = <
color: «blue»,
price: 15000
>
// Modify a property of CAR
CAR.price = 20000;
console.log(CAR);
Константы позволяют вам сообщить другим программистам, работающим над проектом, и себе о том, что данную переменную не следует переназначать. Чтобы объявить переменную, которую можно переназначить, следует использовать let.
Заключение
В этом мануале вы узнали, что такое переменная, ознакомились с правилами именования переменных и научились переназначать их значения. Также вы узнали об областях видимости и поднятии переменных, ограничениях ключевого слова var, а также о том, как let и const устраняют эти проблемы.