Система уроков по JavaScript

Переменные в JavaScript

В сценариях JavaScript можно использовать переменные, адресуясь к ним по имени. Переменные могут быть как глобальные, так и локальные. Глобальные переменные доступны из любого места сценария. Область действия локальных переменных ограничивается функцией, внутри которой эти переменные объявлены. Так же как и в языке программирования Basic, при составлении сценариев JavaScript можно использовать переменные без их предварительного объявления. Исключение из этого правила - локальные переменные, определенные в функциях. Однако рекомендуется объявлять переменные перед их использованием, а также присваивать им начальные значения. Это упрощает отладку сценариев и уменьшает вероятность возникновения ошибок при составлении исходного текста, особенно если одновременно применяются глобальные и локальные переменные.

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

Все переменные в JavaScript объявляются с помощью ключевого слова var, как это показано ниже:

var szHelloMsg;

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

szMsg = "Привет!";

После такого присвоения имя переменной szMsg становится доступным.

При выборе имен переменных необходимо придерживаться следующих простых правил:

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

Список зарезервированных ключевых слов JavaScript приведен ниже:

break    case      catch    class     const    continue  
debugger default   delete   do        else     enum  
export   extends   false    finally   for      function
if       import    in       new       null     return
super    switch    this     throw     true     try
typeof   var       void     while     with

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

Присвоение значения переменным

Значение переменной присваивается при помощи оператора присвоения "=". В качестве примера, ниже объявлена переменная и затем в нее записана текстовая строка:

var szHelloMsg;
szHelloMsg = "Hello, world!";

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

szHelloMsg = 4;

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

Переменной можно присвоить специальное значение null:

szHelloMsg = null;

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

Типы данных в JavaScript

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

Числа

Язык сценариев JavaScript допускает использование чисел в различных форматах. Это целые числа, числа в формате с плавающей десятичной точкой и числа в научной нотации. Целые числа могут быть представлены по основанию 8, 10 или 16. Например:

25        Целое число по основанию 10
0137      Целое число по основанию 8
0xFF      Целое число по основанию 16
386.7     Число с плавающей десятичной точкой
25e5 
или 25E5  Число в научной нотации, равно 2500000

В некоторых случаях арифметические функции могут возвращать так называемое "нечисло", которое называется в JavaScript как NaN (Not a Number). "Нечисло" - это специальное значение, которое не соответствует никакому числу. Оно возникает в тех случаях, когда результат выполнения операции над числами не может быть представлен в виде числа. С помощью функции isNaN можно проверить, является ли значение "нечислом".

Текстовые строки

Текстовая строка - это последовательность символов, заключенных в одинарные или двойные кавычки, например:

"Hello, world!"
""
"12345"
'Это текстовая строка'

Строка "" - пустая. Заметим, что следующие два присвоения не эквивалентны:

szStr=""
szStr1=null

В первом случае в переменной szStr хранится текстовая строка (хотя бы и пустая), во втором - совсем ничего.

Логические данные

Логические данные могут иметь только два значения: true и false. Эти значения никак не соотносятся с числами 1 и 0. Они предназначены главным образом для выполнения операций сравнения, а также для использования в условных операторах.

Данные неопределенного типа

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

var MyVariable;

Если же этой переменной присвоить значение null, то тип переменной изменится - теперь это будет переменная, содержащая значение null:

MyVariable = null;

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

Когда в выражениях встречаются переменные разных типов, интерпретатор JavaScript может автоматически преобразовывать численные данные в текстовые строки. Обратное же преобразование (строк в числа) приходится выполнять с помощью специальных функций, таких как parseInt и parseFloat. Поясним это на примере (листинг 1.9).

Листинг 1.9.

<HTML>
  <HEAD>
    <TITLE>Type conversion sample</TITLE>
  </HEAD>
  <BODY>
    <H1>Type conversion sample</H1>
    <TABLE>
    <SCRIPT LANGUAGE="JavaScript">
    <!--
      var szTextBuf = "";
      szTextBuf = 4 + " - число четыре" + "<BR>";
      szBuf2 = (parseInt("2") + 2) + "&nbsp; - число четыре" + "<BR>";
      document.write(szTextBuf + szBuf2);
    // -->
    </SCRIPT>
    </TABLE>
  </BODY>
</HTML>

Здесь мы объявили переменную szTextBuf и проинициализировали ее пустой строкой. Далее мы присвоили этой строке сумму числа 4 и двух текстовых строк:

szTextBuf = 4 + " - число четыре" + "<BR>";

При вычислении этого выражения значение 4 автоматически преобразовывается в текстовую строку. Дальнейшее суммирование выполняется как слияние (конкатенация) трех текстовых строк. Обратите внимание на символ неразделяющего пробела  , который используется в документах HTML. Если заменить его на обычный пробел, то после конкатенации строк этот пробел исчезнет. В следующей строке преобразовывается текстовая строка "2" в численное значение с помощью функции parseInt, прибавляется к результату преобразования число 2, а затем выполняется конкатенацию с двумя текстовыми строками:

