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

Справочный материал по основным языкам программирования и верстки сайтов.

Готовая методика создания простых и сложных динамичных сайтов, с использованием PHP и MySQL.

Использование веб-редактора Adobe Dreamweaver в разработке сайтов.

Использование графических редакторов Adobe Flash, Adobe Photoshop, Adobe Fireworks в подготовке веб-графики.

Разработка веб-сайтов под "ключ".

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

О типах данных. Операторы. Операторы условного перехода

О типах данных

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

Тип данных это некоторое ограничениена множество возможных значений. Выделяя (ограничивая) каким-либо образом некоторое множество значений, мы определяем тип данных.

Таблица. Типы данных
Тип данных Примеры Описание значений
Строковой или символьный
(String)
"Привет всем!"
'Сегодня 5.10.2008'
Последовательность символов заключенная в кавычки, двойные или одинарные
Числовой
(Number)
3.14
-264
+5.5

Число, последовательность цифр, перед которой может быть указан знак числа(+или-); перед положительными цифрами не обязательно ставит знак "+"; целая и дробная части чисел разделяются точкой. Число записывается без кавычек.

Логический булевый
(Boolean)
true
false
Этот тип данных имеет только два возможных значения:
true-истина, да
false-ложь, нет
Null null

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

Undefined undefined

Этот тип данных имеет одно значение-undefined, указывающее на то, что переменной не присвоено никакое значение.

Объект (Object)   Програмный объект, определяемый своими свойствами. В частности массив тоже является объектом.
Функция
(Function)
 

Определение функции програмного кода, выполнение которого может возвращать некоторые значения.

Обратим внимание на различия в представлении числовых и строковых (символьных) данных. Числа, как данные числового типа всегда представляются без кавычек. Строковые данные заключаются в кавычки двойные или одинарные.

Строка "", не содержащая ни одного символа (даже пробела), называется пустой. При этом строка, содержащая хотя бы один пробел, например " ", не пуста.

Данные логического типа могут иметь одно из двух значений: true или false. Эти значения записываются без кавычек. Значение true oзначает истину (да), false — ложь (нет).

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

Для приведения данных к заданному типу в JavaScript предусмотрены встроенные функции конвертирования типов или приведения к заданному типу.

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

Эта функция работает следующим образом:

  • если выражение есть число, то возвращается это число;
  • если выражение есть логическая величина, то возвращается 1 или 0 в зависимости от ее значения(если true, то 1, если false, то 0);
  • если выражение есть строка, то функция пытается преобразовать ее число как описанные далее функции parseInt() и parseFloat();
  • если выражение есть undefined(не определено), то результатом является NaN(не число)

Для преобразования строк в числа предусмотрены встроенные функции parseInt() и parseFloat().

Функция parseInt(строка, состояние) преобразует указанную в параметре строку в целое число в системе счисления по заданному основанию(8, 10 или 16). Если основание не указано, то предполагается 10, т.е. десятичная система счисления.

Функция parseFloat(строка)— преобразует указанную строку в число с плавающей разделительной (десятичной) точкой.

Функция isNaN(значение) — определяет, является ли значение выражения числом.

Функция String(выражение) — приводит данные, получающиеся в результате вычисления выражения, которое указано в качестве параметра, к строковому типу.

Функция Boolean(выражение) — приводит данные, получающиеся в результате вычисления выражения, которое указанно в качестве параметра, к логическому типу.

