Какие ключевые слова используются в javascript для того чтобы объявить переменную

Грамматика и типы

В данной главе рассматриваются базовая грамматика, объявление переменных, типы данных и литералы.

Основы

JavaScript заимствует большую часть синтаксиса из Java, но также испытал влияние таких языков, как Awk, Perl и Python.

JavaScript чувствителен к регистру и использует кодировку символов Unicode. Например, слово Früh («рано» по-немецки) может использоваться в качестве имени переменной.

var Früh = "foobar";

Но, переменная früh не то же самое что Früh потому что JavaScript чувствителен к регистру.

В JavaScript инструкции называются statements и разделяются точкой с запятой (;). Пробел (space), табуляция (tab) и перевод строки (newline) называются пробельными символами (whitespace). Исходный текст скриптов на JavaScript сканируется слева направо и конвертируется в последовательность входных элементов, являющихся токенами (tokens), управляющими символами, символами конца строки, комментариями или пробельными символами. ECMAScript также определяет некоторые ключевые слова и литералы и устанавливает правила для автоматической вставки точек с запятой (ASI), чтобы обозначить конец инструкций (statements). Однако, рекомендуется всегда ставить точку с запятой в конце каждой инструкции вручную, чтобы избежать побочных эффектов. Чтобы получить более подробную информацию, прочитайте Lexical Grammar.

Объявления

В JavaScript существует три вида объявлений:

Объявляет переменную, инициализация переменной значением является необязательной.

Объявляет локальную переменную в области видимости блока, инициализация переменной значением является необязательной.

Объявляет именованную константу, доступную только для чтения.

Переменные

Вы можете использовать переменные как символические имена для значений в вашем приложении. Имена переменных называются identifiers и должны соответствовать определённым правилам.

Идентификатор в JavaScript должен начинаться с буквы, нижнего подчёркивания (_) или знака доллара ($); последующие символы могут также быть цифрами (0-9). Поскольку JavaScript чувствителен к регистру, буквы включают символы от «A» до «Z» (верхний регистр) и символы от «a» до «z» (нижний регистр).

Вы можете использовать в идентификаторах буквы ISO 8859-1 или Unicode, например, å или ü. Вы также можете использовать управляющие последовательности Unicode как символы в идентификаторах.

Некоторые примеры корректных имён: Number_hits , temp99 , _name .

Объявление переменных

Вы можете объявить переменную тремя способами:

Используя ключевое слово var . Например, var x = 42 . Данный синтаксис может быть использован для объявления как локальных, так и глобальных переменных.
Просто присвоить переменной значение. Например, x = 42 . Переменные, объявленные данным способом, являются глобальными. Такое объявление генерирует строгое предупреждение (strict mode). Не рекомендуется использовать данный способ.
Используя ключевое слово let . Например, let y = 13 . Данный синтаксис может быть использован для объявления локальной переменной в области видимости блока.

Присваивание значений

Переменная, объявленная через var или let без присвоения начального значения, имеет значение undefined .

При попытке доступа к необъявленной переменной или переменной до её объявления будет выброшено исключение ReferenceError :

var a; console.log("The value of a is " + a); //Значение переменной a undefined console.log("The value of b is " + b); //Uncaught ReferenceError: b не определена console.log("The value of c is " + c); //Значение переменной c undefined var c; console.log("The value of x is " + x); //Uncaught ReferenceError: x не определена let x;

Вы можете использовать undefined , чтобы определить, имеет ли переменная значение. В следующем примере переменной input не присвоено значение, и оператор if будет вычислен как true :

var input; if (input === undefined)  doThis(); > else  doThat(); >

Значение undefined ведёт себя как false , когда используется в логическом контексте. Например, следующий код выполняет функцию myFunction , т.к. элемент myArray не определён:

var myArray = []; if (!myArray[0])  myFunction(); >

Значение undefined конвертируется в NaN , когда используется в числовом контексте:

var a; a + 2; // NaN

Значение null ведёт себя как 0 в числовом контексте и как false в логическом контексте:

var n = null; console.log(n * 32); // В консоль выведется 0

Область видимости переменных

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

До ECMAScript 6 в JavaScript отсутствовала область видимости блока; переменная, объявленная внутри блока, является локальной для _функции _(или глобальной области видимости), внутри которой находится данный блок. Например, следующий код выведет значение 5, т.к. областью видимости переменной x является функция (или глобальный контекст), внутри которой объявлена переменная x , а не блок, которым в данном случае является оператор if :

if (true)  var x = 5; > console.log(x); // 5

Такое поведение меняется, если используется оператор let , введённый в ECMAScript 6:

if (true)  let y = 5; > console.log(y); // ReferenceError

Поднятие переменных

Другим необычным свойством переменных в JavaScript является то, что можно сослаться на переменную, которая объявляется позже, и не получить при этом исключения. Эта концепция известна как поднятие (hoisting) переменных; переменные в JavaScript поднимаются в самое начало функции или выражения. Однако, переменные, которые ещё не были инициализированы, возвратят значение undefined :

/* * Example 1 */ console.log(x === undefined); // true var x = 3; /* * Example 2 */ var myvar = "my value"; (function ()  console.log(myvar); // undefined var myvar = "local value"; >)();

Приведённые выше примеры будут интерпретироваться так же, как:

/* * Example 1 */ var x; console.log(x === undefined); // true x = 3; /* * Example 2 */ var myvar = "my value"; (function ()  var myvar; console.log(myvar); // undefined myvar = "local value"; >)();

Из-за поднятия переменных, все операторы var в функции следует размещать настолько близко к началу функции, насколько это возможно. Следование этому правилу улучшает ясность кода.

В ECMAScript 2015, let (const) не будет подниматься вверх блока. Однако, ссылки на переменную в блоке до объявления переменной вызовут ReferenceError . Переменная во «временной мёртвой зоне» в начале блока, до объявления.

function do_something()  console.log(foo); // ReferenceError let foo = 2; >

Поднятие функций

Для функций: только определения функций поднимаются наверх, но не функции, определённые через выражения.

/* Определение функции */ foo(); // "bar" function foo()  console.log("bar"); > /* Определение функции через выражение */ baz(); // TypeError: baz is not a function var baz = function ()  console.log("bar2"); >;

Глобальные переменные

Глобальные переменные на самом деле являются свойствами глобального объекта. На веб-страницах глобальным объектом является window , поэтому вы можете устанавливать глобальные переменные и обращаться к ним, используя синтаксис window.variable :

.foo = "bar";

Следовательно, вы можете обращаться к глобальным переменным, объявленным в одном объекте window или frame из другого объекта window или frame, указав имя window или frame. Например, если переменная phoneNumber объявлена в документе, то вы можете сослаться на эту переменную из iframe как parent.phoneNumber .

Константы

Вы можете создать именованную константу, доступную только для чтения, используя ключевое слово const . Синтаксис идентификатора константы является таким же, как и у идентификатора переменной: он должен начинаться с буквы, нижнего подчёркивания или знака $ и может содержать буквы, цифры или нижнее подчёркивание.

const PREFIX = "212";

Нельзя изменить значение константы через присваивание или повторное объявление во время выполнения скрипта. Значение должно быть указано при инициализации.

