Клиентский JavaScript. Руководство по Использованию

Глава 5
Операторы

JavaScript поддерживает компактный набор операторов, который Вы можете использовать для реализации интерактивного поведения Web-страниц. В главе дан обзор этих операторов.

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

Любое выражение также является оператором. См. в Главе 3 "Выражения и Операторы" полную информацию об операторах.

Используйте точку с запятой (;) для разделения операторов в коде JavaScript.

См. в книге Клиентский JavaScript. Справочник. детальную информацию об операторах данной главы.

Условные Операторы

Условный оператор это набор команд, выполняемый, если специфицированное true. JavaScript поддерживает два условных оператора : if...else и switch.

Оператор if...else

Оператор if используется для выполнения определенных операторов, если логическое условие true; не обязательный блок else выполняется, если условие false. Оператор if выглядит так:

if (condition) {
   statements1 
}
[else {
   statements2 
} ]

condition это может быть любое выражение JavaScript, которое вычисляется в true или false. Выполняемые операторы это любые операторы JavaScript, включая вложенные if. Если Вы хотите использовать более одного оператора после операторов if или else, Вы обязаны заключать их в фигурные скобки {}.

Не путайте примитивные Boolean-значения true и false со значениями true и false объекта Boolean. Любой объект, значением которого не является undefined или null, включая объект Boolean со значением false, вычисляется в true, когда передается в условный оператор. Например:

var b = new Boolean(false);
if (b) // это условие вычисляется в true

Пример. В следующем примере функция checkData возвращает true, если количество символов в объекте Text равно трем; иначе выводит диалог alert и возвращает false.

function checkData () {
   if (document.form1.threeChar.value.length == 3) {
      return true
   } else {
      alert("Enter exactly three characters. " +       
      document.form1.threeChar.value + " is not valid.")
      return false
   }
}

Оператор switch

Оператор switch позволяет вычислять выражение и пытается найти совпадение значения выражения с оператором label. Если совпадение найдено, программа выполняет ассоциированный оператор. Оператор switch выглядит так:

switch (expression){
   case label : 
      statement;
      break;
   case label : 
      statement;
      break;
   ...
   default : statement;
}

Программа сначала ищет label/метку, совпадающую по значению с выражением, а затем выполняет ассоциированный оператор. Если совпадающий label не найден, программа ищет не обязательный оператор по умолчанию и, если он найден, выполняет ассоциированный оператор. Если оператор по умолчанию/default statement на найден, программа продолжает выполняться с оператора, идущего после конца switch.

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

Пример. В следующем примере, если expr вычисляется в "Bananas", программа находит совпадение с case "Bananas" и выполняет ассоциированный оператор. Если обнаружен break, программа прерывает выполнение блока switch и выполняет оператор, идущий после switch. Если break отсутствует, оператор для case "Cherries" также будет выполнен.

switch (expr) {
   case "Oranges" : 
      document.write("Oranges are $0.59 a pound.<BR>"); 
      break; 
   case "Apples" :
      document.write("Apples are $0.32 a pound.<BR>");
      break;
   case "Bananas" : 
      document.write("Bananas are $0.48 a pound.<BR>"); 
      break; 
   case "Cherries" :
      document.write("Cherries are $3.00 a pound.<BR>");
      break; 
   default :
      document.write("Sorry, we are out of " + i + ".<BR>"); 
}
document.write("Is there anything else you'd like?<BR>");

Операторы циклов

Цикл/loop это набор команд, которые выполняются неоднократно, пока не будет выполнено специфицированное условие. JavaScript поддерживает операторы циклов for, do while, while и label (label сам по себе не является оператором цикла, но часто используется с этими операторами). Кроме того, Вы можете использовать операторы break и continue с операторами циклов.

Еще один оператор, for...in, выполняет операторы циклически, но используется при работе с объектами. См. "Операторы Манипуляций с Объектами".

Оператор for

Оператор for повторяется, пока специфицированное условие не станет false. JavaScript-цикл for похож на аналогичные циклы Java и C. Оператор for выглядит так:

for ([initialExpression]; [condition]; [incrementExpression]) {
   statements
}

