1744
.pdf
h=0.5 // Вещественный тип и значение 0.5 h="Шаг" // Строковый тип и значение «Шаг»
2.4. Операторы вывода информации
Язык сценариев поддерживает два способа вывода информации:
Метод alert.
Метод document.write.
Рассмотрим эти способы поподробнее.
2.4.1.Метод alert
Спомощью метода alert можно отображать на экране браузера небольшие по размеру сообщения эти сообщения появляются в диалоговом окне, содержащем кнопку «OK».
Пример
<html>
<script language="JavaScript"> alert('Первое знакомство \n с JavaScript') </script>
</html>
На рис.1 показано, как будет выглядеть результат работы
сценария.
Рис. 1. Вид диалогового окна
ссообщением
2.4.2.Метод document.write
Данный метод предоставляется объектом document и позволяет отобразить любое количество выражений в окне документа. Можно определить любое JavaScript-выражение методом write, включая числовое, строковое или логическое.
10
Данный метод имеет синтаксис: document.write(выражение1 [,выражение2, ... ,выражениеN])
Пример
<script language="JavaScript"> document.write('Первое знакомство с JavaScript') </script>
На рис.2 показано, как будет выглядеть результат работы сценария.
Рис. 2. Вид Web-страницы в окне браузера
Выводимая строка может содержать теги языка HTML. В этом случае браузер выведет данную строку точно так же, как если бы она была размещена непосредственно в HTML - документе.
Пример
<script language="JavaScript"> document.write('<H2><I>Первое знакомство с JavaScript </I>
</H2>')
</script>
На рис.3 показано, как будет выглядеть результат работы сценария.
Рис. 3. Вид Web-страницы в окне браузера
Вывод информации с помощью метода document.write завершается после последнего символа строки. Последующий вывод данным методом начинает отображение со следующей позиции - символ "перевод строки" не выводится.
11
Пример
<script language="JavaScript"> document.write('Строка 1') document.write('Строка 2') </script>
На рис.4 показано, как будет выглядеть результат работы сценария.
Рис. 4. Вид Web-страницы в окне браузера
Для перехода на новую строку можно использовать тег <P> или тег <BR>, которые включаются в состав выводимой строки.
Рис. 5. Вид Web-страницы в окне браузера
Пример
<script language="JavaScript"> document.write('Строка 1<BR>') document.write('Строка 2<BR>') </script>
На рис.5 показано, как будет выглядеть результат работы сценария.
При выводе строк их можно объединять между собой и со строковыми переменными с помощью операции (+).
Пример
<script language = "JavaScript"> var s
s = prompt('Введите фамилию: ', '') var s1
s1 = prompt('Введите имя:','') document.write(s + ' ' + s1 + '.' )
</script>
На рис.6 показано, как будет выглядеть результат работы сценария.
12
Рис. 6. Вид Web-страницы в окне браузера
В этом примере вводятся с помощью окон ввода фамилия и имя и организуется вывод предложения, состоящего из этих слов с пробелом между ними и знаком «.» в конце.
В заключение рассмотрения основных способов вывода информации отметим, что для сохранения содержимого страницы вызов метода document.write должен располагаться между основными тегами, описывающими содержимое страницы в секции <BODY> . . .
</BODY>.
2.5. Операторы ввода информации
Язык сценариев поддерживает два способа ввода информации:
Метод confirm.
Метод prompt.
Рассмотрим эти способы подробнее.
2.5.1. Метод confirm
Метод confirm отображает диалоговое окно, содержащее указанное сообщение и две кнопки – «OK» и «Cancel». Нажатие кнопки «OK» возвращает значение true, а кнопки «Cancel» – значение false. Данный метод используется для получения подтверждений от пользователя либо другой информации, которая может быть представлена булевым значением true/false.
Пример
<script language = "JavaScript">
if (confirm ('Хотите перейти по гиперссылке?')) document.write('Пepexoд по гиперссылке')
else
document.write('Отменa перехода по гиперссылке') </script>
13
На рис.7 показано, как будет выглядеть результат работы сценария.
Рис. 7. Вид диалогового окна
В данном примере отображается диалоговая панель с вопросом «Хотите перейти по гиперссылке?». При нажатии кнопки «OK» (в этом случае метод confirm возвращает значение true) выводится сообщение в окно браузера «Переход по гиперссылке». При нажатии кнопки «Cancel» (в этом случае метод confirm возвращает значение false) выводится сообщение в окно браузера: «Отмена перехода по гиперссылке».
2.5.2. Метод prompt
Метод prompt отображает диалоговое окно, содержащее сообщение и поле для ввода текста, а также кнопки «OK» и «Cancel». При нажатии кнопки «OK» метод prompt возвращает содержимое строки ввода, при нажатии кнопки «Cancel» – значение null. Метод prompt имеет синтаксис:
prompt(Сообщение, [Поле_ввода])
Параметр Сообщение является любой строкой (отображаемой как сообщение) или свойством существующего объекта.
Параметр Поле_ввода является строкой, числом или свойством существующего объекта, представляющим собой значение, вводимое в поле по умолчанию. Этот параметр может быть и пустой строкой "" (в диалоговом окне в строке ввода отображается пустая строка) или вообще отсутствовать (в диалоговом окне в строке ввода отображается значение undefined).
Пример
<script language = "JavaScript"> var s
s = prompt('Введите Ваше имя','') document.write(s)
</script>
14
На рис.8 показано, как будет выглядеть результат работы сценария.
Рис. 8. Вид диалогового окна
Здесь пользователь получает сообщение о вводе своего имени («Введите Ваше имя»), значением по умолчанию в строке ввода является пустая строка. Введенное имя сохраняется в переменной s и отображается в окне браузера.
2.6. Оператор присваивания
Оператор присваивания имеет следующий синтаксис: Имя переменной = выражение
Переменные в выражениях должны быть инициализированы либо в операторе var, либо оператором присваивания. Если при вычислении выражения встречается неинициализированная или вообще неопределенная переменная, то интерпретатор генерирует ошибку "undefined variable" (переменная не определена).
Для построения выражений применяются следующие операторы, соответствующие типу выражения:
Арифметические.
Логические.
Строковые.
Рассмотрим эти операторы подробнее.
2.6.1. Арифметические операторы
Арифметические операторы служат для вычисления арифметических операций над числовыми значениями (константами и переменными). К ним относятся:
стандартные арифметические операции «+», «-», «*», «/», «%» (остаток от деления целых чисел);
15
арифметические операторы, совмещенные с операторами присваивания, в которых производятся арифметические действия над левым и правым операндами и результат присваивается переменной, заданной левым операндом (табл.1);
операторы, уменьшающие и увеличивающие значение переменной на 1: А-- и А++.
|
|
|
Таблица 1 |
|
Сокращенные операторы присваивания |
||
|
|
||
Оператор |
Значение выражения |
||
х *= у |
(x *=10) |
х=х*у |
(x=x*10) |
х /= у |
(x/=10) |
х=х/у |
(x=x/10) |
х += у |
(x +=10) |
х = х + у |
(x=x+10) |
х -= у |
(x -=10) |
х = х - у |
(x=x-10) |
х%=у |
(x %=10) |
х = х % у |
(x=x%10) |
Пример |
|
|
|
var v = 5.5 |
// скорость |
|
|
var t = 4 |
// время |
|
|
S = v * t |
// расстояние |
|
|
S = (v++)*t |
// S=(v+1)*t |
|
|
2.6.2. Логические операторы
Для создания логических выражений используются операторы сравнения («>», «>=», «<», «<=», «==» равно, «!=» не равно) и
логические операторы, применяемые к переменным любого типа («&&» логическое И, «||» логическое ИЛИ, «!» логическое НЕ).
2.6.3. Строковые операторы
Строковые операторы используются для создания строковых выражений. В JavaScript существует только один строковый оператор
— оператор конкатенации (соединения) строк (+), если не считать сокращенной формы оператора присваивания со сложением (+=). Этот оператор присоединяет к строковому значению первого операнда строковое значение второго, получая результат, равный соединению строк.
16
Оператор «+» может использоваться со смешанными типами операндов. Все операнды приводятся к строковому типу, если хотя бы один из операндов содержит строковый литерал.
2.7. Преобразование типов данных
Числовые значения, введенные методом prompt, будут восприниматься как строки и поэтому их необходимо перед вычислениями преобразовать в числа. Для этих целей в JavaScript используются следующие функции:
parseInt(Строка, Основание) преобразует строковый тип данных в целочисленный, представленный в системе счисления с указанным основанием;
parseFloat(Строка) преобразует строковый тип данных в числовой с плавающей точкой;
Number(Строка) преобразует строковый тип в числовой. Рассмотрим функции преобразования подробнее.
parseInt анализирует Строку и пытается ее преобразовать в целое
число в указанной системе счисления (основание 10 означает перевод в десятичное число, 8 восьмеричное, 16 – шестнадцатиричное). Если parseInt в указанном основании встречает символ, не являющийся числом, то он пропускает его и все следующие символы и возвращает целочисленное значение, разобранное до точки. ParseInt усекает числа до целочисленных значений.
Если основание не определено или определено как 0, JavaScript принимает следующее:
если Строка начинается с "0x", то основание равно 16 (шестнадцатиричное);
если Строка начинается с "0", то основание равно 8 (восьмиричное);
если Строка начинается с любого другого значения, то основание равно 10 (десятичное);
если первый символ не может быть конвертирован в число, parseInt возвращает значение NaN.
Например, parseInt("0x10") = 16 (первые символы “0x”
обозначают 16-ричную систему); parseInt("010") = 8 (первый символ
“0” обозначает 8-ричную систему); parseInt("010",10) = 10 (указана 10-
ричная система счисления).
17
parseFloat анализирует Строку и пытается ее преобразовать в число с плавающей точкой. Если встреченный им символ отличается от знака (+ или -), цифры (0-9), десятичной точки или экспоненты, то он возвращает значение до этой точки, игнорируя этот символ и все последующие символы.
Если первый символ не может быть конвертирован в число, parseFloat возвращает значение NaN (например, parseFloat("0.1zf") = 0.1; parseFloat("smth") = NaN).
Number преобразует строку в число. Для нечисловых типов возвращает значение NaN (например, Number("5")=5; Number("0.5")=0.5; Number("1z")=NaN).
Пример
Необходимо преобразовать предложение '23 февраля' в числовое значение:
<script language="JavaScript"> var x='23 февраля' y=parseInt(x)
alert(y)
</script>
В результате выполнения программы мы увидим значение 23. Нечисловая часть переменной х будет отброшена.
2.8. Математические константы и функции объекта Math
Math один из встроенных объектов языка JavaScript, имеющий в качестве свойств и методов основные математические константы и функции. Свойства объекта Math содержат математические константы, а методы математические функции.
2.8.1.Математические константы
ВJavaScript определены следующие математические константы, являющиеся свойствами объекта Math:
Е основа натуральных логарифмов (примерно 2,718)
LN10 натуральный логарифм 10 (примерно 2,302)
LN2 натуральный логарифм 2 (примерно 0,693)
LOG10E десятичный логарифм Е (примерно 0,434)
LOG2E двоичный логарифм Е (примерно 1,442)
SQRT1_2 1, деленное на квадратный корень из 2 ( 0,707)
18
SQRT2 квадратный корень из 2 (примерно 1,414)
PI число (примерно 3,141)
Пример
Вычислите длину окружности заданного радиуса. <script language="JavaScript">
var R,L
R=prompt('Введите радиус круга','') R=parseFloat(R)
L=Math.PI*R*2
alert(L)
</script>
2.8.2. Математические функции
Математические функции объекта Math приведены в табл. 2.
|
Математические функции |
Таблица 2 |
||
|
|
|
||
|
|
|
|
|
Метод |
Описание |
Синтаксис |
Результат |
|
1 |
2 |
3 |
4 |
|
abs(число) |
Возвращает абсолютное |
Math.abs(-12) |
12 |
|
значение аргумента |
|
|||
|
|
|
|
|
sin(число), |
Стандартные |
|
|
|
тригонометрические |
|
|
|
|
cos(число), |
Math.sin(1/2) |
0.479425538604 |
|
|
функции, аргументы |
|
|||
tan(число) |
|
|
|
|
указываются в радианах |
|
|
|
|
|
|
|
|
|
asin(число), |
Инверсные |
|
|
|
тригонометрические |
|
|
|
|
acos(число), |
Math.asin(1/2) |
0.523598775598 |
|
|
функции, возвращают |
|
|||
atan(число) |
|
|
|
|
значения в радианах |
|
|
|
|
|
|
|
|
|
exp(число) |
Возвращает значение еx |
Math.exp(2) |
7.389056098930 |
|
|
|
|
|
|
log(число) |
Возвращает ln x |
Math.log(1.7) |
0.530628251062 |
|
|
|
|
|
|
pow(основание, |
Возвращает основание в |
Math.pow(3,2) |
9 |
|
степень) |
указанной степени |
|
||
|
|
|
||
|
|
|
|
|
sqrt(число) |
Возвращает квадратный |
Math.sqrt(85) |
9.21954445729 |
|
корень аргумента |
|
|||
|
|
|
|
|
|
|
|
|
|
|
Округляет число до |
Math.ceil(56.4 |
|
|
ceil(число) |
ближайшего большего |
57 |
|
|
678954321) |
|
|||
|
целого |
|
|
|
|
|
|
|
|
19