Правила, касающиеся области видимости, для констант являются такими же, как и для переменных, объявленных через let . Если ключевое слово const не указано, то идентификатор будет являться переменной.

Нельзя объявить константу с таким же именем, как у функции или переменной в одной области видимости. Следующие примеры выбросят исключение TypeError :

// Это вызовет ошибку function f() > const f = 5; // Это тоже вызовет ошибку function f()  const g = 5; var g; // какие-то выражения >

Однако, атрибуты объектов не защищены, так что следующее выражение выполнится без проблем

const MY_OBJECT =  key: "value" >; MY_OBJECT.key = "otherValue";

Структуры и типы данных

Типы данных

Последний стандарт ECMAScript определяет семь типов данных:

Шесть типов данных, которые являются примитивами:

Boolean. true и false .
null. Специальное ключевое слово, обозначающее нулевое или «пустое» значение. Поскольку JavaScript чувствителен к регистру, null не то же самое, что Null , NULL или любой другой вариант.
undefined. Свойство глобального объекта; переменная, не имеющая присвоенного значения, обладает типом undefined .
Number. 42 или 3.14159 .
String. «Howdy».
Symbol (ECMAScript 6)

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

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

JavaScript — это динамически типизированный язык. Это означает, что вам не нужно указывать тип данных переменной, когда вы её объявляете, типы данных преобразуются автоматически по мере необходимости во время выполнения скрипта. Так, например, вы можете определить переменную следующим образом:

var answer = 42;

А позже вы можете присвоить этой переменной строковое значение, например:

= "Thanks for all the fish. ";

Поскольку JavaScript является динамически типизированным, это присваивание не вызовет сообщения об ошибке.

В выражениях, включающих числовые и строковые значения с оператором + , JavaScript преобразует числовые значения в строковые. Например:

= "The answer is " + 42; // "The answer is 42" y = 42 + " is the answer"; // "42 is the answer"

В выражениях с другими операторами JavaScript не преобразует числовые значения в строковые. Например:

"37" - 7; // 30 "37" + 7; // "377"

Преобразование строк в числа

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

parseInt(numString, [radix])
parseFloat(numString)

parseInt преобразует строку в целочисленное значение. Хорошей практикой является всегда указывать основание системы счисления (параметр radix ).

Альтернативным способом для получения числа из строки является использование оператора «унарный плюс»:

"1.1" + "1.1"; // "1.11.1" (+"1.1") + (+"1.1"); // 2.2 // Обратите внимание на то, что скобки не являются обязательными и используются для ясности.

Литералы

Литералы используются для представления значений в JavaScript. Они являются фиксированными значениями, а не переменными. В данной секции рассматриваются следующие типы литералов:

Литерал массива
Логический литерал
Литерал целого числа
Литерал числа с плавающей точкой
Литерал объекта
RegExp литерал
Литерал строки

Литерал массива

Литерал массива — это список из нуля или более выражений, каждое из которых представляет элемент массива, заключённый в квадратные скобки ( [] ). Когда вы создаёте массив, используя литерал массива, он инициализируется с помощью переданных значений, которые будут являться его элементами, длина массива будет равна числу переданных аргументов.

В следующем примере создаётся массив coffees с тремя элементам и длиной, равной трём:

var coffees = ["French Roast", "Colombian", "Kona"];

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

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

Литералы массива также являются объектами Array . Чтобы получить более подробную информацию, прочитайте Array и упорядоченные наборы данных.

Лишние запятые в литералах array

Не обязательно указывать все элементы в литерале array. Если вы поставите две запятые подряд, то пропущенные элементы будут иметь значение undefined . Например:

var fish = ["Lion", , "Angel"]; // ["Lion", undefined, "Angel"]

У этого массива есть 2 элемента со значениям и один пустой ( fish[0] — «Lion», fish[1] — undefined , а fish[2] — «Angel»).

Если вы поставите запятую в конце списка элементов, то она будет проигнорирована. В следующем примере, длина массива равна 3. Нет myList[3] . Все другие запятые в списке говорят о новом элементе.

Примечание: Лишние запятые могут вызывать ошибки в старых версиях браузеров, поэтому лучше избегать их использования.

var myList = ["home", , "school", ]; // ["home", undefined, "school"]

В следующем примере длина массива равна четырём, элементы myList[0] и myList[2] имеют значение undefined :

var myList = [, "home", , "school"]; // [undefined, "home", undefined, "school"]

В следующем примере длина массива равна четырём, элементы myList[1] и myList[3] имеют значение undefined . Игнорируется только последняя запятая.

var myList = ["home", , "school", ,]; // ["home", undefined, "school", undefined]

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

Логические литералы

Логический (Boolean) тип имеет два литеральных значения: true и false .

Не путайте примитивные логические значения true и false со значениями true и false объекта Boolean. Объект Boolean является объектом-обёрткой над примитивом логического типа. Чтобы получить более подробную информацию, прочитайте Boolean .

Литерал целого числа

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

Десятичный целочисленный литерал состоит из последовательности цифр без ведущего нуля.
Ведущий ноль в целочисленном литерале указывает на то, что он записан в восьмеричной системе счисления. Восьмеричные целые числа состоят только из цифр 0-7.
Ведущие символы 0x (или 0X) указывают на то, что число шестнадцатеричное. Шестнадцатеричные целые числа могут состоять из цифр 0-9 и букв a-f и A-F.
Ведущие символы 0b (или 0B) указывают на то, что число двоичное. Двоичные числа могут включать в себя только цифры 0 и 1.

Несколько примеров целочисленных литералов:

0, 117 и -345 (десятичная система счисления) 015, 0001 и -077 (восьмеричная система счисления) 0x1123, 0x00111 и -0xF1A7 (шестнадцатеричная система счисления) 0b11, 0b0011 и -0b11 (двоичная система счисления)

Литерал числа с плавающей точкой

Числа с плавающей точкой могут состоять из следующих частей:

Десятичное целое число, которое может иметь знак (символ «+» или «-«, стоящий перед числом),
Десятичная точка («.»),
Дробная часть (другое десятичное число),
Экспонента.

Экспонента состоит из символа «e» или «E», за которым следует целое число, которое может иметь знак. Число с плавающей точкой должно состоять по крайней мере из одной цифры и либо десятичной точки, либо символа «e» (или «E»).

В более сжатой форме синтаксис выглядит следующим образом:

[(+|-)][digits][.digits][(E|e)[(+|-)]digits]

3.14 -3.1E+12 -.3333333333333333333 .1e-23

Литерал объекта

Литерал объекта — это список из нуля или более пар, состоящих из имён свойств и связанных с ними значений, заключённый в фигурные скобки ( <> ). Вам не следует использовать литерал объекта в начале выражения, т.к. это приведёт к ошибке или к поведению, которого вы не ожидаете, потому что символ »

В следующем примере свойству myCar объекта car присваивается строка «Saturn» , свойству getCar — результат вызова функции CarTypes(«Honda») , свойству special — значение переменной Sales :

