Мобильная версия

Электронная библиотека

Программисту веб-дизайнеру

Другие материалы

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

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

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

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

  • Условные операторы: if...else и switch
  • Операторы циклов: for, while, do while, label, break и continue (label сам по себе не оператор цикла, но часто используется с этими операторами)
  • Операторы манипулирования объектами: for...in и with
  • Комментарии
  • Любое выражение также является оператором. См. в Главе 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 происходит следующее:

  • Выполняется инициализирующее выражение initial-expression, если имеется. Это выражение обычно инициализирует один или более счетчиков цикла, но синтаксис допускает выражения любой сложности.
  • Выражение condition вычисляется. Если condition дает true, цикл выполняется. Если condition равно false, цикл for прерывается.
  • Выполняются statements/операторы.
  • Выполняется выражения обновления 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:

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

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

    Оглавление | Назад | Вперед | Индекс

    Мобильная версия

    Сайт для компьютера
    http://www.mat.net.ua