Глаза страшат, а руки делают

ЧАСТЬ ВТОРАЯ


30. Операторы JavaScript

  • классификация операторов;
  • неуправляющие инструкции;
  • управляющие инструкции;
  • арифметические операторы;
  • операторы сравнения;
  • логические операторы;
  • побитовые операторы;
  • операторы присвоения.

Классификация операторов

Поскольку JavaScript — язык с весьма расплывчатой классификацией элементов (а что вы хотите, если все — потомки одного-единственного Объект-Объектыча, «Рюриковичи мы»), предложенная мной не будет, так сказать, канонической (ибо о каком каноне может идти речь в этом бесклассовом объектно-ориентированном коммунизме?). Кое-какие намётки (разные) я находил в разных справочниках, что-то из них мне понравилось; кое-что додумал сам. Но хотя «полки» и самодельные, постараюсь сработать их на совесть.

Предлагаю следующую классификацию.

1. Неуправляющие инструкции

Интерпретирующие операторы. Указывают на то, как JavaScript должен интерпретировать помеченное ими слово или выражение, но при этом не вызывают никаких действий.

2. Управляющие инструкции

Запускают (либо прерывают) циклы или организуют ветвление, то есть управляют выполнением программы.

3. Арифметические операторы

Выполняют арифметические действия с числами, работают и со строками, но иногда немного по-другому.

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

Сравнивают величину и тип операндов, возвращают булево значение.

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

Выполняют логическое сравнение операндов (И, ИЛИ, НЕ)

6. Побитовые операторы

Рассматривают каждый операнд не как число, а как набор из 32 битов (0 и 1). Выполняют побитовые логические операции и операции сдвига битов.

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

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

Неуправляющие инструкции

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

Оператор

Описание

comment

Авторский комментарий, объясняющий работу скрипта. Комментарии игнорируются интерпретатором.

const

Объявляет и инициализирует константу.

this

Обращается к текущему объекту в обработчиках событий и функциях-конструкторах.

var

Объявляет переменную и, по выбору, может инициализировать её.


comment

Синтаксис

// Однострочный комментарий.

/* многострочный
комментарий. */

const

Синтаксис

const имя_константы = "значение";

Определитель константы. С помощью ключевого слова const можно создавать именованные константы «только для чтения». Синтаксис имени константы такой же, что и у имени переменной: оно обязано начинаться с буквы или символа подчёркивания и может содержать символы алфавита, числа и символ подчёркивания.

const prefix = "+7(812)";

Константа не может изменить значение путём нового присвоения и не может быть переобъявлена в процессе выполнения скрипта.

Правила видимости для констант те же, что и для переменных, за исключением того, что ключевое слово const необходимо всегда, даже для глобальных констант. Если ключевое слово отсутствует, она интерпретмруется как переменная.

Нельзя объявить константу с тем же именем, что и у функции или переменной, в той же области видимости, что и функция (или переменная).

// Это вызовет ошибку
function f{};
const f = 5;

// И это вызовет ошибку
function f{
const g = 5;
var g; 
}

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

this

Ключевое слово, которое относится к текущему объекту. Мы эпизодически рассматривали его использование, например, в функциях-конструкторах.

Обычно оно применяется в двух случаях:

1. В обработчике события этим словом передаётся ссылка на текущий элемент:

<div style ="color: red" onClick="if(this.style.color=='red') {this.style.color='blue'} else {this.style.color='red'}">

2. Внутри конструктора объекта ключевое слово относится непосредственно к объекту и позволет задать значения его свойствам (даже в процессе создания самих свойств):

function Hash(key, name) {
    this.key = new Array;
    this.name = new Array;
}

var

Синтаксис (в квадратных скобках необязательные элементы)

[var] имя_переменной [= "значение"];

Напомню, что при объявлении переменной внутри функции слово var обязательно.

Ограничения в написании имён переменных см. в уроке 1

Управляющие инструкции

