Переменные, области и поднятие переменных в JavaScript. Переменные

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

Объявление

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

Var num; let num2;

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

Var num, num2; let num3, num4;

Инициализация и присваивание значения

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

Var color = "чёрный"; let num = 10, num2 = 15;

Переменные в JavaScript не имеют типа, поэтому переменной может быть присвоено значение любого типа, а затем этой же переменной может быть присвоено значение другого типа:

Var a = 10; let b = 20; a = "текст"; b = "текст";

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

Var a; let b; console.log(a); // undefined console.log(b); // undefined

Обращение к значению

После того как переменная объявлена ключевое слово var или let при использовании переменной указывать не нужно. Чтобы в программе обратиться к значению переменной, надо просто написать имя переменной, интерпретатор JavaScript вместо неё подставит значение, которое хранится в переменной:

Var x = 10, msg = "Hello"; alert(x); document.write(msg); Попробовать »

Так как вместо имени переменной подставляется её значение, можно копировать значение из одной переменной в другую:

Var a = 10; let b; b = a; // Тоже самое, что и b = 10;

Если попытаться использовать необъявленную переменную, будет вызвана ошибка:

Console.log(x); // Ошибка

Переменные – фундаментальная составляющая многих языков программирования; они являются одним из наиболее важных понятий для начинающих программистов. В 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";

Это выражение состоит из нескольких частей:

  • Объявление переменной с помощью ключевого слова 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 имена переменных называются идентификаторами. Несколько правил именования идентификаторов можно найти в мануале . Вот они вкратце:

  • Имена переменных могут состоять только из букв, цифр (0-9), символа доллара ($) и подчеркивания (_).
  • Имена переменных не могут содержать пробельные символы.
  • Имя переменной не должно начинаться с числа.
  • Существует несколько зарезервированных ключевых слов , которые нельзя использовать как имена переменных.
  • Имена переменных чувствительны к регистру.

JavaScript также имеет соглашение об использовании верблюжьего регистра (camelCase) в именах функций и переменных, объявленных с помощью var или let. При этом первое слово пишется в нижнем регистре, а каждое следующее слово начинается с заглавной буквы (слова пишутся без пробелов между ними). Большинство переменных, которые не являются константами, будут следовать этому соглашению, за некоторыми исключениями. Имена переменных, которые являются константами (объявлены ключевым словом const), обычно записываются в верхнем регистре.

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

Разница между var, let и const

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

Возможно, вам интересно, какое из трех ключевых слов вы должны использовать в своих программах. Принято использовать const как можно чаще, а let – в циклах и для переназначения. Как правило, var используется в устаревшем коде.

Область видимости JavaScript

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

  • Глобальные переменные – это те, которые объявлены вне блока.
  • Локальные переменные – это те, которые объявлены внутри блока.

В приведенном ниже примере мы создадим глобальную переменную.


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.

var fullMoon = true;
// Initialize a global variable
let species = "human";
if (fullMoon) {
// Initialize a block-scoped variable
let species = "werewolf";

}


It is not a full moon. Lupin is currently a human.

В этом примере переменная species имеет одно глобальное значение (human) и одно локальное значение (werewolf). Однако если использовать var, будет другой результат.

// Use var to initialize a variable
var species = "human";
if (fullMoon) {
// Attempt to create a new variable in a block
var species = "werewolf";
console.log(`It is a full moon. Lupin is currently a ${species}.`);
}
console.log(`It is not a full moon. Lupin is currently a ${species}.`);
It is a full moon. Lupin is currently a werewolf.
It is not a full moon. Lupin is currently a werewolf.

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

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

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

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


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.

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


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);
{ color: "blue", price: 20000 }

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

Заключение

В этом мануале вы узнали, что такое переменная, ознакомились с правилами именования переменных и научились переназначать их значения. Также вы узнали об областях видимости и поднятии переменных, ограничениях ключевого слова var, а также о том, как let и const устраняют эти проблемы.

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

Из приведенного выше примера, вы можете ожидать:

  • x сохраняет значение 5
  • y сохраняет значение 6
  • z сохраняет значение 11
Так же, как алгебра

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Это отличается от алгебры. Ниже не имеет смысла в алгебре:

В JavaScript, однако, это имеет смысл: он присваивает значение х + 5 до х.

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

"Равно" оператор записывается как == в JavaScript.

Типы данных JavaScript

Переменные JavaScript может содержать цифры, как 100 и текстовые значения, как "John Doe" .

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

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

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

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