var Sales = "Toyota"; function CarTypes(name)  if (name == "Honda")  return name; > else  return "Извините, мы не продаём " + name + "."; > > var car =  myCar: "Saturn", getCar: CarTypes("Honda"), special: Sales >; console.log(car.myCar); // Saturn console.log(car.getCar); // Honda console.log(car.special); // Toyota

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

var car =  manyCars:  a: "Saab", b: "Jeep" >, 7: "Mazda" >; console.log(car.manyCars.b); // Jeep console.log(car[7]); // Mazda

Именем свойства объекта может быть любая строка, в том числе пустая строка. Если имя свойства не является корректным JavaScript идентификатором, то оно должно быть заключено в кавычки. Для обращения к таким именам следует использовать квадратные скобки ( [] ), а не точку ( . ):

var unusualPropertyNames =  "": "An empty string", "!": "Bang!" > console.log(unusualPropertyNames.""); // SyntaxError: Unexpected string console.log(unusualPropertyNames[""]); // "An empty string" console.log(unusualPropertyNames.!); // SyntaxError: Unexpected token ! console.log(unusualPropertyNames["!"]); // "Bang!"

В ES2015 литералы объектов расширены до поддержки установки прототипа в конструкции короткой записи для foo: задание foo , определение методов, создание супер вызовов и вычисление имён свойств в выражениях. Вместе, они делают похожими объектные литералы и объявления классов, а также позволяют объектному дизайну получать выгоду одинаковых возможностей.

var obj =  // __proto__ __proto__: theProtoObj, // Короткая запись для ‘handler: handler’ handler, // Методы toString()  // Супер вызовы return "d " + super.toString(); >, // Динамическое вычисление имён свойств ["prop_" + (() => 42)()]: 42, >;

Обратите внимание на следующий пример:

var foo =  a: "alpha", 2: "two" >; console.log(foo.a); // alpha console.log(foo[2]); // two // console.log(foo.2); // SyntaxError: Unexpected number // console.log(foo[a]); // ReferenceError: a is not defined console.log(foo["a"]); // alpha console.log(foo["2"]); // two

RegExp литерал

Литерал regexp — шаблон между слешами. Следующий пример литерал regex:

var re = /ab+c/;

Строковый литерал

Строковый литерал — это ноль или более символов, заключённых в двойные ( » ) или одинарные ( ‘ ) кавычки. Строка должна быть ограничена кавычками одного типа, т.е. либо обе одинарные, либо обе двойные. Например:

"foo" 'bar' "1234" "one line \n another line" "John's cat"

Вы можете вызвать любой из методов объекта String для строкового литерала: JavaScript автоматически преобразует строковой литерал во временный объект String , вызовет метод, а затем уничтожит временный объект String . Вы также можете использовать свойство String.length со строковым литералом:

.log("John's cat".length); // Число символов в строке, включая пробел. // В данном случае длина строки равна 10.

В ES2015 также доступны шаблоны строк. Шаблоны строк представляют собой синтаксический сахар для конструирования строк. Это похоже на возможности интерполяции строк в Perl, Python и других. Дополнительно, может быть добавлен тег, позволяющий настраивать конструирование строк, избегая атак внедрения и построения структур данных высокого уровня из содержимого строки.

// Простое создание строки через литерал string `In JavaScript '\n' is a line-feed.`; // Мультистроковые строки `In JavaScript this is not legal.`; // Интерполяция строк var name = "Бобби", time = "сегодня"; `Привет $name>, как ты $time>?`; // Строим префикс HTTP запроса, используемый для интерпретации замен и конструирования POST`http://foo.org/bar?a=$a>&b=$b> Content-Type: application/json X-Credentials: $credentials> < "foo": $foo>, "bar": $bar>>`(myOnReadyStateChangeHandler);

Вам следует использовать строковые литералы до тех пор, пока вам специально не понадобится объект String . Чтобы получить более подробную информацию об объекте String , прочитайте String .

Использование специальных символов в строках

Кроме обычных символов вы также можете включать специальные символы в строки.

"one line \n another line";

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

Символ	Значение
\b	Возврат (Backspace)
\f	Перевод или прогон страницы (Form feed)
\n	Перевод строки (New line)
\r	Возврат каретки (Carriage return)
\t	Табуляция (Tab)
\v	Вертикальная табуляция (Vertical tab)
\’	Апостроф или одинарная кавычка
\»	Двойная кавычка
\\	Обратная косая черта (Backslash)
\XXX	Символ в кодировке Latin-1, представленный тремя восьмеричными числами XXX от 0 до 377. Например, \251 (символ ©).
\xXX	Символ в кодировке Latin-1, представленный двумя шестнадцатеричными числами XX от 00 до FF. Например, \xA9 (символ ©).
\uXXXX	Символ в Unicode, представленный четырьмя шестнадцатеричными числами XXXX. Например, \u00A9 (символ ©).
\u	Символ в UTF-32BE. Например, \u обозначает то же, что обычная запись \uD87E\uDC04.

Экранирующие символы

Для символов, не перечисленных в вышеприведённой таблице, предваряющая обратная косая черта игнорируется. Такое использование не является рекомендованным (deprecated) и вам следует избегать его.

Вы можете вставить кавычку в строку, если поставите перед ней обратную косую черту. Это называется экранированием кавычек. Например:

var quote = "He read \"The Cremation of Sam McGee\" by R.W. Service."; console.log(quote); // He read "The Cremation of Sam McGee" by R.W. Service.

Чтобы включить обратную косую черту в строку, перед ней нужно поставить ещё одну обратную косую черту. Например:

var home = "c:\\temp"; // c:\temp

Вы также можете экранировать перевод строки. Обратная косая черта и перевод строки будут удалены из содержимого строки. Например:

var str = "this string \ is broken \ across multiple\ lines."; console.log(str); // this string is broken across multiplelines.

Хотя JavaScript не поддерживает синтаксис «heredoc» (форматированный текст в одной строковой переменной), но вы можете эмулировать его, добавив перевод строки и обратную косую черту в конец каждой строки:

var poem = "Roses are red,\n\ Violets are blue.\n\ I'm schizophrenic,\n\ And so am I.";

Дополнительная информация

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

Порядок выполнения и обработка ошибок
Циклы и итерация
Функции
Выражения и операторы

В следующей главе рассматриваются управляющие конструкции и обработка ошибок.

« Предыдущая статья
Следующая статья »

Found a content problem with this page?

Edit the page on GitHub.
Report the content issue.
View the source on GitHub.

This page was last modified on 10 авг. 2023 г. by MDN contributors.

Your blueprint for a better internet.

Переменные

JavaScript-приложению обычно нужно работать с информацией. Например:

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

Переменные используются для хранения этой информации.

Переменная

Переменная – это «именованное хранилище» для данных. Мы можем использовать переменные для хранения товаров, посетителей и других данных.

Для создания переменной в JavaScript используйте ключевое слово let .

Приведённая ниже инструкция создаёт (другими словами, объявляет) переменную с именем «message»:

let message;

Теперь можно поместить в неё данные (другими словами, определить переменную), используя оператор присваивания = :

let message; message = 'Hello'; // сохранить строку 'Hello' в переменной с именем message

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

let message; message = 'Hello!'; alert(message); // показывает содержимое переменной