Оператор

Описание

break

Прерывает текущий цикл while или for либо условный оператор switch и передаёт управление инструкции, идущей после прерванного процесса.

continue

Прерывает выполнение блока операторов while или for и продолжает выполнение цикла со следующей итерации.

do...while

Выполняет специфицированные операторы, пока проверяемое условие не станет false. Этот блок операторов выполняется минимум один раз.

export

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

for

Создаёт цикл, который состоит из трёх необязательных выражений в скобках, разделённых символом (;), и блока операторов.

for...in

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

function

Объявляет функцию со специфицированными параметрами. В качестве параметров принимаются строки, числа и объекты.

if...else

Выполняет блок операторов, если специфицированное условие true. Если условие false, может быть выполнен другой набор операторов.

import

Даёт скрипту возможность импортировать свойства, функции и объекты из маркированного скрипта, который экспортирует эту информацию.

label

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

return

Специфицирует значение, возвращаемое функцией.

switch

Позволяет программе вычислять выражение и пытается сопоставить значение выражение с лэйблом case.

while

Создаёт цикл, который вычисляет выражение и, если оно true, выполняет блок операторов. Затем цикл повторяется, пока специфицированное условие true.

with

Устанавливает объект по умолчанию для набора операторов.


break

Синтаксис

break [label]

Останавливает текущий цикл и передаёт управление следующей инструкции сценария после данного цикла. Область выполнения break — его собственный цикл.

Дополнение

Во вложенных циклах для корректной остановки одного из них необходимо воспользоваться дополнительным оператором label (см. ниже).

continue

Синтаксис

continue [label]

Останавливает текущую итерацию цикла и возвращает управление к вершине цикла для следующей итерации.

Дополнение

Во вложенных циклах для корректного перехода необходимо воспользоваться дополнительным оператором label (см. ниже).

do...while

Синтаксис

do {инструкции} while (условие)

Выполняет инструкции, определённые в цикле, пока условие true. Поскольку условие проверяется в конце цикла, инструкции внутри цикла выполняются по крайней мере 1 раз. Обязательно, чтобы выражение, которое составляет условие, было изменяемо и конечно (по принципу «в то время как» или «до тех пор, пока»). Иначе происходит бесконечный цикл.

Пример цикла do…while, генерирующего таблицу умножения от 1 до 10:

var i = 1, j;
document.write("<table border='1' cellspacing='0' cellpadding='2' align='center'>")
do
{
document.write("<tr>")
    j = 1
    do
    {
document.write("<td>" + j + "&times;" + i + "=" + (i * j) + "</td>")
    j++
    }
    while (j <= 10)
document.write("</tr>")
i++
}
while (i <= 10)
document.write("</table>")

export

Синтаксис

export имя1, имя2, ..., имяN
export *

Аргументы

имя1, имя2, ..., имяN — список экспортируемых свойств, функций и объектов.

* — экспортировать все свойства, функции и объекты скрипта.

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

Экспортируя свойства, функции или объекты, маркированный скрипт делает эту информацию доступной любому скрипту (маркированному или немаркированному). Получающий скрипт использует для доступа к информации оператор import.

О маркировке скриптов

for

Синтаксис

for ([начальное значение ]; [условие]; [инструкция обновления]) {инструкции}

Аргументы

начальное значение — выражение (включая присваивание) или объявление переменной. Как правило, используется для инициализации переменной-счетчика. Это условие может объявлять новую переменную при помощи var. Такая переменная не является локальной переменной цикла, она видна во всей области видимости.

условие — выражение, которое вычисляется между итерациями. Если оно является true, то выполняется следующая итерация, иначе — управление переходит дальше, к инструкциям после цикла

инструкция обновления — выражение, которое вычисляется в конце каждой итерации, перед проверкой условия. Обычно используется для увеличения переменной-счетчика.

инструкции — блок или javascript-вызов для выполнения при каждой итерации цикла, пока верно условие.

