Переменные в JavaScript являются контейнерами для хранения различной информации.
Переменные JavaScriptJavaScript переменные являются "контейнерами", в которые Вы можете загружать различную информацию, а позднее извлекать ее обратно.
Каждая JavaScript переменная должна иметь собственное уникальное имя, которое может начинаться с латинской буквы или символа "_".
Обратите внимание: имя переменных в JavaScript не может начинаться с цифр.
Обратите внимание: так как JavaScript чувствителен к регистру, переменные с одинаковыми именами написанными в разном регистре (например var и VAR), будут являться разными переменными.
Создание переменныхСоздание переменных в JavaScript часто называют "объявлением" переменных.
Переменные в JavaScript объявляются с помощью команды var .
//Создаем переменную с именем ex1 var ex1; //Создаем переменную с именем ex2 var ex2;
Созданные выше переменные будут пустыми то есть мы создали контейнеры, но не загрузили в них никакие значения.
Значения могут загружаться в контейнеры также прямо в момент создания как в примере ниже:
//Создаем переменную с именем ex1 содержащую значение 4 var ex1=4; //Создаем переменную с именем ex2 содержащую значение 5 var ex2=5;
Для того, чтобы извлечь значение из созданной ранее переменной, необходимо обратится к ее имени.
В следующем примере мы будем извлекать содержимое переменных и сразу выводить его на страницу с помощью команды document.write.
//Запишем число 4 в переменную ex1
var ex1=4;
//Запишем число 5 в переменную ex2
var ex2=5;
//Выведем содержимое переменной ex1 на страницу
document.write(ex1+"
");
//Выведем содержимое переменной ex2
document.write(ex2+"
");
//Изменим содержимое переменной ex2
ex2=200;
//Выведем новое содержимое переменной ex2
document.write(ex2);
Быстрый просмотр
Строковые переменныеПомимо чисел Вы можете хранить в переменных произвольный текст. Переменные, которые хранят текст, называются строковыми переменными .
При записи текста в переменную обязательно заключайте его в двойные (") или одинарные кавычки (").
//Запишем в переменную ex строку "Привет всем!" var ex="Привет всем!"; //Выведем значение переменной ex на страницу document.write(ex);
Быстрый просмотр
Определение переменных с var и без негоВ JavaScript Вы можете определять переменные с var и без него.
//Создадим новую переменную с var var ex=123; //Создадим новую переменную без var ex2=20;
Вам может показаться, что объявление переменных с var и без него всегда приводят к одинаковому результату, но это действительно так только, когда когда объявление происходит в глобальном контексте (т.е. за пределами всех функций).
Если же объявление происходит в локальном контексте (т.е. в теле какой-либо функции) объявление с var создает локальную переменную (т.е. переменную, которая будет доступна только в теле данной функции и после выполнения функции будет уничтожена), объявление без var создает глобальную переменную (т.е. переменную, которая будет доступна другим функциям внутри данного скрипта).
Обратите внимание: мы подробнее поговорим о локальных и глобальных переменных далее в этом учебнике.
Об удалении и переопределении переменныхПереопределяя переменные Вы не стираете значение, которое хранятся в них.
Var ex=123; var ex; document.write(ex); // Выведет 123
Если Вы хотите удалить переменную в JavaScript и она не была объявлена с помощью var Вы можете использовать оператор delete .
Ex=123; delete ex;
Оператор delete не может удалить переменные объявленные с помощью var, поэтому если переменная была объявлена с помощью var, то единственный способ удалить ее - присвоить ей значение null или undefined.
Var ex=123; ex=null; // или ex=undefined
Сделайте самиЗадание 1 . Исправьте ошибки в коде ниже:
Задание 1
var 33var=33;
document.write(33var);
document.write("
");
var str1=Привет всем!;
document.write(str1);
document.write("
");
var vaR = 288;
document.write(var);
document.write("
");
Задание 2 . Во внешнем файле secred1.js содержится переменные sec1, sec2, sec3 и sec4, которые содержат буквы кодового слова (не по порядку). Подключите внешний файл и узнайте кодовое слово путем вывода значений переменных на страницу.
Переменная – это именованный участок памяти, в который можно как сохранить некоторую информацию, так и получить её из неё.
Объявление (создание) переменных осуществляется с помощью ключевого слова var .
// message - имя переменной var message;
При создании переменной ей сразу же можно присвоить значение.
Присвоение переменной значения осуществляется с помощью оператора «=».
// например, создадим переменную email и присвоим ей строку "[email protected]" var email = "[email protected]"; // установим переменной email новое значение email = "[email protected]";
Для того чтобы получить значение переменной достаточно просто обратиться к ней по имени.
// например, выведем в консоль браузера значение переменной email: console.log(email);
Для того чтобы объявить не одну, а несколько переменных с помощью одного ключевого слова var , необходимо использовать запятую.
Var price = 78.55, quantity = 10, message;
JavaScript является языком с динамической или слабой типизацией. Это означает, что при объявлении переменной ей не нужно указывать тип данных, который она может принимать. Следовательно, в переменную можно поместить сначала значение, имеющее один тип данных, а потом другой.
Var output = "успех"; // переменная имеет строковый тип данных output = 28; // эта же переменная, но уже имеющая тип данных «число» output = true; // эта же переменная, но уже хранящая булевское значение
Значение переменной можно изменять неограниченное количество раз.
// создана переменная age var age; // переменной age присвоено значения 67 age = 67; // переменной age установлено значение «Пенсионный возраст» age = "Пенсионный возраст"; // переменной age установлено число 55 age = 55;
Хорошей практикой при разработке клиентских считается использование в определённой переменной только одного типа данных, т.е. не записывать в переменную значения, имеющие различные типы данных. Чтобы понять какой тип данных стоит ожидать в переменной рекомендуется при создании переменной её сразу инициализировать определённым значением.
Имя переменной можно составлять из букв, цифр и символов $ и _. При этом первый символ переменной не должен быть цифрой. Кроме этого в качестве имени переменной нельзя использовать зарезервированные слова.
// создание двух переменных, первая переменная имеет имя phone, вторая - meassage; var phone, message;
Регистр букв в имени переменной имеет значение. Т.е., например, переменная phone и Phone - это две разные переменные.
Если строгий режим не используется, то создать переменную с первоначальным значением можно и без ключевого слова var.
Price = 250.00; // создали переменную и инициализировали её числом 250.00 percent = "20%"; // создали переменную и инициализировали её строкой «20%»
Но создавать, таким образом, переменные не рекомендуется.
Типы данныхВ JavaScript типы данных можно разделить на примитивные и объектные.
Переменные, содержащие примитивные типы данных хранят значение явно.
В JavaScript выделяют 5 примитивных типов данных:
- число (number);
- строка (string);
- булевый тип (boolean);
- null;
- undefined.
Если одной переменной присвоить значение другой, которая содержит примитивный тип данных, то она получит собственную копию этого значения.
Var x = 77, y = x; x = 55; y; // 77
Переменные, содержащие объект, на самом деле хранят не сам объект, а ссылку на него.
Если одной переменной присвоить значение другой, которая содержит объект (ссылку на него), то она тоже получит ссылку на него. В результате этой операции две эти переменные будут содержать ссылку на один и тот же объект.
// пример 1 (с типом данных «объект») var coord1 = {x: 77, y: 100}, coord2 = coord1; coord1.x = 55; // установим свойству x объекта новое значение coord2.x; // 55, т.к. coord1 и coord2 содержат ссылку на один и тот же объект // пример 2 (с типом данных «массив») var coord1 = , coord2 = coord1; coord1 = 55; // установим элементу с 0 индексом новое значение coord2; // 55, т.к. coord1 и coord2 содержат ссылку на один и тот же объект // пример 3 (с типом данных «дата») var date1 = new Date(2018,00,01), date2 = date1; date2 = date2.setDate(date2.getDate()+7); // увеличим дату на 7 дней date1; // 07.01.2018, т.к. date1 и date2 содержат ссылку на один и тот же объект
Число (number)Числовой тип в JavaScript данных является универсальным . Он используется для представления, как целых , так и дробных чисел.
Var int = 5; // целое число var float = 5.98; // дробное число
Формат представления чисел в JavaScript осуществляется в соответствии со стандартом IEEE 754-2008.
Целые числа в JavaScript можно задавать не только в десятичной системе счисления, но и в восьмеричной (0) или шестнадцатеричной системе счисления (0x) с использованием префиксов, указанных в круглых скобках:
Var int = 010; // 8 int = 055; // 45 int = 0xFF; //255 int = 0xB8; // 184
Записывать числа возможно в экспоненциальной форме :
Var 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 по причине того, что оно тоже слишком велико.
Пример выражений в результате вычисления которых будет возвращены специальные числовые значения :
5/0; // Infinity -5/0; // -Infinity Math.pow(10,399); // Infinity (10 в степене 399) Math.pow(10,399); // -Infinity (-10 в степене 399)
Значение NaN возвращается в результате выполнения математических операций, которые JavaScript не может вычислить.
5 - "Hi"; // NaN (от числа 5 отнять строку) 1000 / "20px"; // NaN (число поделить на строку) true * "1rem"; // NaN (логическое значение true умножить на строку)
При этом очень интересным является то, что значение NaN в JavaScript не равно ничему включая себя.
NaN == NaN; // false NaN === NaN; //false
Логический тип данных (Boolean)Boolean – примитивный тип данных, который имеет всего два значения: true (истина) и false (ложь).
Var a = true; var b = false;
Строка (String)Строка (String) – это тип данных, который используется в JavaScript для представления текста.
Строка JavaScript может состоять из 0 или большего количества символов.
В качестве формата строки в JavaScript всегда использутся кодировка Unicode.
Создание строки (литерала строки) выполняется посредством заключения текста в одинарные или двойные кавычки .
"JavaScript"; "ECMAScript";
В JavaScript нет разницы между одинарными и двойными кавычками.
Но, в некоторых случаях есть смысл использовать именно одинарные кавычки, а не двойные и наоборот.
Например, когда строка содержит двойные кавычки, её более удобно заключить в одинарные. Это избавит от необходимости экранирования в ней двойных кавычек.
""ECMAScript""; // без экранирования (с использованием одинарных кавычек) "\"ECMAScript\""; // с экранированием
Строка в JavaScript может содержать специальные символы. Например, \n (перевод строки), \t (табуляция), \r (возврат каретки) и др.
"Это предложение.\nА это тоже предложение, но оно будет начинаться с новой линии.";
Со строками можно произовдить операцию сложения (объединения) или другими словами конкатенацию. Для этого используется оператор "+". Сымысл данной операции заключается в присоединении второй строки к концу первой.
"Я люблю " + "JavaScript"; // Я люблю JavaScript
Значение "undefined"undefined - специальный примитивный тип данных, который имеет одно значение, равное undefined .
Этот тип данных имеет объявленная переменная, которой ещё не присвоено значение.
Var num; // undefined
Значение undefined также будет возвращено при обращении к несуществующему свойству объекта.
Var obj = {}; // пустой объект obj.prop; // undefined
Значение "null"null - специальный примитивный тип данных, который имеет одно значение, равное null .
null - это просто специальное значение, которое имеет смысл «ничего» или «неизвестное значение», т.е. оно явно ничего не означает.
Объект (Object)Объект – это структура данных, состоящая из пар имя-значение.
Создание объекта с помощью нотации литерала объекта осуществляется следующим образом:
{ имя_1: значение_1, имя_2: значение_2, имя_3: значение_3, ... }
Как видно, имя от значения отделяется с помощью двоеточия, а пары между собой с помощью запятой.
При этом если в качестве значения пары выступает функция, то она называется методом этого объекта. Все остальные пары, т.е. пары в которых в качестве значения не используется функция, называются свойствами объекта.
Другими словами, объект - это структура данных, состоящая из свойств и методов.
Var person = { name: "Виталий", age: 27, getAge: function () { return "Возраст: " + this.age; } }
Обращение к свойствам объекта выполняется через точку или посредством скобочной записи.
// выведем значение свойства age в консоль браузера // 1 способ (через точку) console.log(person.age); // 2 способ (с помощью скобок) console.log(person["age"]); // вызовем метод getAge; значение, которое он вернет, выведем в консоль console.log(person.getAge());
Оператор typeofОператор typeof используется для получения информации о типе данных выражения в виде строки.
Синтаксис оператора typeof (вариант без круглых скобок):
Typeof выражение
Синтаксис оператора typeof (с использованием круглых скобок):
Typeof(выражение)
Var name, age = 37, email = "[email protected]", isLicense = true, interest: null, lastExperience: { period: "June 2011 - June 2018", place: "ISACA, Moscow", position: "Web designer" }, getExperience: function() { return lastExperience.period + " ("+ lastExperience.position + " - " + lastExperience.place + ")"; }; typeof name; // "undefined" typeof age; // "number" typeof isLicense; // "boolean" typeof interest; // "object" (1) typeof lastExperience; // "object" typeof getExperience; // "function" (2) /* (1) - это ошибка, которая присутствует в языке, начиная с его первой реализации; она не была исправлена в целях сохранения совместимости и это необходимо учитывать, при написании сценариев; null - это примитивный тип данных, он не является объектом */ /* (2) - это очень удобно, что оператор typeof выделяет функции отдельно; но функция в JavaScipt - это тоже объект; в этом легко убедиться если выполнить следующую конструкцию: */ typeof getExperience.__proto__.__proto__ // "object" (прототипом функции является объект)
КонстантыС выходом ECMAScript 6 появилось возможность создавать константы. Осуществляется это с помощью ключевого слова const.
Const COLOR_RED = "#ff0000";
Константа – это переменная, значение которой защищено от изменения. Т.е. при попытке поменять значение будет брошена ошибка.
Const COLOR_RED = "#ff0000"; COLOR_RED = "#f44336"; // Uncaught TypeError: Assignment to constant variable.
Если, например, константа содержит объект, то он не может быть изменен, а точнее ссылка на него. Но свойства этого объекта могут быть изменены.
Const COLORS = { red: "#ff0000", green: "#00ff00", blue: "#00ff00" } COLORS = ["#ff0000","#00ff00","#00ff00"]; // Uncaught TypeError: Assignment to constant variable. COLORS.green = "#4caf50";
The var statement declares a variable, optionally initializing it to a value.
The source for this interactive example is stored in a GitHub repository. If you"d like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
Syntax var varname1 [ = value1] [ , varname2 [ = value2] ... [ , varnameN [ = valueN]]] ; varnameN Variable name. It can be any legal identifier. valueN Initial value of the variable. It can be any legal expression. Default value is undefined . Descriptionvar declarations, wherever they occur, are processed before any code is executed. This is called hoisting, and is discussed further below.
The scope of a variable declared with var is its current execution context , which is either the enclosing function or, for variables declared outside any function, global. If you re-declare a JavaScript variable, it will not lose its value.
Assigning a value to an undeclared variable implicitly creates it as a global variable (it becomes a property of the global object) when the assignment is executed. The differences between declared and undeclared variables are:
1. Declared variables are constrained in the execution context in which they are declared. Undeclared variables are always global.
Function x() { y = 1; // Throws a ReferenceError in strict mode. var z = 2; } x(); console.log(y); // 1 console.log(z); // Throws a ReferenceError: z is not defined outside x.
2. Declared variables are created before any code is executed. Undeclared variables do not exist until the code assigning to them is executed.
Console.log(a); // "undefined" or "" depending on browser console.log("still going..."); // still going... var a = 1; console.log(a); // 1 console.log("still going..."); // still going...
3. Declared variables are a non-configurable property of their execution context (function or global). Undeclared variables are configurable (e.g. can be deleted).
Var a = 1; b = 2; delete this.a; // Throws a TypeError in strict mode. Fails silently otherwise. delete this.b; console.log(a, b); // Throws a ReferenceError. // The "b" property was deleted and no longer exists.
Because of these three differences, failure to declare variables will very likely lead to unexpected results. Thus it is recommended to always declare variables, regardless of whether they are in a function or global scope. And in ECMAScript 5 strict mode , assigning to an undeclared variable throws an error.
var hoistingBecause variable declarations (and declarations in general) are processed before any code is executed, declaring a variable anywhere in the code is equivalent to declaring it at the top. This also means that a variable can appear to be used before it"s declared. This behavior is called "hoisting", as it appears that the variable declaration is moved to the top of the function or global code.
Bla = 2; var bla; // ...is implicitly understood as: var bla; bla = 2;
For that reason, it is recommended to always declare variables at the top of their scope (the top of global code and the top of function code) so it"s clear which variables are function scoped (local) and which are resolved on the scope chain.
It"s important to point out that the hoisting will affect the variable declaration, but not its value"s initialization. The value will be indeed assigned when the assignment statement is reached:
Function do_something() { console.log(bar); // undefined var bar = 111; console.log(bar); // 111 } // ...is implicitly understood as: function do_something() { var bar; console.log(bar); // undefined bar = 111; console.log(bar); // 111 }
Examples Declaring and initializing two variables var a = 0, b = 0; Assigning two variables with single string value var a = "A"; var b = a; // ...is equivalent to: var a, b = a = "A";Be mindful of the order:
Var x = y, y = "A"; console.log(x + y); // undefinedA
Here, x and y are declared before any code is executed, but the assignments occur later. At the time " x = y " is evaluated, y exists so no ReferenceError is thrown and its value is undefined . So, x is assigned the undefined value. Then, y is assigned the value "A" . Consequently, after the first line, x === undefined && y === "A" , hence the result.
Initialization of several variables var x = 0; function f() { var x = y = 1; // Declares x locally; declares y globally. } f(); console.log(x, y); // 0 1 // In non-strict mode: // x is the global one as expected; // y is leaked outside of the function, though!The same example as above but with a strict mode:
"use strict"; var x = 0; function f() { var x = y = 1; // Throws a ReferenceError in strict mode. } f(); console.log(x, y);
Implicit globals and outer function scopeVariables that appear to be implicit globals may be references to variables in an outer function scope:
Var x = 0; // Declares x within file scope, then assigns it a value of 0. console.log(typeof z); // "undefined", since z doesn"t exist yet function a() { var y = 2; // Declares y within scope of function a, then assigns it a value of 2. console.log(x, y); // 0 2 function b() { x = 3; // Assigns 3 to existing file scoped x. y = 4; // Assigns 4 to existing outer y. z = 5; // Creates a new global variable z, and assigns it a value of 5. // (Throws a ReferenceError in strict mode.) } b(); // Creates z as a global variable. console.log(x, y, z); // 3 4 5 } a(); // Also calls b. console.log(x, z); // 3 5 console.log(typeof y); // "undefined", as y is local to function a
Specifications| ECMAScript 1st Edition (ECMA-262) | Standard | Initial definition. Implemented in JavaScript 1.0 |
| ECMAScript 5.1 (ECMA-262) The definition of "var statement" in that specification. |
Standard | |
| ECMAScript 2015 (6th Edition, ECMA-262) |
Standard | |
| ECMAScript Latest Draft (ECMA-262) The definition of "variable statement" in that specification. |
Draft |
The compatibility table on this page is generated from structured data. If you"d like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Update compatibility data on GitHub
| Desktop Mobile Server | ||||||||||||
| Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet Node.js | ||||||||||||
| Chrome Full support 1 | Edge Full support 12 | Firefox Full support 1 | IE Full support 3 | Opera Full support Yes | Safari Full support Yes | WebView Android Full support 1 | Chrome Android Full support 18 | Firefox Android Full support 4 | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support 1.0 | nodejs Full support Yes |
В данной главе рассматриваются базовая грамматика, объявление переменных, типы данных и литералы.
Основы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"В следующей таблице перечислены специальные символы, которые вы можете использовать.
| \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.