Для краткости можно совместить объявление переменной и запись данных в одну строку:

let message = 'Hello!'; // определяем переменную и присваиваем ей значение alert(message); // Hello!

Мы также можем объявить несколько переменных в одной строке:

let user = 'John', age = 25, message = 'Hello';

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

Многострочный вариант немного длиннее, но легче для чтения:

let user = 'John'; let age = 25; let message = 'Hello';

Некоторые люди также определяют несколько переменных в таком вот многострочном стиле:

let user = 'John', age = 25, message = 'Hello';

…Или даже с запятой в начале строки:

let user = 'John' , age = 25 , message = 'Hello';

В принципе, все эти варианты работают одинаково. Так что это вопрос личного вкуса и эстетики.

var вместо let

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

var message = 'Hello';

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

Есть тонкие различия между let и var , но они пока не имеют для нас значения. Мы подробно рассмотрим их в главе Устаревшее ключевое слово «var».

Аналогия из жизни

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

Например, переменную message можно представить как коробку с названием «message» и значением «Hello!» внутри:

Мы можем положить любое значение в коробку.

Мы также можем изменить его столько раз, сколько захотим:

let message; message = 'Hello!'; message = 'World!'; // значение изменено alert(message);

При изменении значения старые данные удаляются из переменной:

Мы также можем объявить две переменные и скопировать данные из одной в другую.

let hello = 'Hello world!'; let message; // копируем значение 'Hello world' из переменной hello в переменную message message = hello; // теперь две переменные содержат одинаковые данные alert(hello); // Hello world! alert(message); // Hello world!

Повторное объявление вызывает ошибку

Переменная может быть объявлена только один раз.

Повторное объявление той же переменной является ошибкой:

let message = "Это"; // повторение ключевого слова 'let' приводит к ошибке let message = "Другое"; // SyntaxError: 'message' has already been declared

Поэтому следует объявлять переменную только один раз и затем использовать её уже без let .

Функциональные языки программирования

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

В таких языках однажды сохранённое «в коробку» значение остаётся там навсегда. Если нам нужно сохранить что-то другое, язык заставляет нас создать новую коробку (объявить новую переменную). Мы не можем использовать старую переменную.

Хотя на первый взгляд это может показаться немного странным, эти языки вполне подходят для серьёзной разработки. Более того, есть такая область, как параллельные вычисления, где это ограничение даёт определённые преимущества. Изучение такого языка (даже если вы не планируете использовать его в ближайшее время) рекомендуется для расширения кругозора.

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

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

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

Примеры допустимых имён:

let userName; let test123;

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

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

Эти имена являются допустимыми:

let $ = 1; // объявили переменную с именем "$" let _ = 2; // а теперь переменную с именем "_" alert($ + _); // 3

Примеры неправильных имён переменных:

let 1a; // не может начинаться с цифры let my-name; // дефис '-' не разрешён в имени

Регистр имеет значение

Переменные с именами apple и APPLE – это две разные переменные.

Нелатинские буквы разрешены, но не рекомендуются

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

let имя = '. '; let 我 = '. ';

Технически здесь нет ошибки, такие имена разрешены, но есть международная традиция использовать английский язык в именах переменных. Даже если мы пишем небольшой скрипт, у него может быть долгая жизнь впереди. Людям из других стран, возможно, придётся прочесть его не один раз.

Зарезервированные имена

Существует список зарезервированных слов, которые нельзя использовать в качестве имён переменных, потому что они используются самим языком.

Например: let , class , return и function зарезервированы.

Приведённый ниже код даёт синтаксическую ошибку:

let let = 5; // нельзя назвать переменную "let", ошибка! let return = 5; // также нельзя назвать переменную "return", ошибка!

Создание переменной без использования use strict

Обычно нам нужно определить переменную перед её использованием. Но в старые времена было технически возможно создать переменную простым присвоением значения без использования let . Это все ещё работает, если мы не включаем use strict в наших файлах, чтобы обеспечить совместимость со старыми скриптами.

// заметка: "use strict" в этом примере не используется num = 5; // если переменная "num" раньше не существовала, она создаётся alert(num); // 5

Это плохая практика, которая приводит к ошибке в строгом режиме:

"use strict"; num = 5; // ошибка: num is not defined

Константы

Чтобы объявить константную, то есть, неизменяемую переменную, используйте const вместо let :

const myBirthday = '18.04.1982';

Переменные, объявленные с помощью const , называются «константами». Их нельзя изменить. Попытка сделать это приведёт к ошибке:

const myBirthday = '18.04.1982'; myBirthday = '01.01.2001'; // ошибка, константу нельзя перезаписать!

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

Константы в верхнем регистре

Широко распространена практика использования констант в качестве псевдонимов для трудно запоминаемых значений, которые известны до начала исполнения скрипта.

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

Например, сделаем константы для различных цветов в «шестнадцатеричном формате»:

const COLOR_RED = "#F00"; const COLOR_GREEN = "#0F0"; const COLOR_BLUE = "#00F"; const COLOR_ORANGE = "#FF7F00"; // . когда нам нужно выбрать цвет let color = COLOR_ORANGE; alert(color); // #FF7F00

COLOR_ORANGE гораздо легче запомнить, чем «#FF7F00» .
Гораздо легче допустить ошибку при вводе «#FF7F00» , чем при вводе COLOR_ORANGE .
При чтении кода COLOR_ORANGE намного понятнее, чем #FF7F00 .

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

Название «константа» просто означает, что значение переменной никогда не меняется. Но есть константы, которые известны до выполнения (например, шестнадцатеричное значение для красного цвета), а есть константы, которые вычисляются во время выполнения сценария, но не изменяются после их первоначального назначения.

const pageLoadTime = /* время, потраченное на загрузку веб-страницы */;

Значение pageLoadTime неизвестно до загрузки страницы, поэтому её имя записано обычными, а не прописными буквами. Но это всё ещё константа, потому что она не изменяется после назначения.

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

Придумывайте правильные имена

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

Название переменной должно иметь ясный и понятный смысл, говорить о том, какие данные в ней хранятся.

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

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

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

Несколько хороших правил:

Используйте легко читаемые имена, такие как userName или shoppingCart .
Избегайте использования аббревиатур или коротких имён, таких как a , b , c , за исключением тех случаев, когда вы точно знаете, что так нужно.
Делайте имена максимально описательными и лаконичными. Примеры плохих имён: data и value . Такие имена ничего не говорят. Их можно использовать только в том случае, если из контекста кода очевидно, какие данные хранит переменная.
Договоритесь с вашей командой об используемых терминах. Если посетитель сайта называется «user», тогда мы должны называть связанные с ним переменные currentUser или newUser , а не, к примеру, currentVisitor или newManInTown .

Звучит просто? Действительно, это так, но на практике для создания описательных и кратких имён переменных зачастую требуется подумать. Действуйте.

Повторно использовать или создавать новую переменную?

И последняя заметка. Есть ленивые программисты, которые вместо объявления новых переменных повторно используют существующие.

В результате их переменные похожи на коробки, в которые люди бросают разные предметы, не меняя на них этикетки. Что сейчас находится внутри коробки? Кто знает? Нам необходимо подойти поближе и проверить.