Обеспечивает выполнение цикла. Обычно используется в тех случаях, когда количество повторений цикла известно заранее.

Следующая инструкция выводит арифметическую прогрессию от 1 до 9:

var i, x = 0;
for (i = 1; i <= 10; i++) {x += i; document.write(x + " ");}

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

var j = 1, y = 0;
for (; ; j++) {y += j; document.write(y + " "); if (j == 10) break;}

Обратите внимание

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

for...in

Синтаксис

for ((переменная in объект)) {инструкции}

Аргументы

переменная — переменная счётчика, как и для цикла for.

объект — любой объект JavaScript, который мы хотим «выпотрошить».

инструкции — код для тех действий, которые мы хотим произвести с объектом.

Разновидность цикла for, которая может извлекать имена и значения свойств объектов или элементов массивов.

Оператор for…in выполняется следующим образом:

1. Переменной присваивается имя очередного свойства объекта или очередного элемента массива (это зависит от того, является значением выражения объект или массив).

2. Выполняется оператор.

3. Управление передается этапу 1.

При итерации массива значения его элементов присваиваются переменной по порядку от первого до последнего. Но при итерации свойств объекта порядок присвоения значений не определён. Гарантируется только то, что все они будут просмотрены.

Вывод простейшего меню, итерация массива пунктов меню:

var mnu = ["пункт 1", "пункт 2", "пункт 3"]
var lnk = ["index.html", "index2.html", "index3.html"]
document.write("<table width='100' border='1'>")
for (var i in mnu)
{
    document.write("<tr><td align='center'><a href='" + lnk[i] + "'>" + mnu[i] + "</a></td></tr>")
}
document.write("</table>")

Следующий код создает новый объект ob, а затем последовательно выводит все его свойства на экран обозревателя:

var ob = {"а" : "Архангельск", "б" : "Баку", "в" : "Воронеж"};
for (var key in ob)
    document.write(key + ": " + ob[key] + "<br>");

На экране появится текст:

function

Конструктор Function

Синтаксис

new Function ([аргумент1] [, аргумент2] [..., аргументN,] тело)

Аргументы

аргумент1, аргумент2, ... аргументN — имена, используемые функцией в качестве имён формальных аргументов. Каждое имя обязано быть строкой, соответствующей верному идентификатору JavaScript (те же правила, что и для имён переменных); например, "x" или "theValue"

тело — строка операторов JavaScript, образующих определение функции.

Оператор function

Синтаксис