Функция Array(элемент 0[, элемент1, ...[, элементN]] — создает массив из элементов, указанных в качестве параметров.

Для проверки, относится ли значение к типу String, Number, Boolean, Object, Function, Undefined служит оператор typeof.

Операторы

Рассматривая сценарии JavaScript нам часто приходиться сталкиваться со значками, которые называются операторами. Операторы предназначены для составления выражений. Они применяются к одному или двум данным, которые называются операндами. Элементарное выражение, состоящее из операндов и оператора, вычисляется интерпретатором и, следовательно, имеет некоторое значение. В этом случае говорят, оператор возвращает значение. Например оператор сложения, примененный к числам 4 и 5, возвращает значение 9. Оператор имеет тип, совпадающий с типом возвращаемого им значения. Поскольку элементарное выражение с оператором и операндами возвращает значение, это выражение можно присвоить переменной.

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

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

Таблица. Операторы присвоения
Оператор Пример Эквивалентное выражение
+= х += у х = х+у
– = х – = у х = х–у
*= х *= у х = х*у
/= х /= у х = х/у
%= х %= у х = х%у

Операторы коментария

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

  • //-одна строка символов, расположенная справа от этого оператора , считается комментарием;
  • /*...*/ - все, что заключено между /* и */, считается комментарием;

C помощью этого оператора можно выделить несколько строк в качестве комментария.

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

Таблица. Арифметические операторы
Оператор Название Пример
+ Сложение х+у
Вычитание х–у
* Умножение х*у
/ Деление х/у
% Деление по модулю х%у
++ Увеличение на 1 х++
– –х
– – Уменьшение на 1 х– –
– –х
 

Операторы ++ и – – называются соответственно инкрементом и декрементом.

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

В случае логических данных интерпретатор переводит логические значения операндов в числовые( true в 1, false в 0), выполняет вычисление и возвращает числовой результат. Тоже происходит, когда один оператор логический, а другой числовой.

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

Таблица. Операторы сравнения
Оператор Название Пример
= = Равно х= =у
!= Не равно х!=у
<> Не равно х<>у
> Больше, чем х>у
>= Больше или равно(не меньше) х>=у
< Меньше, чем х<у
<= Меньше или равно(не больше) х<=у

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

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

Логические данные, обычно получаемые с помощью элементарных выражений, содержащих операторы сравнения, можно объединить в более сложные выражения. Для этого используются логические (булевы) операторы–логические союзы И и ИЛИ, а также оператор отрицания НЕ.

Таблица. Логические операторы
Оператор Название Пример
! Отрицание(НЕ)
&& И х&&у
| | ИЛИ х| |у

Примеры использования операторов И, ИЛИ.

х у х&&у х| |у
true true true true
true false false true
false true false true
false false false false

Операторы && и | | еще называют логическим умножением и логическим сложением соответственно. В математике логические операции И и ИЛИ называют соответственно конъюнкцией и дизъюнкцией.

Рассмотрим пример использования различных операторов.

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Операторы цикла</title>
<script language="JavaScript">
x="Вася"
x+",Привет"
alert(x+",Привет");
x=5; x*=7
alert(x)
x=false || 2*2==4
alert(x)
true+true
alert(true+true);
alert(true+5);
alert(5+7);
x=7;
y=5;
z=x*y;
alert(z)
x=8
y=prompt("введите значение У", "");
z=x*y;
alert(z);
</script>
</head>

<body>
</body>
</html>

В окне веб-браузера это будет выглядеть ТАК.

Операторы условного перехода. Оператор if

Оператор условного перехода if позволяет реализовать структуру условного выражения:

если ..., то ..., иначе ...

Синтаксис оператора if перехода следующий:

if(условие)

{код, который выполняется, если условие истинно}

else

{код, который выполняется , если условие ложно};

В фигурных скобках распологается блок кода - несколько выражений. Если в блоке используется не более одного выражения, то фигурные скобки можно не писать. часть этой конструкции, определяемая ключевым словом else(иначе), необязательна. В этом случае остается только часть, определенная ключевым словом if(если):

if(условие)

{код, который выполняется, если условие истинно}

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

Рассмотрим несколько примеров.

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

.
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Операторы условного перехода</title>
<script language="JavaScript">
function my_fun(){
var user_name = prompt ("Введите свое имя ", " ");
var my_age= prompt("Введите ваш возраст", " ");
if(my_age<18)
{alert(user_name+"! Вы слишком молоды для этого сайта.")}
else
{alert("Подтвердите свое решение заглянуть на сайт.")}
}
</script>
</head>

<body onLoad="my_fun()">
</body>
</html>

В окне веб-браузера это будет выглядеть ТАК.

Как видите диалоговое окно выводится в зависимости от переменной my_age (возраст) с оператором сравнения < (меньше, чем):

if(my_age < 18)
{alert (user_name+"! Вы слишком молоды для этого сайта.")}
else
{alert ("Подтвердите свое решение заглянуть на сайт.")}
}

Кроме описанного выше способа, часто встречается еще и такой:

if(условие) {
код, который работает, если условие выполнено
} else {
код, который работает, если условие не выполнено
}

Пишем скрипт.

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Операторы условного перехода</title>
<script language="JavaScript">
function my_drug(){
var user_name = prompt ("Введите свое имя ", " ");
alert(user_name+"! Кто сегодня одержал победу в матче Зенит-Челси?");
var vic=prompt(user_name+"! Введите имя победителя.", " ");
if(vic=="Зенит")
{
alert(user_name+"! Приходи! Отметим это событие!")
}
else {
alert("Обидно за поражение.Надо больше тренироваться.")
}
}
</script>
</head>

<body onLoad="my_drug()">
</body>
</html>

В окне веб-браузера это будет выглядеть ТАК.

В данном случае оператору if (vic=="Зенит") задано условие, гда применен оператор сравнения = =(Равно). Пробела между знаками = = не дожно быть.

Давайте рассмотрим более сложную структуру оператора условного перехода, которая образуется при вложении других операторов if.

if(условие 1) {
код, который работает, если условие 1 выполнено
}
else {if (условие 2 ) {
код, который работает, если условие 2 выполнено
}
else {
код, который работает, если условие 2 не выполнено
}
}

Давайте разберем пример

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

1-е условие: участник побеждает в обязательной и свободной программах;

if (my_name == my_name1)
{
alert ("Поздравляем! Победителем соревнования назван "+my_name);
}

2-е условие: если абсолютного победителя выявить не удалось, то победителем будет спортсмен спортсмен выигравший в обязательной программе.

else {
if(my_name1 < my_name) {
alert ("Поздравляем! Победителем соревнования в свободной программе назван "+my_name1+"");
}
else
{
alert ("В этих соревнованиях окончательно победил "+my_name);
}
}

Пишем программу.

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Документ без названия</title>
<script language="JavaScript">
function my_spt() {
alert("Уважаемoe жюри просим дать оценки учатникам соревнования. Назовите победителя в обязательной и свободных программах");
my_name=prompt("Назовите имя победителя в обязательной программе", "");
my_name1=prompt("Назовите имя победителя в свободной программе", "");
if(my_name==my_name1)
{
alert("Поздравляем! Победителем соревнования назван "+my_name);
}
else {
if(my_name1<my_name){
alert("Поздравляем! Победителем соревнования в свободной программе назван "+my_name1);
}
else
{
alert("В этих соревнованиях окончательно победил "+my_name);
}
}
}
</script>
</head>

<body onLoad="my_spt()">
</body>
</html>

В окне веб-браузера это будет выглядеть ТАК.