Такие программисты немного экономят на объявлении переменных, но теряют в десять раз больше при отладке.

Дополнительная переменная – это добро, а не зло.

Современные JavaScript-минификаторы и браузеры оптимизируют код достаточно хорошо, поэтому он не создаёт проблем с производительностью. Использование разных переменных для разных значений может даже помочь движку оптимизировать ваш код.

Итого

Мы можем объявить переменные для хранения данных с помощью ключевых слов var , let или const .

let – это современный способ объявления.
var – это устаревший способ объявления. Обычно мы вообще не используем его, но мы рассмотрим тонкие отличия от let в главе Устаревшее ключевое слово «var» на случай, если это всё-таки вам понадобится.
const – похоже на let , но значение переменной не может изменяться.

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

Задачи

Работа с переменными

важность: 2

Объявите две переменные: admin и name .
Запишите строку «Джон» в переменную name .
Скопируйте значение из переменной name в admin .
Выведите на экран значение admin , используя функцию alert (должна показать «Джон»).

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

let admin, name; // можно объявить две переменные через запятую name = "Джон"; admin = name; alert( admin ); // "Джон"

JavaScript Переменные

Ключевые слова let и const объясняются в следующих главах.

Переменные

JavaScript переменные — это контейнеры для хранения значений данных.

В этом примере x , y , и z переменные, объявляются с ключевым словом var :

Пример

var x = 5;
var y = 6;
var z = x + y;

Из приведенного выше примера результат будет такой:

Переменная x сохранит значение 5
Переменная y сохранит значение 6
Переменная z сохранит значение 11

Программирование как в алгебре

В этом примере price1 , price2 и total , тоже являются переменными:

Пример

var price1 = 5;
var price2 = 6;
var total = price1 + price2;

В программирование, как и в алгебре, мы используем переменные (например, price1) для хранения значений.

В программирование, как и в алгебре, мы используем переменные в выражениях (total = price1 + price2).

Из приведенного выше примера вы можете рассчитать, что общая сумма будет 11.

JavaScript переменные — это контейнеры для хранения значений данных.

JavaScript Идентификаторы

Все JavaScript переменные должны быть определены с уникальным именами.

Уникальные имена называются идентификаторами.

К примеру, идентификаторы могут быть короткими именами (например, x и y) или более описательными именами (age, sum, totalVolume).

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

Имена переменных могут содержать буквы, цифры, символы подчеркивания и знаки доллара
Имена переменных должны начинаться с буквы
Имена переменных, также могут начинаться с $ и _ (но мы не будем использовать в этом руководстве)
Имена переменных чувствительны к регистру (y и Y — разные переменные)
Зарезервированные слова (например, ключевые слова JavaScript) нельзя использовать в качестве переменных имен

JavaScript идентификаторы чувствительны к регистру.

JavaScript Оператор присваивания

В JavaScript знак равенства ( = ) является оператором «присваивания», а не оператором «равно».

Отличие от алгебры. Следующий пример не имеет смысла в алгебре:

Однако в JavaScript смысл таков: он присваивает значение x + 5 к переменной x.

(Он вычисляет значение x + 5 и помещает результат в x. Значение x увеличивается на 5.)

Оператор «равно» написан, как == в JavaScript.

JavaScript Типы данных

JavaScript переменные могут содержать числа, такие как 100, и текстовые значения, например «Щипунов Андрей».

В программировании, текстовые значения называются текстовыми строками.

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

Строки заключаются в двойные или одинарные кавычки. Числа пишутся без кавычек.

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

Пример

var pi = 3.14;
var person = «Щипунов Андрей»;
var answer = ‘Да это я!’;

JavaScript Объявление (создание переменной)

Создание переменной в JavaScript называется «объявлением» переменной.

К примеру, вы объявляете переменную JavaScript с ключевым словом var :

var carName;

После объявления, переменная не имеет значения (технически имеет значение undefined ).

Чтобы присвоить значение переменной, используйте знак равенства:

carName = «Вольво»;

Вы также, можете присвоить значение к переменной при объявлении:

var carName = «Вольво»;

В приведенном ниже примере создаем переменную с именем carName и присваиваеваете к ней значение «Вольво».

Затем «выводим» значение внутри параграфа HTML с :

Пример

var carName = «Вольво»;
document.getElementById(«demo»).innerHTML = carName;

Хорошая практика программирования — объявлять все переменные в начале скрипта.

Подтверждение

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

Начните с var и разделите переменные запятыми:

var person = «Щипунов Андрей», carName = «Вольво», price = 200;

Объявление может занимать несколько строк:

var person = «Щипунов Андрей»,
carName = «Вольво»,
price = 200;

Значение = undefined

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

Переменная, которая объявленная без значения, будет иметь значение undefined .

Переменная carName, будет иметь значение undefined после выполнения этого оператора:

Пример

var carName;

JavaScript Повторное объявление переменных

Если вы повторно объявите переменную JavaScript, она не потеряет своего значения.

После carName выполнения этих операторов переменная по-прежнему будет иметь значение «Вольво»:

Пример

var carName = «Вольво»;
var carName;

JavaScript Арифметика

Как и в случае с алгеброй, вы можете выполнять арифметические операции с переменными JavaScript, используя такие операторы, как = и + :

Пример

var x = 5 + 2 + 3;

Вы также, можете добавить строки, но они будут объединены:

Выражения, переменные и типы данных в JavaScript

В этой статье мы напишем первую простую программу на JavaScript, разберём из чего она состоит и как работает. После чего изучим выражения, переменные, ключевые слова для их объявления, типы данных, что такое динамическая типизация и что делает оператор typeof .

Первая программа

Изучение JavaScript начнём с создания простой программы, состоящей из одной строчки, которая будет выводить в консоль браузера сообщение «Hello, World!»:

JavaScript

console.log('Hello, World!');

Полный текст HTML документа:

Для его создания можно воспользоваться любым текстовым редактором, например, Visual Studio Code.

Для этого откройте текстовый редактор, вставьте в него этот код и сохраните его в файл с расширением html (например, «index.html»).

После этого откройте его в браузере, например, Google Chrome. Далее перейдите в «Инструменты разработчика», а в них на вкладку «Console»:

Простая программа на JavaScript, выводящая в консоль браузера сообщение Hello, World!

Здесь мы увидим вывод нашего сообщения «Hello, World!».

Программа на JavaScript находится между открывающим и закрывающим тегом script . Как уже было отмечено выше эта программа состоит всего из одной строчки кода:

JavaScript

console.log('Hello, World!');

Этот код выполняет очень простое действие: выводит сообщение, указанное в круглых скобках в консоль .

Чтобы понять как эта строчка работает, рассмотрим из чего она состоит:

console – это объект . Объект в JavaScript – это набор свойств. Каждое свойство состоит из имени и значения («имя: значение»), имена также ещё называют ключами.
log – это одно из свойств объекта console , а точнее его метод . Т.к. в качестве его значения выступает функция .
. (точка) – это оператор, который мы используем для доступа к свойствам и методам объекта. В данном случае мы с помощью точки получаем доступ к методу log объекта console .
() (скобки) – это часть синтаксиса JavaScript, с помощью которого в данном случае мы вызываем функцию log , которая является методом объекта console .
‘Hello, World!’ – аргумент типа String (строка), т.е. значение, которое мы передаём в метод log() .