Декларирование (Создание) Переменные JavaScript

Создание переменной в JavaScript называется "объявить" переменную.

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

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

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

carName = "Volvo";

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

var carName = "Volvo";

В приведенном ниже примере, мы создаем переменную с именем carName и присвоить значение "Volvo" к нему.

Тогда мы "выход" значение внутри HTML пункта с id="demo" :

пример


var carName = "Volvo";
document.getElementById("demo").innerHTML = carName;

Попробуй сам " Одно заявление, много переменных

Можно объявить много переменных в одном операторе.

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

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

Значение = не определено

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

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

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

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

Основы

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

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

Var Früh = "foobar";

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

Комментарии

Синтаксис комментариев является таким же, как и в C++ и во многих других языках:

// Комментарий, занимающий одну строку. /* Комментарий, занимающий несколько строк. */ /* Нельзя вкладывать /* комментарий в комментарий */ SyntaxError * / Объявления

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

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

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

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

Вы можете использовать в идентификаторах буквы ISO 8859-1 или 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

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

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

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

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

У этого массива есть 2 элемента со значениям и один пустой (fish - "Lion", fish - undefined , а fish - "Angel").

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

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

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

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

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

В следующем примере длина массива равна четырем, элементы myList и myList имеют значение 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][(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 со строковым литералом:

Console. 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"

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

Специальные символы в JavaScript Символ Значение
\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{XXXXX} Символ в UTF-32BE. Например, \u{2F804} обозначает то же, что обычная запись \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, прочитайте:

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

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

Создание переменной

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

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


Как называть переменные решать, конечно, вам, однако есть несколько правил, которым необходимо соблюдать, чтобы работал javascript :

  • первое правило , избегайте использование зарезервированных слов . Некоторые слова в языке JavaScript используются в самой системе, как например слово var при помощи которого мы объявляем переменную. Кроме того, некоторые слова, такие как alert , document , window , считаются особыми свойствами веб страницы. Если вы попытаетесь их задействовать в качестве переменных, то получите сообщение об ошибке. Тут можно посмотреть список зарезервированных слов .
  • второе правило , имя переменной должно начинаться с буквы, символа $ или _ . То есть переменная не может начинаться с цифры или знака препинания: имя 1dwstv и &dwstv работать не будут, а имена $dwstv и _dwstv будут.
  • третье правило , в имени переменной могут содержаться буквы, цифры, символы $ и _, и не могут быть использованы в имени пробелы или другие специальные знаки : dws&tv и dws tv это недопустимые имена, а такого формата можно, dws_tv и dwstv1 или dws_tv_1 .
  • четвертое правило , имена переменных чувствительны к регистру . Интерпретатор JavaScript по разному воспринимает строчные и прописные буквы, то есть переменная DWSTV отличается от переменной dwstv , а также от переменной DwStv и Dwstv .
  • пятое правило , не рекомендуется использовать символы, отличные от латиницы , переменные, написанные кириллицей, хоть и будут работать, но это не гарантировано, к тому же коллегам из других стран понятны не будут.

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

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

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

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

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


Для примера положим в переменную dwstv цифровое значение, количество подписчиков 8500, объявляем переменную var dwstv; и второй строкой кладем в нее значение dwstv = 8500;

Var dwstv; dwstv = 7200;

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

Var dwstv = 7200;

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

Var dwstv = 7200;var lessons = ‘JavaScript’; var youtubeKanal = ‘DwsTV’; var subscribers = ‘7700’; var content = true;

Мы можем также экономить место, время, декларируя переменные одним ключом var, пример:

Var lessons = ‘JavaScript’, youtubeKanal = ‘DwsTV’, subscribers = ‘7700’, content = true;

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

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

Alert(kanal);

Обратите внимание, что мы не заключаем переменные в кавычки - они только для строк, поэтому мы не пишем alert(‘kanal’) , так как в этом случае мы получим слова kanal, а не значение сохраненное в переменной.

Теперь я думаю, вы разобрались, почему строки следует заключать в кавычки: интерпретатор javaScript воспринимает слова без кавычек либо как специальные объекты (например, команда alert() ), либо как имена переменных.

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

Subscribers = ‘10000’;

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

Практическое задание:

Создайте три переменных, одной присвойте числовое значение, второй строковое значение, а третьей логическое. Все переменные задекларируйте одним ключевым словом var, и отобразите их на странице. Затем переопределите переменную с числовым значением, и полученный результат отобразите при помощи функции alert() .


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

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

Урок подготовил Горелов Дениc.