function (имя([аргумент1] [, аргумент2] [..., аргументN]) {
    инструкции
}

Аргументы

имя — имя функции.

аргумент1, аргумент2, ... аргументN — имена аргументов, передаваемых функции. Функция может иметь до 255 аргументов.

инструкции — операторы, образующие тело функции.

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

if

Синтаксис

if (условие)
{инструкции, если условие true}

Аргументы

условие — выражение, которое задаёт условие для выполнения инструкций, оценивается как true или false.

инструкции — код для тех действий, которые выполняются, если условие — true.

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

if...else

Синтаксис

if (условие)
{инструкции, если условие true}
else
{инструкции, если условие false}

Аргументы

условие — выражение, которое задаёт условие для выполнения инструкций, оценивается как true или false.

инструкции1 — код для тех действий, которые выполняются, если условие — true.

else — ключевое слово для перехода на инструкции2, если условие — false.

инструкции2 — код для тех действий, которые выполняются, если условие — false.

Условная инструкция, которая предусматривает два пути выполнения в зависимости от результата проверки условия. Внутрь инструкции if…else можно вкладывать другие инструкции if или if…else.

Синтаксис вложенных инструкций (обратите внимание на последовательность фигурных скобок)

if (условие1)
{
    if (условие2 [если условие1 true])
    {
        инструкции, если условие2 true
    }
    else
    {
        инструкции, если условие2 false
    }
}
else
{
    if (условие3 [если условие1 false])
    {
        инструкции, если условие3 true
    }
    else
    {
        инструкции, если условие3 false
    }
}

import

Синтаксис

import имяОбъекта.имя1, имяОбъекта.имя2, ..., имяОбъекта.имяN
import имяОбъекта.*

Аргументы

имяОбъекта — имя файла скрипта-экспортёра.

имя1, имя2, ..., имяN — список экспортируемых свойств, функций и объектов указанного файла.

* — экспортировать все свойства, функции и объекты указанного файла.

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

Экспортируя свойства, функции или объекты, маркированный скрипт делает эту информацию доступной любому скрипту (маркированному или немаркированному). Получающий скрипт использует для доступа к информации оператор import.

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

О маркировке скриптов

label

Синтаксис

// Объявление:
LabelName:
цикл

// Вызов:
оператор LabelName

Аргументы

LabelName — оригинальное имя (подобное именам переменных и функций).

цикл — инструкция for, for…in, while к которой относится метка.

оператор — break или continue, после которого программа должна перейти на помеченную инструкцию.

Идентификатор (метка), который можно использовать с break или continue для указания места, с которого программа должна продолжить выполнение. Ставится перед циклом, к которому относится.

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

В первом из следующих примеров оператор break отсылает к внешнему циклу, во втором — к вложенному.

outerLoop:
for (var i = 0; i <= maxValue1; i++) {
    for (var j = 0; j <= maxValue2; j++) {
        if (i == magic1 && j == magic2) {
            break outerLoop
        }
    }
}

for (var i = 0; i <= maxValue1; i++) {
    innerLoop:
    for (var j = 0; j <= maxValue2; j++) {
        if (i == magic1 && j == magic2) {
            break innerLoop
        }
    }
}

Любой оператор или блок операторов в JavaScript может иметь любое количество меток.

Меткой может быть любое имя, которое не совпадает с зарезервированным словом.

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

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

Призыв к принципиальному отказу от этой инструкции напоминает мне призыв к прин­ци­пи­аль­но­му отказу от табличной вёрстки. Думаю, всё хорошо на своём месте.

return

Синтаксис

finction имяФункции ([аргументы]) {
// тело функции
...
...
...
return значение
}

Аргумент

значение — значение, которое должна возвратить функция.

Применяется в теле функции. Специфицирует значение, возвращаемое функцией.

switch

Синтаксис

switch (выражение) {
    case вариант1:
        код
        [break]
    case вариант2:
        код
        [break]
    [default:
        код]
}

Аргументы

выражение — контрольное, тестовое значение, с которым будут сравниваться варианты.

вариант1, вариант2 — выражения для сравнения с контрольным.

Оператор-переключатель. Сопоставляет значение выражения с меткой case.

while

Синтаксис

while (условие)
{код}

Аргументы

условие — условие, в течение которого выполняются следующие инструкции.

код — инструкции, которые выполняются, пока действует данное условие.

Создаёт цикл, который вычисляет выражение и, если оно true, выполняет блок операторов. Затем цикл повторяется, пока заданное условие true.

with

Синтаксис

with (объект)
{инструкция1; инструкция2; [...;] инструкцияN}

Аргументы

объект — объект, на который назначаются инструкции.

инструкции — назначения на объект (например, установка его свойств).

Обратите внимание

Инструкции перечисляются через точки с запятыми.

Устанавливает объект по умолчанию для набора операторов. Используется для сокращения записи кода. Вместо

imgslide[0].src = "lsn_js10.files/plakha.jpg"
imgslide[0].width = "225"
imgslide[0].height = "300"

можно записать

with (imgslide[0])
{src = "lsn_js10.files/plakha.jpg"; width = "225"; height = "300"}

Арифметические операторы

Оператор

Название

Пример

+

Сложение

X+Y

-

Вычитание

X-Y

*

Умножение

X*Y

/

Деление

X/Y

%

Деление по модулю

X%Y

++

Увеличение на 1

X++

--

Уменьшение на 1

Y--

Некоторые особенности оператора сложения

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

  • Если оба операнда — числа, результат — сумма из этих двух чисел;
  • если оба операнда — строки, результат — склеивание этих двух строк;
  • когда один операнд — число, а другой — строка, тип данных номера преобразовывается в строку, и эти две строки склеиваются (то есть приоритет имеет строка).

Примечание

Чтобы преобразовать строку в число, используйте методы parseInt() или parseFloat().

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

Оператор

Название

Пример

==

Равно

X == Y

!=

Не равно

X != Y

>

Больше, чем

X > Y

>=

Больше или равно

X >= Y

<

Меньше, чем

X < Y

<=

Меньше или равно

X <= Y

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

Оператор

Название

Пример

!

Отрицание (НЕ)

!X

&&

И

X && Y

||

ИЛИ

X || Y

Побитовые (поразрядные) операторы

Побитовые (поразрядные) операторы применяются к целочисленным значениям и возвращают целочисленные значения. При их выполнении операнды предварительно приводятся к двоичной форме представления, в которой число является последовательностью из нулей и единиц длиной 32. Эти нули и единицы называются двоичными разрядами или битами. Оператор производит некоторое действие над битами, в результате чего получается новая последовательность битов. В конце концов она преобразуется в обычное целое число — результат действия побитового оператора.

Список побитовых операторов

Оператор

Название

Левый операнд

Правый операнд

&

побитовое И

целое число

целое число

|

побитовое ИЛИ

целое число

целое число

^

побитовое исключающее ИЛИ

целое число

целое число

~

побитовое НЕ

целое число

<<

смещение влево

целое число

количество битов, на которое производится смещение

>>

смещение вправо

целое число

количество битов, на которое производится смещение

>>>

заполнение нулями при смещении вправо

целое число

количество битов, на которое производится смещение


Операторы &, |, ^ и ~ похожи на логические операторы, но они работают не с логическими значениями,а с битами. Оператор ~ изменяет значение бита на противоположное: 0 на 1, а 1 — на 0. У него только один операнд, который ставится справа от него.

В следующей таблице поясняется, как работают операторы &, |, ^.

X

Y

X&Y

X | Y

X^Y

1

1

1

1

0

1

0

0

1

1

0

1

0

1

1

0

0

0

0

0


Например, возьмём значения X == 2 и Y == 3.

В двоичном представлении 2 — это 10, а 3 — это 11.

2&3

Результат: 2

Правые разряды — 0&1 — дадут 0, левые — 1&1 — дадут 1.

Результат — 10, то есть, в десятичной записи, — 2.

2|3

Результат: 3.

Правые разряды — 0|1 — дадут 1, левые — 1|1 — тоже дадут 1.

Результат — 11, то есть, в десятичной записи, — 3.

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

3<<2

Результат: 12

Cмещение влево на два бита двоичного числа 11 (десятичное 3) дает 1100, что в десятичной форме представляется как 12.

6>>2

Результат: 1

Число 6 в двоичной форме — 110; смещение его вправо на два бита дает 1 как в двоичной, так и в десятичной форме.

6>>>2

Результат: 001

То же самое, только с заполнением нулями. Приведение к этому видк может быть полезно при побитовом сравнении операндов с разным количеством знаков.

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

ОСНОВНОЙ

Оператор

Пример

=

var x = "моя строка"

ДОПОЛНИТЕЛЬНЫЕ

Оператор

Пример

Эквивалентное выражение

+=

X+=Y

X = X + Y

-=

X-=Y

X = X - Y

*=

X*=Y

X = X * Y

/=

X/=Y

X = X / Y

%=

X%=Y

X = X % Y


Итак, мы узнали:

о некоторых незнакомых операторах.

А также:

привели в порядок старые знания.


К третьей части >>


 006478