При выполнении цикла for происходит следующее:

  1. Выполняется инициализирующее выражение initial-expression, если имеется. Это выражение обычно инициализирует один или более счетчиков цикла, но синтаксис допускает выражения любой сложности.
  2. Выражение condition вычисляется. Если condition дает true, цикл выполняется. Если condition равно false, цикл for прерывается.
  3. Выполняются statements/операторы.
  4. Выполняется выражения обновления incrementExpression, и управление возвращается к шагу 2.

Пример. Эта функция содержит оператор for, подсчитывающий количество выбранных опций в прокручиваемом списке (объекте Select, который позволяет делать множественный выбор). Оператор for объявляет переменную i и инициализирует ее значением 0 (нуль). Если i меньше количества опций объекта Select, выполняется следующий оператор if, а i увеличивается на 1 при каждом прохождении цикла.

<SCRIPT>
function howMany(selectObject) {
   var numberSelected=0
   for (var i=0; i < selectObject.options.length; i++) {
      if (selectObject.options[i].selected==true)
         numberSelected++
   }
   return numberSelected
}
</SCRIPT>
<FORM NAME="selectForm">
<P><B>Choose some music types, then click the button below:</B>
<BR><SELECT NAME="musicTypes" MULTIPLE>
<OPTION SELECTED> R&B
<OPTION> Jazz
<OPTION> Blues
<OPTION> New Age
<OPTION> Classical
<OPTION> Opera
</SELECT>
<P><INPUT TYPE="button" VALUE="How many are selected?"
onClick="alert ('Number of options selected: ' + howMany(document.selectForm.musicTypes))">
</FORM>

Оператор do...while

Оператор do...while повторяется, пока специфицированное выражение не станет false. Оператор do...while выглядит так:

do {
   statement
} while (condition)

statement выполняется как минимум один раз, так как находится перед проверяемым условием. Если condition возвращает true, цикл выполняется еще раз. В конце каждого прохода проверяется условие. Если condition возвращает false, выполнение останавливается и управление передается оператору, идущему после do...while.

Пример. В следующем примере цикл do итерирует как минимум один раз, пока i не станет меньше 5.

do {
   i+=1;
   document.write(i);
} while (i<5);

Оператор while

Оператор while выполняется, пока специфицированное условие вычисляется в true. Оператор while выглядит так:

while (condition) {
   statements
}

Если condition становится false, операторы внутри цикла перестают выполняться и управление передается оператору, идущему после цикла.

Проверка условия/condition выполняется перед началом каждого цикла. Если condition возвращает true, операторы выполняются и условие проверяется снова. Если condition возвращает false, выполнение прекращается и управление передается оператору, идущему после цикла while.

Пример 1. Следующий цикл while итерирует, пока n меньше 3:

n = 0
x = 0
while( n < 3 ) {
   n ++
   x += n
}

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

  • После первого прохода: n = 1 и x = 1
  • После второго прохода: n = 2 и x = 3
  • После третьего прохода: n = 3 и x = 6

После третьего прохода условие n < 3 больше не true, поэтому цикл прерывается.

Пример 2: Бесконечный цикл. Проверяйте, что условие в цикле рано или поздно станет false; иначе цикл никогда не закончится. Операторы следующего цикла while выполняются бесконечно, поскольку condition никогда не станет false:

while (true) {
   alert("Hello, world") }

Оператор label

Оператор label предоставляет оператор с идентификатором, что позволяет обратиться к нему в программе. Например, Вы можете использовать label для идентифицирования цикла, а затем использовать break или continue для указания момента, когда программа должна прервать выполнение цикла или начать новую итерацию.

Синтаксис оператора label примерно такой:

label :
   statement

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

Пример. Здесь label markLoop идентифицирует цикл while.

markLoop:
while (theMark == true)
   doSomething();
}

Оператор break

Оператор break используется для прерывания выполнения цикла, либо операторов switch или label.

  • Когда Вы используете break с операторами while, do-while, for или switch, оператор break немедленно прерывает самый внутренний цикл или switch и передает управление следующему оператору.
  • Когда Вы используете break внутри оператора label, он прерывает этот оператор и передает управление следующему оператору. Если Вы специфицировали label при вызове break, оператор break прерывает специфицированный оператор.

Синтаксис break выглядит так:

1. break
2. break [label]