Таким образом, эта строчка console.log(‘Hello, World!’); вызывает метод log() и передаёт ему в качестве аргумента значение ‘Hello, World!’ . log() – это метод объекта console и поэтому чтобы к нему обратиться мы используем точку.

В этом примере мы познакомились с одними из ключевых понятий JavaScript: объектом и функцией. Здесь объектом является console , а функцией — метод log() .

В заключении отметим, что строка console.log(‘Hello, World!’) является выражением.

Выражения

Выражение – это тоже одно из ключевых понятий в JavaScript. Оно представляет собой некоторый кусок кода, который всегда возвращает значение.

Если вернутся к предыдущему примеру, то console.log(‘Hello, World!’) как мы уже отметили выше является выражением, т.к. возвращает значение:

JavaScript

console.log('Hello, World!');

В качестве значения данное выражение возвращает undefined . В этом легко убедиться если его обернуть в ещё одну конструкцию console.log() :

JavaScript

console.log(console.log('Hello, World!')); // undefined

‘Alexander’ – это выражение, которое представляет собой строку; результатом этого выражения будет эта же строка;
7 + 3 – это выражение, в котором используется оператор + ; результатом этого выражения будет число 10 ;
‘Alexander’ + ‘ ‘ + ‘Maltsev’ – результатом этого выражения будет новая строка ‘Alexander Maltsev’ ;
name = ‘Tim’ – это выражение, в котором используется оператор присваивания; здесь переменной name присваивается значение ‘Tim’ ; результатом этого выражения будет строка ‘Tim’ , т.е. то значение, которое мы присваиваем переменной;
index++ – здесь используется оператор ++ , который увеличивает значение переменной на 1; результатом этого выражения будет значение переменной index , увеличенное на 1;
2 > 3 || 2 > 1 – это выражение, в котором используются несколько операторов; оно возвращает значение true ;
sum(3, 5) – вызов функции также является выражением, т.к. функция всегда возвращает какое-либо значение.

Некоторые примеры этих выражений имеют side effects (побочные действия). Т.е. они не только возвращают значение, но выполняют также некоторые дополнительные действия.

Например, выражение name = ‘Tim’ не только возвращает значение ‘Tim’ , но также выполняет присвоение переменной name значения ‘Tim’ .

Если взять выражение index++ , то оно тоже кроме возвращения значения ещё увеличивает значение переменной index на единицу.

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

Переменные

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

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

Переменная в JavaScript, которую для простоты понимания, рассматриваем как коробку

В дальнейшем мы можем обратиться к этому значению, в данном случае по имени num и выполнить с ним какие-либо действия. Затем мы можем поместить в переменную другое значение. Но в процессе выполнения программы переменная в определённый момент времени всегда имеет какое-то одно определённое значение.

Именование переменных

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

JavaScript

// объявление двух переменных: phone и message let phone, message;

Регистр букв в имени переменной имеет значение. Т.е., например, phone и Phone – это две разные переменные.

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

PascalCase – для именования типов и классов;
SELECTOR_ITEM – для именования констант (значения которых известно до запуска программы и не меняются на протяжении её выполнения);
camelCase – во всех остальных случаях.

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

JavaScript

class SimpleSlider { . };

Именование констант (например, SELECTOR_ITEM ) осуществляется прописными буквами и нижнего подчеркивания для разделения слов.

JavaScript

const SELECTOR_ITEM = '.slider';

camelCase – тоже самое что PascalCase за исключением того, что первая буква пишется в нижнем регистре.

JavaScript

let elBody = document.body;

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

Объявление переменных

В JavaScript доступно 3 ключевых слова, с помощью которых можно объявить переменные: let , const и var .

Ключевые слова let и const появились в языке с приходом ECMAScript 6, который вышел в 2015 году. var присутствовало в языке JavaScript с самого начала и до ECMAScript 6 использовалось только оно.

В настоящее время не рекомендуется использовать ключевое слово var , а только let и const .

Пример объявление переменной с названием email :

JavaScript

let email;

Перед названием переменной расположено ключевое слово let . Это слово дает инструкцию интерпретатору JavaScript создать новую переменную с именем email .

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

JavaScript

let email = 'no-reply@astr.org';

Присвоим переменной, объявленной до этого новое значение:

JavaScript

email = 'support@astr.org';

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

JavaScript

// выведем в консоль браузера значение переменной email console.log(email);

Переменная, которая объявлена без инициализации имеет по умолчанию значение undefined .

JavaScript

let phone; console.log(phone); // undefined

С помощью одного ключевого слова можно объявить сразу несколько переменных:

JavaScript

let price = 78.55, quantity = 10, message;

Отделение друг от друга осуществляется посредством запятой.

Отличие let от const

Основное отличие let от const заключаются в том, что значения переменным, объявленных с помощью ключевого слова let , можно переприсваивать, т.е. задавать им новые значения.

JavaScript

let price; // присвоим переменной price новое значение price = 76.10;

Если вы используете const , то необходимо при объявлении переменной сразу же присвоить ей значение:

JavaScript

const COLOR_RED = '#ff0000';

Если это не сделать, то получите ошибку:

JavaScript

const COLOR_RED; // Uncaught SyntaxError: Missing initializer in const declaration COLOR_RED = '#ff0000';

При попытке присвоить новое значение, вы также получите ошибку:

JavaScript

const COLOR_RED = '#ff0000'; COLOR_RED = '#f44336'; // Uncaught TypeError: Assignment to constant variable.

Таким образом, переменной, объявленной с помощью const нельзя присваивать новые значения. Это основное отличие let от const .

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

Также необходимо отметить, что если вы попытаетесь получить доступ к переменной, которая ещё не объявлена, то получите ошибку:

JavaScript

console.log(price); // Uncaught ReferenceError: Cannot access 'price' before initialization let price;

Кроме этого, получите ошибку, если попытаетесь объявить переменную ещё один раз в её области видимости:

JavaScript

let price; console.log(price); let price = 76.10; // Uncaught SyntaxError: Identifier 'price' has already been declared

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

JavaScript

// присвоим переменной массив (массив в JavaScript – это объект) const colors = ['#ff0000', '#00ff00', '#00ff00']; // присвоить новое значение переменной нельзя colors = []; // Uncaught TypeError: Assignment to constant variable.

Изменить объект, ссылка на который содержится в переменной, объявленной с помощью const можно:

JavaScript

// присвоим переменной массив (массив в JavaScript – это объект) const colors = ['#ff0000', '#00ff00', '#00ff00']; // добавим в массив новое значение colors.push('#4caf50'); // выведем значение COLORS в консоль console.log(colors); // ["#ff0000", "#00ff00", "#00ff00", "#4caf50"]

Ключевое слово var

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

Отличия var от let и const :

1. var в отличие от let и const имеет функциональную область видимости, т.е. если её объявить внутри функции, то она будет видна во всем коде этой функции. При этом видимость let и const ограничена блоком, т.е. они видны только в пределах фигурных скобок { . } .

JavaScript

