Переменные. Арифметические и логические операции в JavaScript. JavaScript - Переменные. Константы. Типы данных Javascript объявление переменных

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

Объявление (создание) переменных осуществляется с помощью ключевого слова 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";

Программист хочет создать глобальную переменную film и другую перемен­ную, которая называется так же, но действует только в функции showBadFilm() . Какое сообщение выведет alert из функции showGoodFilm() ? А какое сообщение будет выведено, если эту функцию вызвать повторно, но после вызова функции showBadFilm() ?

Хороший или плохой фильм? var film = "Калина красная"; function showGoodFilm() { alert(film + " - хороший фильм!"); } function showBadFilm() { film = "11 сентября"; alert(film + " - плохой фильм!"); } showGoodFilm(); // что выведет alert? showBadFilm(); // что выведет alert? showGoodFilm(); // что выведет alert?

Решение:

Обратите внимание на то, что в функции showBadFilm() перед переменной film отсут­ствует ключевое слово var . Поэтому JavaScript предполагает, что вы хотите переопределить зна­чение глобальной переменной, а не создать одноименную локальную переменную. Поэтому повторный вызов функции showGoodFilm() выведет: "11 сентября – хороший фильм!"

  • Проверка типа данных

    К какому из примитивных типов данных относятся следующие переменные? Постарайтесь ответить не запуская скрипт.

    Проверка типа данных var film = "Калина красная"; var 07_agent = "Агент"; var num = 10; var num1 = "10"; var u = true; var x; alert(typeof Film); //??? alert(typeof 07_agent); //??? alert(typeof num); //??? alert(typeof num1); //??? alert(typeof u); //??? alert(typeof x); //???

    Решение:

    Обратите внимание на то, что первая переменная объявлена под именем film , а в alert указана переменная Film . Это две разные переменные, поскольку JavaScript – регистрозависимый язык. Имя 07_agent начинается с цифры, а это вызовет синтаксическую ошибку и, как результат – скрипт не сработает.

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

Переменные JavaScript

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

Каждая 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, которые содержат буквы кодового слова (не по порядку). Подключите внешний файл и узнайте кодовое слово путем вывода значений переменных на страницу.

Честно сказать я с начала не хотел вводить эту тему. Что можно говорить о переменных, особенно в JavaScript? Но потом вспомнил, как иногда разбирался со сложными конструкциями и с трудом понимал некоторые, казалось бы недопустимые в других языках программирования выражения. Можно сказать так: здесь вам не будет ошибки "Неверный тип данных", а если и будет то очень редко. Если вы работали с другими языками программирования, тогда вспомните как часто у вас возникала ошибка о неверных типах данных. В языке JavaScript тип данных может с легкостью переопределяться, при этом вы можете и не заметить в каком месте, - вот в этом то и сложность. С другой стороны, если вы будете хорошо ориентироваться в принципах преобразований типов, знать все свойства переменных и массивов, эти возможности только принесут вам уверенность в написании программ.

Переменные языка JavaScript могут хранить значения различных типов:

  • Строки - последовательность символов;
  • Числовые значения- целые и действительные числа;
  • Булевы значения- только два значения true или false;
  • Массивы- множества однотипных переменных;
  • Даты- значения даты и времени.
Время жизни переменной связано с окном, в котором они созданы и зависит от того, где они определены. JavaScript- программы содержатся в документах HTML, и при загрузке нового документа в браузер любые переменные, созданные в программе, будут удалены.
Чтобы сохранить какие-либо значения при загрузке нового документа в JavaScript имеются только 2 решения:
  • путем создания переменных во фреймосодержащем документе верхнего уровня;
  • путем использования "cookies";
Для сохранения переменных и функций с помощью фреймосодержащих документов эти переменные и функции неодходимо определить в документе верхнего уровня, а затем использовать свойства parent или top объекта window для обращения к ним из документов, загруженных в фреймы. ВАЖНО: такие переменные и функции нужно задавать в заголовке документа верхнего уровня между тегами . . . . Конечно, существует вероятность, что документ может быть загружен без фрейма и тогда обращение к неопределенному объекту вызовет ошибку, но можно предварительно проверить загружен ли документ в фрейм:



Cookies позволяют сохранять небольшие фрагменты информации на локальном диске пользователя. Устанавливая значения cookies и прореряя их на последующих стадиях работы, иожно восстанавливать необходимые значения. Более подробно о cookies будем говорить позже.

Имена переменных, создание переменных

В языке JavaScript создать переменную гораздо проще, чем в других языках программирования. Например, при создании переменной нет необходимости указывать ее тип. Переменные определяют как с начальными значениями, так и без них. В процессе выполнения программы уже созданные переменные можно даже приводить к различным типам данных. Имена переменных могут начинаться с любой буквы (от a до z, или A-Z) либо с символа подчеркивания (_), оставшаяся часть может содержать цифры, символы подчеркивания и буквы. Помните то, что в именах переменных различаются символы верхнего и нижнего регистра: например MyVariable - это не то же что myvariable.
Переменную можно создать одним из способов:

  • при помощи оператора var и операции присваивания (=);
  • при помощи операции присваивания (=).
Оператор Var используют не только для создания переменной, но и для ее инициализации. Операция присваивания (=) необходима, чтобы запомнить в переменной значение, и при работе с переменными, созданными без начального значения, ее использовать не обязательно. Например:

Var MyVariable = 35

Создает переменную с именем MyVariable, содержащую числовое значение 35. Переменная существует до тех пор, пока загружен текущий документ. Если вы создаете эту переменную во фреймосодержащем документе верхнего уровня, к ней следует обращаться с помощью выражения top.MyVariable, а еще лучше parent.MyVariable для подстраховки от вложенных фреймов.

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

Var MyVariable = "35"

Переменная будет уже хранить строку "35". Подобные преобразования-то и приводят иногда к недоразумениям. Вот например:



Как вы думаете какое значение примет переменная "c" после выполнения программы? Если вы не знакомы с правилами преобразования переменных в JavaScript - не угадаете. Значение переменной "c" после завершения блока будет равным числовому значению 320. О принципах преобразования типов переменных будем говорить позже. Переменную можно определить и не используя оператор "Var", а просто достаточно присвоить значение, причем каков тип данных будет присвоен, того типа и окажется переменная. Оператор "Var" используется по большей части для читабельности JS-программы. Переменная может быть задана и без начальных значений, например:

Var MyVariable;

Создана переменная с именем MyVariable, не имеющая определенного типа данных и начального значения. Переменные, создаваемые при помощи таких описаний, известны как неопределенные (null variable). Например сравнивая такую переменную со значением null, можно узнать, определена ли переменная. Однако нельзя путать разные вещи: ""- пустая строка это строковый тип и вовсе не null-значение.

Тип переменной может быть установлен в любом месте JS-программы в отличие от других языков программирования, что дает дополнительную гибкость, но и возможность запутаться - помните это. К переменной, которая не создана, обратиться невозможно. Если нужно создать временную переменную, например счетчик цикла, нужно записать перед ней префикс var:
for (var i=0; i "10"); Самым простым и наиболее распространенным способом создания объекта String является использование таких операторов, как

Var myVariable = "Хорошее пиво";

Приведенный оператор присваивает строку "Хорошее пиво" строковой переменной myVariable. Переменная myVariable рассматривается как строковый объект и может использовать любой из стандартных методов объекта String языка JavaScript. Оператор Var можно пропустить, как и говорилось ранее он нужен в основном для читабельности программы.

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

Var myVariable = new String();

Этот оператор создает новый объект - пустую строку с именем myVariable. Изначально это пустая строка (""), а значение свойства myVariable.length равное 0.

Конструктор String() допускает передачу заданной строки в виде аргумента:

Var myVariable = new String("Правильное пиво");

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

  • \n - символ новой строки;
  • \r - символ возврата каретки;
  • \f - код перехода на новую страницу;
  • \xnn - представление символа в виде шестнадцатиричного ASCII-кода nn;
  • \b - код клавиши .
эти символы будут правильно интерпретированы только в контейнерах и в методах "Alert". Форматирование же для document.write() осуществяется другими методами или тегами HTML.
Объект String имеет только одно свойство - length, значением которого является количество символов в строке, содержащейся в объекте. Методы объекта String можно разделить на две категории:
  • методы форматирования HTML-документа;
  • методы обработки строк.