Первая форма прерывает самый внутренний цикл, switch или label; вторая форма прерывает специфицированный содержащий оператор label.

Пример. Здесь происходит итерация по элементам массива, пока не будет найден индекс элемента, значением которого является theValue:

for (i = 0; i < a.length; i++) {
   if (a[i] = theValue);
      break;
}

Оператор continue

Оператор continue может использоваться для рестарта оператора while, do-while, for или label.

  • В операторах while или for, оператор continue прерывает текущий цикл и начинает новую итерацию (проход) цикла. В отличие от break, continue не прерывает полностью выполнение цикла. В цикле while он перескакивает на condition. В цикле for он перескакивает на increment-expression.
  • В операторе label оператор continue переходит по метке/label, которая идентифицирует оператор label. Этот тип continue рестартует оператор label или продолжает выполнение помеченного цикла со следующей итерации. continue обязан находиться в теле оператора цикла, идентифицированного label, используемым continue.

Синтаксис оператора continue выглядит так:

1. continue
2. continue [label]

Пример 1. здесь цикл while с оператором continue выполняется, если i имеет значение 3. Таким образом, n получает значения 1, 3, 7 и 12.

i = 0
n = 0
while (i < 5) {
   i++
   if (i == 3)
      continue
   n += i
}

Пример 2. Оператор, помеченный checkiandj, содержит оператор, помеченный checkj. Если обнаружен continue, программа прерывает текущую итерацию checkj и начинает следующую. Каждый раз при обнаружении continue оператор checkj реитерирует, пока его условие не возвратит false. Если возвращено false, выполняется остаток оператора checkiandj и checkiandj реитерирует, пока его условие не возвратит false. Если возвращено false, программа продолжает выполнение с оператора, идущего после checkiandj.

Если continue имеет метку checkiandj, программа продолжит выполнение от верха оператора checkiandj.

checkiandj : 
   while (i<4) {
      document.write(i + "<BR>"); 
      i+=1; 
      checkj : 
         while (j>4) {
            document.write(j + "<BR>"); 
            j-=1; 
            if ((j%2)==0);
               continue checkj;
            document.write(j + " is odd.<BR>");
         } 
      document.write("i = " + i + "<br>");
      document.write("j = " + j + "<br>");  
   }

Операторы манипулирования объектами

JavaScript использует операторы for...in и with для работы с объектами.

Оператор for...in

Оператор for...in итерирует специфицированную переменную по всем свойствам объекта. Для каждого отдельного свойства JavaScript выполняет специфицированные операторы. Цикл for...in выглядит так:

for (variable in object) {
   statements }

Пример. Следующая функция принимает в качестве аргументов объект и имя объекта. Затем итерирует по всем свойствам объекта и возвращает строку - список свойств объекта и их значений.

function dump_props(obj, obj_name) {
   var result = ""
   for (var i in obj) {
      result += obj_name + "." + i + " = " + obj[i] + "<BR>"
   }
   result += "<HR>"
   return result
}

Для объекта car со свойствами make и model, result будет:

car.make = Ford
car.model = Mustang

Оператор with

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

Оператор with выглядит так:

with (object){
   statements
}

Пример. Оператор with специфицирует, что объект Math является объектом по умолчанию. Оператор, идущий после оператора with, обращается к свойству PI и методам cos и sin без специфицирования объекта. JavaScript принимает Math как объект для этих свойств.

var a, x, y
var r=10
with (Math) {
   a = PI * r * r
   x = r * cos(PI)
   y = r * sin(PI/2)
}

Комментарии

Комментарии являются заметками автора, разъясняющими действия кода. Комментарии игнорируются интерпретатором. JavaScript поддерживает комментарии в стиле Java:

  • Однострочный комментарии начинается с двойного слэша (//).
  • Многострочный комментарий начинается с /* и заканчивается */

Пример. Вот два комментария:

// Это однострочный комментарий.
/* Это многострочный комментарий. Он может быть любого размера, и
Вы может поместить в него что угодно. */
Оглавление | Назад | Вперед | Индекс

 

Наши ссылки на веб-страницы, можно скопировать html-код ссылки


Книги по математике и физике, программы HTML, компьютерные технологии
Документация HTML, XML, JavaScript на русском языке для разработчиков W3C

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