{ var myAge = 36; let myName = 'John'; } console.log(myAge); // 36 console.log(myName); // Uncaught ReferenceError: myName is not defined

2. Переменные, объявленные с помощью var поднимаются к началу текущего контекста. Называется это hoisting. К такой переменной можно обратиться до её объявления:

JavaScript

console.log(myAge); // undefined var myAge = 36; console.log(myAge); // 36

Кроме этого, мы даже можем присвоить значение переменной до её объявления:

JavaScript

myAge = 27; console.log(myAge); // 27 var myAge = 36; console.log(myAge); // 36

В случае с let или const такое не получится, т.к. её использовать можно только после объявления.

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

JavaScript

// создадим переменную price со значением без использования var price = 250; console.log(price); // 250

Создавать переменные без var не рекомендуется.

В строгом режиме мы получим ошибку:

JavaScript

// создадим переменную price со значением без использования var price = 250; // Uncaught ReferenceError: price is not defined console.log(price);

Типы данных

Значение в JavaScript имеют определённый тип. Когда переменной мы присваиваем значение, она соответственно тоже принимает этот тип.

Все типы данных в JavaScript можно разделить на примитивные и ссылочный.

В JavaScript выделяют 7 примитивных типов:

number (обычные числа);
bigint (большие целые числа);
string (строки);
boolean (логический) – имеет всего два значения: true и false ;
null – имеет одно значения: null ;
undefined – имеет одно значения: undefined ;
symbol (символ) – для создания уникальных значений;

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

JavaScript

let coordX = 77; let coordY = coordX; coordX = 55; console.log(coordX); // 55 console.log(coordY); // 77

В этом примере мы присвоили переменной coordY значение, находящееся в coordX . coordY будет после этого непосредственно содержать это значение в памяти.

Если мы переопределим значение переменной coordX , то значение coordY не изменится. Потому что значения примитивных типов хранятся непосредственно в переменных. Т.е. переменная coordY в таком случае получит собственную копию этого значения.

Ссылочный тип в JavaScript только один – это object (объект). Объект – это одно из ключевых понятий JavaScript. Т.к. в этом языке всё практически является объектами. Функция, массив, дата и т.д. – это объекты. Даже примитивные типы данных ведут себя как объекты, хотя ими не являются.

1. Object (объект)

Объект – это набор свойств «имя: значение». Имена часто также называют ключами.

Пример объекта записанного с помощью литерального синтаксиса, т.е. фигурных скобок:

JavaScript

const person = { firstName: 'Alexander', lastName: 'Maltsev', age: 37, pets: { dog: 'husky', cat: 'chartreux', fish: 'neon tetra' }, getFullName: function () { return `${this.firstName} ${this.lastName}` } }

В этом примере свойства firstName , lastName и age содержат значения примитивных типов данных. Значение свойства pets – объект. Такие объекты называются вложенными. У него содержатся свои свойства с соответствующими значениями.

Свойство getFullName содержит в качестве значения функцию. Такие свойства в JavaScript называются методами.

Когда мы присваиваем такой объект переменной, в ней будет храниться только ссылка (например, 0xD30F ) на этот объект. А сам объект будет хранится в области памяти на которую указывает эта ссылка.

Если некоторой переменной присвоить значение переменой person , то она будет тоже содержать ссылку на этот объект:

JavaScript

const myPerson = person;

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

Если добавим новое свойство в объект с помощью переменной myPerson , то мы увидим изменение в этом объекте и посредством переменной person , т.к. они указывают на один и тот же объект в памяти:

JavaScript

// добавим в объект новое свойство myPerson.hobbies = ['ski', 'books', 'fitness']; // выведем в консоль его значение с помощью переменной person console.log(person.hobbies); // ['ski', 'books', 'fitness']

Для обращения к свойству hobbies в этом примере мы использовали точку. Кроме точечной записи (dot notation), вы можете также работать со свойствами объектами используя квадратные скобки:

JavaScript

console.log(person['hobbies']); // ['ski', 'books', 'fitness']

2. Number (число)

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

JavaScript

let int = 5; // целое число let float = 5.98; // число с плавающей точкой

Формат представления чисел в JavaScript осуществляется в соответствии со стандартом IEEE 754-2008.

Целые числа в JavaScript можно задавать не только в десятичной системе счисления, но и в восьмеричной (0) или шестнадцатеричной системе счисления (0x) с использованием префиксов, указанных в круглых скобках:

JavaScript

let int = 010; // 8 int = 055; // 45 int = 0xFF; //255 int = 0xB8; // 184

Записывать числа также можно в экспоненциальной форме :

JavaScript

let num = 2e3; // экспоненциальная запись числа 2*10^3 (2000) num = 2e-3; // экспоненциальная запись числа 2*10^-3 (0,002) num = 3.2e3; // 3200 num = 1.5e-2; // 0.015

Числовой тип данных кроме чисел содержит ещё специальные числовые значения :

Infinity (положительная бесконечность);
-Infinity (отрицательная бесконечность);
NaN (Not a Number – не число).

Специальное значения Infinity означает очень большое положительное число, т.е. число, которое не может быть представлено в JavaScript по причине того, что оно слишком велико.

Специальные значения -Infinity означает, наоборот, очень большое отрицательное число, т.е. число, которое не может быть представлено JavaScript по причине того, что оно тоже слишком велико.

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

JavaScript

5/0; // Infinity -5/0; // -Infinity Math.pow(10,399); // Infinity (10₃₉₉) Math.pow(10,399); // -Infinity (-10₃₉₉)

Значение NaN возвращается в результате выполнения математических операций, которые JavaScript не может вычислить.

JavaScript

5 - 'Hi'; // NaN (от числа 5 отнять строку) 1000 / '20px'; // NaN (число поделить на строку) true * '1rem'; // NaN (логическое значение true умножить на строку)

При этом очень интересным является то, что значение NaN в JavaScript не равно ничему включая себя.

JavaScript

NaN == NaN; // false NaN === NaN; //false

3. BigInt (большое целое число)

BigInt – это числовой тип, который предоставляет возможность работать с большими целыми числами. Появился этот тип в спецификации ECMAScript 2020 (11 редакции).

Примитив bigint создается путём добавления n в конец числа:

JavaScript

const bigint = 8950422584340004n; console.log(bigint); // 8950422584340004n

4. String (строка)

String (строка) – это тип данных, который используется в JavaScript для представления текста.

Строка JavaScript может состоять из 0 или большего количества символов.

В качестве формата строки в JavaScript всегда используется кодировка Unicode.

Создание строки (литерала строки) выполняется посредством заключения текста в одинарные или двойные кавычки .

JavaScript

let str1 = 'ECMAScript'; let str2 = "JavaScript";

В JavaScript нет разницы между одинарными и двойными кавычками.

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

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

JavaScript

let str1 = '"ECMAScript"'; // без экранирования (с использованием одинарных кавычек) let str2 = ""ECMAScript""; // с экранированием

Строка в JavaScript может содержать специальные символы. Например, \n (перевод строки), \t (табуляция), \r (возврат каретки) и др.

JavaScript

 console.log('Это предложение. А это тоже предложение, но оно будет выведено на новой строке.');

