Рефераты. Разработка web сайта на основе HTML с использованием JavaScript

Давайте рассмотрим наиболее часто используемые операции.

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

Арифметические операции - это всем известные математические действия:

а сложение (+);

1 + 3 = 4 а вычитание (-);

2-1 = 4 Q деление (/);

4/2 = 2 а умножение (*);

2*2 = 4 а остаток от деления (%).

9   %   5   =   4

Это были операции с двумя операндами.

Единственная арифметическая операция, нуждающаяся в пояснении, - остаток от деления. То есть 9 делится на 5 с остатком 4. Иногда эту операцию также называют взятием по модулю. При использовании целых чисел результат также будет представлять собой целое число. Но если речь идет о действительных числах (с плавающей точкой, не целых), в результате получится действительное число. Например:

5.5   %   2.2   =   1.1

Будьте внимательны при использовании этих операций, поскольку при некорректном их выполнении они могут привести к результатам NaN (несуществующее число) или Infinity (бесконечность). Примером такой проблемной операции является деление на нуль.

Примеры сценариев JavaScript

Далее описывается несколько примеров использования арифметических операций. Здесь приводится только содержимое блока SCRIPT. Все примеры созданы на основе шаблона.

Пример. Операция сложения (+) -.

<script language="JavaScript">

<!-- Маскируемся!

var а = 6, b = 4;

alert(a + b);

//  Снимаем маскировку.   -->

</script>

Пример. Операция вычитания (-) -.

<script language="JavaScript">

<!-- Маскируемся!

var а = 6, b = 4;

alert(a - b);

// Снимаем маскировку. -->

</script>

Рис. 6.2. Использование операции вычитания

Пример. Операция деления (/) -.

<script language="JavaScript"> <!-- Маскируемся! var a = 6, b = 3; alert(a / b);

Операции сравнения

Операции сравнения используются для сопоставления выражений. К ним относятся следующие операции:

а меньше (<);

5          <  6

а меньше или равно (<=);

6   <=   6  или  6  <=  7
а больше (>);

7   >  4

а больше или равно (>=);

5   >=   5  или  5   >=   4

а равно (==);

5   ==   5

а не равно (!=).

5   !=   3

Это были операции с двумя операндами.

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

Логические операции

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

Далее перечислены три логические операции:

а логическое И (and);

&& а логическое ИЛИ (ог);

I I а логическое НЕ (not).

i

Логическое И и логическое ИЛИ - операции с двумя операндами, а логическое НЕ - операция с одним операндом. Они позволяют свести воедино результаты сравнений нескольких переменных.

Логическое И (&&) означает, что обе части выражения должны быть истинны. В качестве примера из жизни можно взять мысли водителя перед нажатием на педаль тормоза: машина едет слишком быстро && нужно затормозить.

Логическое ИЛИ (II) означает, что, по крайней мере, одна часть выражения должна быть истинной. Снова представим себе мысли водителя перед тем, как он включает фары: темнеет I I плохая видимость.

Логическое НЕ изменяет значение истина/ложь на обратное. Например, фары включают, когда ! светлеет (то есть когда темнеет).

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

Операции с одним операндом

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

а префиксное и постфиксное возрастание (increment);

++

а префиксное и постфиксное уменьшение (decrement);

а унарный плюс;

+ а унарный минус.

Унарный минус изменяет знак выражения на противоположный. Из всех четырех операций это самая простая. Кроме того, унарный плюс используется не для смены знака, а для преобразования операнда в число (например, если это была строка).

Префиксное/постфиксное возрастание/уменьшение позволяет увеличить или уменьшить значение переменной на единицу. Однако результаты выполнения этих операций зависят от того, префиксная это операция или постфиксная.

Результат использования префиксной операции проще предугадать: если а = 5, то++а + 2 = 8, потому что значение переменной а было увеличено на единицу, прежде чем к нему прибавили число 2. В то же время

--а + 2  =  6,

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

Постфиксные операции действуют иначе, поскольку возрастание или убывание производится только после использования старого значения в выражении. Таким образом, если а = 5, то а++ + 2 = 7, потому что увеличение на единицу будет выполнено после вычисления значения выражения. Это справедливо и для следующего выражения:

а--  + 2  =  6,

потому что уменьшение переменной а на единицу будет выполнено после использования в выражении прежнего значения.

Создание сценариев с помощью функций и событий


До сих пор ваши сценарии JavaScript состояли из операторов, выполняемых по
следовательно - от первого до завершающего. Это оптимальное решение для про
стых сценариев, но в большинстве случаев при загрузке страницы выполнять сце
нарий целиком не нужно. Например, вы хотите, чтобы несколько операторов были
задействованы вначале, а остальные - в какой-либо другой момент. Именно тогда
вам потребуются функции.                            %

В данной главе рассматриваются следующие вопросы:

а определение функции;

а применение функций;

а использование событий для вызова функций;

а обмен информацией;

а оператор return.

Что такое функция

Функция (function) - это группа операторов, предназначенных для определенной цели и объединенных под общим именем. Функция имеет следующий вид:

function имяфункции()

{

операторы; }

В начале функции помещается слово function, за которым указывается ее имя (например, yourMessage). После имени ставятся круглые скобки (your-Message () ). Их отсутствие приводит к ошибке.

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

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

У каждой функции должно быть имя, причем имена функций, используемых на одной странице, не должны повторяться. Функция запускается (активизируется или вызывается) с Web-страницы.

Ваша первая функция

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

1.   Откройте HTML-шаблон в текстовом редакторе.

2.   Напечатайте в блоке SCRIPT слово function и дайте функции имя, например
yourMessage (не забудьте о круглых скобках в конце строки):

<script language=" JavaScript ">

<          ! - - Маскируемся !
function yourMessage ()

// Снимаем маскировку. --> </script>

3.          Затем добавьте пару фигурных скобок:

<script language=" JavaScript ">

<          ! - - Маскируемся !
function yourMessage ()

// Снимаем маскировку. --> </script>

Предупреждение Помните, что в начале ставится открывающая фигурная скобка ({), а в конце - закрывающая (}). Распространенная ошибка новичков заключается в том, что они питают скобки местами, в результате чего сценарий не работает.

4.          Далее добавьте простой оператор:

<script language="JavaScript">

<!-- Маскируемся!

function yourMessage()

{

alert("Ваша первая функция!");

}

// Снимаем маскировку. -->

</script>

5.          Сохраните результат, откройте его в браузере и посмотрите, что получилось.

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

Функции в языке JavaScript могут вызываться несколькими способами. Самый простой, хотя и наименее эффективный - указание имени функции непосредственно в блоке SCRIPT:

<script language="JavaScript"> <!-- Маскируемся!

yourMessage();

function yourMessage()

{

alert("Ваша первая функция!");

}

// Снимаем маскировку. -->

</script>

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

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

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

События

Необходимо сделать так, чтобы при вызове функций всю работу вместо вас выполняли события. JavaScript - язык, управляемый событиями (event-driven). To есть все происходящее в нем является результатом события или вызывает какое-либо событие. Открытие новой страницы в браузере, перемещение курсора, щелчок мыши - все это относится к событиям. В этой книге вам встретятся четыре их вида:

Страницы: 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18



2012 © Все права защищены
При использовании материалов активная ссылка на источник обязательна.