Методы форматирования документа применяются для вывода строк в документ, а методы управления строками - для проверки и изменения содержимого объекта String.
Приведем перечень методов: (буква Ф - методы форматирования, а буква У - управления строками)
Метод Описание
anchor() У Создает именованную метку, т.е. тег из содержимого объекта
big() Ф Заключает строку в контейнер . . . , для отображения крупным шрифтом
blink() Ф Заключает строку в контейнер . . . , чтобы она отображалась мигающей.
bold() Ф Заключает строку в контейнер . . . , чтобы она отображалась жирным шрифтом.
charAt() У Возвращает символ, находящийся в заданной позиции строки
fixsed() Ф Заключает строку в контейнер . . . , чтобы она отображалась шрифтом постоянной ширины.
fontcolor() Ф Заключает строку в контейнер . . . , чтобы она отображалась определенным цветом.
fontsize() Ф Заключает строку в контейнер . . . , чтобы она отображалась шрифтом определенного размера.
IndexOf() У Возвращает индекс первого заданного символа, найденного в строке.
italics() Ф Заключает строку в контейнер . . . , чтобы она отображалась курсивом.
lastIndexOf() У Возвращает индекс последнего заданного символа, найденного в строке.
link() У Создает тег гиперсвязи . . . и помещает в него содержимое объекта
small() Ф Заключает строку в тег . . . , чтобы она отображалась шрифтом меньшего размера.
strike() Ф Заключает строку в контейнер . . . , чтобы она отображалась зачеркнутой.
sub() Ф Заключает строку в контейнер . . . , чтобы она отображалась как нижний индекс.
substring() У Возвращает подстроку текстовой строки.
sup() Ф Заключает строку в контейнер . . . , чтобы она отображалась как верхний индекс.
toLowerCase() У Преобразует все буквы строки в строчные
toUpperCase() У Преобразует все буквы строки в прописные

Числовые переменные

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

  • умножения (*);
  • деления (/);
  • сложения (+);
  • вычитания (-);
  • увеличения (++);
  • уменьшения (--);
Кроме того, используют операции умножения, деления, сложения и вычитания в сочетании с присваиванием (*=, /=, +=, -=), а также методы объекта Math.

Булевы переменные

Булевы, или логические, переменные содержат только литеральные значкения - true и false - и используются в логических выражениях и операторах.
Для проверки значения булевой переменной используют и операцию логического равенства:
booleanVar == true
хотя в данном случае такая операция проверки излишняя. Для проверки значений, которые не являются истинными, используют знак логического отрицания (!). Например, выражение!booleanVar возвратит значение true, если значение booleanVar равно false. Вместо слов "true" и "false" можно использовать числовые значения "1" и "2", поскольку именно такбулевы значения представлены в памяти компьютера: 1==true и 0==false.

Переменные-массивы

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

ArrayName

Где arrayName - имя массива, а index - числовая переменная или число, задающее позицию элемента в массиве. Например, arrayName является первым элементом этого массива. Индексы элементов массива в языке JavaScript начинаются с нуля. Элементы массива могут быть любого типа, например строками или булевыми переменными. Кроме того, при определенных условиях массив может содержать элементы различных типов данных. В языке JavaScript массивы создаются при помощи:

  • конструктора Array();
  • конструктора Object();
  • конструктора, определенного пользователем.
С помощью конструктора Array() не только создают объект array, но и присваивают начальные значения его элементам. Существует возможность добавлять элементы в массивдинамически - путем присваивания определенных значений элементам массива. Допускается также "пропускать" элементы массива и задавать их в любой последовательности. Для создания нового экземпляра объекта array конструктор Array() необходимо использовать с оператором new. Например, в седующем примере создается массив с именем arrayImg, содержащий два элемента, каждый из которых является объектом String

Var path = "c:/images/" ,
arrayImg = new Array();
arrayImg = path+"img1.gif";
arrayImg = path+"img2.gif";

При использовании конструктора Array() значение свойства length устанавливается автоматически. Поэтому после инициализации элементов массива в приведенном примере выражение arrayImg.length возвращает значение 2. Элементы массива также могут быть заданы как параметры конструктора:

Var path = "c:/images/" ,
arrayImg = new Array(path+"img1.gif", path+"img2.gif");

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

Var myArray = new Array(3.14, true, 85, date(), "word");

Создает массив, элемент myArray которого является числом с плавающей запятой, элемент myArray - булевым значением, элемент myArray - объектом Date.
Размер массива и, следовательно, значение свойства length объекта, создаваемого конструктором Array(), зависят от максимального значения индекса, который применялся для задания элемента массива. Например:

Var myArray = new Array;
myArray = "Это 21 элемент массива";

Двадцать первому элементу массива присваивается строковое значение "Это 21 элемент массива", а значение свойства myArray.length равно 21 независимо от того имеют ли значения элементы массива с индексом меньше 20.
Значение свойства length объекта Array автоматически устанавливается при явном указании количества элементов в конструкторе Array():

MyArray = new Array(10);

Оператор создает массив из 10-ти элементов от 0 до 9. Значение свойства length массива нельзя установить путем присваивания, так как length является свойством только для чтения. Например, чтобы задать значение 10 для свойства length нужно только определить значение последнего, в данном случае 9-го элемента массива:

MyArray = new Array();
myArray = 0;

Кроме того, существует возможность задать значения элементов массива при его конструировании:

MyArray = new Array(0,0,0,0,0,0);

Конструктор Object()

Понятия объект и массив равнозначны, хотя конструкторы Object() и Array() работают по-разному. Конструктору Object() невозможно передать несколько элементов массива, поэтому такое выражение
var myObj = new Object(value1, value2);
работать не будет. Массивы, создаваемые при помощи конструктора Object(), не имеют свойства length. Поэтому, создавая массив таким способом, следует либо организовывать обход этого массива посредством цикла for и подсчитать элементы массива, либо жестко задать длину массива как значение его первого элемента (обычно так поступают моделируя свойство length), а затем обращаться к нему по мере необходимости для проверки размера массива, увеличение значения при добавлении нового элемента, а также в качестве параметра цикла при циклическом считывании или изменения значений элементов. Такой объект часто бывает неприемлем для случаев, когда содержимое массива должно динамически изменяться, поэтому в большинстве случаев пользуются конструктором Array(). Значения индексов массивов, создаваемых в конструкторе Object(), также начинаются с нуля. Для создания массива при помощи конструктора Object() принято использовать запись вида:

Var myObj = new Object();
myObj = 2; // задаем размерность массива
myObj = "Первый элемент";
myObj = "Второй элемент";

Чтобы узнать размер массива, созданного подобным образом, необходимо обратиться к элементу myObj. Значением свойства myObj.length является null, так, как значение не определено.

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

Наконец подошли к самой интересной теме. Дело в том, что в языке JavaScript в отличие от других языков нет функций типа Val() и Str(). Однажды я видел программку на языке JavaScript, автора не буду называть, где при помощи всевозможных преобразований типов данных была попытка запутать программу для "непродвинутых" пользователей. Так вот, нужно запомнить два правила:

  • Преобразование числа в строку символов производится путем сложение числового аргумента со строковым, независимо от перестановки слагаемых. Например если переменная varI=123, то преобразовать переменную и следовательно ее значение в строку символов можно: varI = varI + "" или наоборот: varI = "" + varI. Если сложить не с пустой строкой: varI = varI + "456", то результатом значения переменной varI станет "123456". Это же справедливо и наоборот: varI = "456" + varI - результат: "456123";
  • Преобразование строки в число производится путем вычитания одного операнда из другого и также независимо от их позиции. Например если переменная varI = "123", то преобразовать ее в число можно если вычесть из нее значения 0: varI = varI - 0, и соответственно значение переменной из строкового типа преобразуется в числовой: 123. При перестановки операндов соответственно знак числового значения поменяется на противоположный. В отличие от преобразования числа в строку в действиях вычитания нельзя применять буквенные значения. Так если "JavaScript" + 10 превратится в varI == "JavaScript10", то операция типа varI = "JavaScript" - 10 выдаст значение "NON" - тоесть такая операция не допустима. И еще, при вычитании строкового значения из строкового же также происходит преобразование: varI = "20" - "15", значением переменной varI станет число 5.

Работая в 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.

Алгоритм