Со строками можно производить операцию сложения (объединения) или, другими словами, конкатенацию. Для этого используется оператор + . Смысл данной операции заключается в присоединении второй строки к концу первой.

JavaScript

console.log('Я люблю ' + 'JavaScript'); // Я люблю JavaScript

5. Boolean (логический тип данных)

Boolean – примитивный тип данных, который имеет всего два значения: true (истина) и false (ложь).

JavaScript

let isMoving = true; let hasTransformed = false;

6. Тип null

null – тип данных, который имеет одно значение: null .

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

JavaScript

let direction = null;

7. Тип undefined

undefined — тип данных, который имеет одно значение: undefined . Такое значение подразумевает, что значение у той или иной переменной нет, т.е. оно не определено.

Такое значение содержит объявленная переменная, которой ещё не присвоено значение.

JavaScript

let num; console.log(num); // undefined

Значение undefined также возвращается при доступе к свойству объекта, которого у него нет:

JavaScript

const objA = { x: 5, y: 2 }; console.log(objA.z); // undefined

Также функция которая явно не возвращает значение:

JavaScript

function myFunc(str) { console.log(str); } const result = myFunc('JavaScript!'); console.log(result); // undefined

Аналогично будет использование оператора return без указания значения:

JavaScript

function myFunc() { return; console.log(str); } const result = myFunc(); console.log(result); /// undefined

Разница между null и undefined заключается в том, что значение null мы присваиваем переменной сами.

8. Symbol (символ)

Symbol (символ) предназначен для создания уникальных идентификаторов. Появился этот тип данных в ECMAScript 2015 (6 редакции). Создание символа выполняется с помощью функции Symbol() :

JavaScript

const >Эта функция всегда возвращает уникальное значение символа. В круглых скобках при необходимости можно указать описание символа, которое также называется его именем. В этом примере в качестве него задана строка 'id' .

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

Динамическая типизация

JavaScript является языком с динамической типизацией. Это означает, что при объявлении переменной ей не нужно указывать тип данных, который она может принимать. Вы должны просто задекларировать переменную с помощью ключевого слова let или const .

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

Например, присвоим одной и той же переменной значения разных типов:

JavaScript

let output = 'успех'; // строка output = 28; // число output = true; // логический тип

Динамическая типизация имеет преимущества, так и недостатки:

JavaScript

// объявим функцию function sum(a, b) { console.log(a + b); } // вызовем функцию sum(2, 3); // 5 // присвоим переменной sum новое значение sum = 4; // вызовем функцию ещё раз sum(3, 7); // Uncaught TypeError: sum is not a function

В этом примере мы объявили функцию с помощью ключевого слова function . sum — это название функции. Когда мы первый раз вызывали функцию, переменная sum содержала её. После этого мы присвоили переменной число 4 . Теперь когда попытаемся вызвать функцию ещё раз, мы получим ошибку. Т.к. переменная sum на данном этапе содержит просто число.

Чтобы таких ошибок было меньше в коде, рекомендуется где это возможно использовать ключевое слово const :

JavaScript

// присвоим переменной стрелочную функцию const sum = (a, b) => { console.log(a + b); } // вызовем функцию sum(2, 3); // 5 // присвоим переменной sum новое значение sum = 4; // Uncaught TypeError: Assignment to constant variable. // вызовем функцию ещё раз sum(3, 7);

В этом примере функция также содержится в переменной, но в объявленной с помощью const . А так как переменная объявлена с помощью const , то мы не можем ей присвоить новое значение, в данном случае число 4 .

Оператор typeof

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

JavaScript

typeof operand typeof(operand)

В качестве результата он возвращает строку, которая будет показывать тип этого значения:

JavaScript

let name; const age = 37; const email = 'v3@gmail.com'; const isLicense = true; const interest = null; const num = 3n; const lastExperience = { [id]: 37216, period: 'June 2011 - June 2018', place: 'ISACA, Moscow', position: 'Web designer' }; const getExperience = () =gt; { return `${lastExperience.period} (${lastExperience.position} - ${lastExperience.place})`; }; console.log(typeof name); // undefined console.log(typeof age); // number console.log(typeof email); // string console.log(typeof isLicense); // boolean console.log(typeof interest); // object (1) console.log(typeof num); // bigint console.log(typeof id); // symbol console.log(typeof lastExperience); // object console.log(typeof getExperience); // function (2)

(1) — При получении типа данных для значения null , оператор typeof возвращает object . Это ошибка, которая присутствует в языке, начиная с его первой реализации. Она не была исправлена в целях сохранения совместимости и это необходимо учитывать, при написании сценариев. null — это примитивный тип данных, он не является объектом.

(2) — Очень удобно, что typeof выделяет функции отдельно. Это позволяет нам очень просто проверить является ли указанная переменная функцией. Но функции в JavaScript являются объектами:

JavaScript

console.log(getExperience instanceof Object); // true

Оператор typeof очень часто используется когда нужно узнать есть ли значение у переменной:

JavaScript

let a; if (typeof a === 'undefined') { console.log('У переменной a нет значения!'); } else { console.log(`Переменная a имеет значение: ${a}!`); }

Также typeof применяется когда вы не уверены какой тип у переменной и вам нужно его проверить перед тем как выполнить какие-то действия:

JavaScript

let sum = 0; [1, 3, 'a', null].forEach((item) => { if (typeof item === 'number') { sum += item; } }); console.log(sum); // 4

В этом примере мы будем прибавлять к sum значение переменной item только если она является числом, т.е. имеет тип number .

Какие ключевые слова используются в javascript для того чтобы объявить переменную

Грамматика и типы

Основы

Комментарии

Объявления

Переменные

Объявление переменных

Присваивание значений

Область видимости переменных

Поднятие переменных

Поднятие функций

Глобальные переменные

Константы

Структуры и типы данных

Типы данных

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

Преобразование строк в числа

Литералы

Литерал массива

Лишние запятые в литералах array

Логические литералы

Литерал целого числа

Литерал числа с плавающей точкой

Литерал объекта

RegExp литерал

Строковый литерал

Использование специальных символов в строках

Экранирующие символы

Дополнительная информация

Found a content problem with this page?

Переменные

Переменная

Аналогия из жизни

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

Константы

Константы в верхнем регистре

Придумывайте правильные имена

Итого

Задачи

Работа с переменными

JavaScript Переменные

Переменные

Пример

Программирование как в алгебре

Пример

JavaScript Идентификаторы

JavaScript Оператор присваивания

JavaScript Типы данных

Пример

JavaScript Объявление (создание переменной)

Пример

Подтверждение

Значение = undefined

Пример

JavaScript Повторное объявление переменных

Пример

JavaScript Арифметика

Пример

Выражения, переменные и типы данных в JavaScript

Первая программа

Выражения

Переменные

Именование переменных

Объявление переменных

Отличие let от const

Ключевое слово var

Типы данных

1. Object (объект)

2. Number (число)

3. BigInt (большое целое число)

4. String (строка)

5. Boolean (логический тип данных)

6. Тип null

7. Тип undefined

8. Symbol (символ)

Динамическая типизация

Оператор typeof

Добавить комментарий Отменить ответ