szBuf2 = (parseInt("2")+2)+" - число четыре"+ "<BR>";

В результате переменная szBuf2 будет содержать ту же самую строку, что и переменная szTextBuf.

Операторы языка JavaScript

Унарные операторы

Унарные операторы применяются для изменения знака, выполнения операции дополнения, инкремента и декремента:

-    Изменение знака на противоположный
!    Дополнение. Используется для реверсирования значения 
     логических переменных
++   Увеличение значения переменной. Может применяться как префикс 
     переменной или как ее суффикс
--   Уменьшение значения переменной. Может применяться как префикс 
     переменной или как ее суффикс

Примеры использования унарных операторов:

i=0;      // начальное значение переменной i равно 0
i++;      // значение i равно 1
--i;      // значение i снова равно 0

var j=3;  // значение переменной j равно 3
i = -j;   // значение переменной i равно -3

var fYes = true; // значение переменной fYes равно true
testFlag(!fYes); // функции testFlag передается значение false

Бинарные операторы

Бинарные операторы соединяют два операнда. В языке сценариев JavaScript предусмотрены бинарные операторы для вычитания, сложения, умножения, деления и вычисления остатка деления:

-    Вычитание
+    Сложение
*    Умножение
/    Деление
%    Вычисление остатка от деления

Эти операторы используются таким же образом, что и в языке программирования C, например:

i=0;        // начальное значение переменной i равно 0
i = i + 1;  // значение i равно 1

var j=9;    // значение переменной j равно 9
i = j / 2;  // значение переменной i равно 4
k = j % 2;  // значение переменной i равно 1

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

В сценариях можно применять операторы, выполняющие над битами переменных такие логические операции, как И, ИЛИ, ИСКЛЮЧАЮЩЕЕ ИЛИ, НЕ:

&    И
|    ИЛИ
^    ИСКЛЮЧАЮЩЕЕ ИЛИ
~    НЕ

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

Операторы сдвига

Для выполнения операций сдвига в языке JavaScript предусмотрено три оператора:

>>   Сдвиг в правую сторону
<<   Сдвиг в левую сторону
>>>  Сдвиг в правую сторону с заполнением освобождаемых разрядов нулями

Перед использованием операторов сдвига значение переменной преобразуется в 32-разрядное целое число.

Ниже приведен пример, в котором в переменную nValue записывается значение, полученное в результате сдвига бит числа 4. Сдвиг выполняется на два бита влево:

var nValue;
nValue = 4 << 2;

Операторы отношения

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

>    Левый операнд больше правого
>=   Левый операнд больше или равен правому
<    Левый операнд меньше правого
<=   Левый операнд меньше или равен правому
==   Левый операнд равен правому
!=   Левый операнд не равен правому

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

||   Оператор ИЛИ. Возвращает значение true, 
     когда один из операндов равен true
&&   Оператор И. Возвращает значение true, 
     когда оба операнда равны true

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

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

=    Простое присваивание
+=   Увеличение численного значения или слияние строк
-=   Уменьшение численного значения
*=   Умножение
/=   Деление
%=   Вычисление остатка от деления
>>=  Сдвиг вправо
>>>= Сдвиг вправо с заполнением освобождаемых разрядов нулями
<<=  Сдвиг влево
|=   ИЛИ
&=   И
^=   ИСКЛЮЧАЮЩЕЕ ИЛИ

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

Рассмотрим, например, применение оператора += для увеличения содержимого числовой переменной. Вначале решим эту задачу без использования данного оператора. Ниже объявлена переменная с именем nCounter и присвоено ей начальное значение 1, а затем увеличено это значение на 5:

var nCounter = 1;
nCounter = nCounter + 5;

Теперь сделаем то же самое, но с использованием комбинаций операторов:

var nCounter = 1;
nCounter += 5;

Как видно, второй способ короче первого.

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

nCounter >>= 3;

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

nCounter = nCounter >> 3;

Функции в языке сценариев JavaScript

Можно оформлять фрагменты исходного текста в виде функций, вызывая их по мере необходимости из различных мест сценария JavaScript. Обычно функции определяются в разделе заголовка документа HTML, отмеченного операторами <HEAD> и </HEAD>. Функции должны быть определена перед вызовом, и размещение всех определений функций в разделе заголовка документа HTML гарантирует доступность этих функций при обработке документа.

Общий вид определения функции представлен ниже:

function имя([параметр 1] [,параметр 2] [...,параметр N])
{
  . . .
  строки тела функции
  . . .
  [return значение]
}

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

С помощью ключевого слова return функция может вернуть значение.

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