Основные конструкции JavaScript

JavaScript не требует описания переменных. Переменная появляется при первом присваивании ей значения. Для описания public переменной необходимо объявить переменную при помощи оператора var, причем одновременно переменной может присваиваться значение.

var napr=1;

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

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

JavaScript – слабо типизированный язык. Явно тип никогда не задается, но для переменных он определяется при присваивании значения, а для свойств объектов он предопределен, и его необходимо знать для правильного формирования выражений.

<img src="pic2.jpg" width=100 height=100

onclick="alert(parseInt(this.width)+10) ">

В примере по щелчку на первую картинку будет выведено не число «110», как хотелось бы, а строка «10010». Происходит это потому, что свойство width текстовое, и операция «+» для него воспринимается как конкатенация. В JavaScript предусмотрены операции преобразования типов. Так parseInt() преобразует строку в число, поэтому щелчок по второй картинке выдаст ожидаемое число «110».

В javaScript существует 6 типов данных: число, строка, объект, логическое, null, undefined.

Есть особые числовые значения: NaN – не число, Positive Infinity – положительная бесконечность, Negative Infinity – отрицательная бесконечность, Positive 0 – положительный нуль, Negative 0 – отрицательный нуль.

Логические значения true, false. Это специальные значения, не 0 и 1, хотя при сравнении за счет преобразования типов получается, что выражение, значение которого равно 0, равно false, а любое другое (отличное от 0) равно true.

Операторы и операции представлены в таблице ниже:

Вычисления	Логические	Сравнения	Назначения	Разное
Описание	Знак	Описание	Знак	Описа-ние	Знак	Описание	Знак	Описа-ние	Знак
Унарный минус	-	НЕ	!	Битовое НЕ	~	Присваивание	=	удале-ние	delete
Инкре-мент	++	Меньше	<	Битовый сдвиг влево	<<	присваивание с операцией	OP=	тип	typeof
Декре-мент	--	Больше	>	Бито-вый сдвиг вправо	>>			проце-дура	void
Умно-жение	*	Меньше либо равно	<=	Беззнаковый сдвиг вправо	>>>
Деление	/	Больше либо равно	>=	Битовое И	&
Остаток от деления	%	Равно	==	Исключающее ИЛИ	^
Сложение	+	Не равно	!=	Битовое ИЛИ	\|
Вычитание	-	И	&&
		ИЛИ	\|\|
		Условие	?:
		Перечисление	,
		Идентичность	===
		Не идентичность	!==

Операторы завершаются точкой с запятой. В конце строки точка с запятой может быть опущена. C целью образования группы несколько операторов заключаются в фигурные скобки.

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

var p=10;

function ff(){

var d; alert('теперь все есть ' +p); alert(d); d=6; alert(p); alert(d);

}

alert('при загрузке ' +p); alert('при загрузке ещё нет d ' +d);

</SCRIPT>

Синтаксис условного оператора:

if (condition) statement1;[else statement2];

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

d=prompt('введите число'); if (d==1) alert('=1'); else alert('<>1');

Оператор условного цикла:

do statement1while (expression);

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

</head>

<BODY style = "color:RGB(0,100,100)"

onclick = 'r=r+20; this.style.color = "RGB(" + r + ",100,100)"'>

Щелкайте по тексту, и он будет становиться всё краснее.

</BODY>

Важно! Переменная r описана как глобальная для того, чтобы сохранялось значение между вызовами обработчика события «onclick».

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

for (initialization; test; increment) statement;

В примере ниже рассчитывается факториал введенного числа и показывается в статус-строке. Обратите внимание на преобразование числа в строку (метод toString), требующееся для формирования строкового выражения.

<P onclick="d=prompt('число? ',1); r=1;

alert('считаем факториал числа d='+d.toString());

for (i=1;i<=d;i++) r=r*i;

window.status= 'результат='+r.toString();"> факториал</P>

Цикл по свойствам объекта. Можно пройтись по свойствам с целью найти нужное, составить описание и т.п.

for (variable in [object | array]) {statement; return [expression];}

Переключатель – структура, вычисляющая значение выражения и осуществляющая переход к метке, равной вычисленному значению. Обязательно нужно указывать оператор break в конце каждой группы операторов (statementlist), иначе будет исполняться следующая группа операторов.

switch (expression) {

case label: statementlist

...
default: statementlist

}

Пример программного кода, расположенного в теге script и тега div, расположенного в body. По щелчку изменяется содержимое тега body по кругу. Важно, что в конце каждого пункта стоит break, при его отсутствии альтернативы выполняются последовательно одна за другой.

var m=1;

function sw(){

switch (m) {

case 1: {sd.innerText = "Дождь по крышам стучит"; break;}

case 2: {sd.innerText = "так, что стонут все крыши.";break;}

case 3: {sd.innerText = "А во мне всё кричит,";break;}

case 4: {sd.innerText = "только ты не услышишь...";break;}

default: sd.innerText = "Пела Майя Кристаллинская";

}

if (m>4) m=1;

else m=m+1;

}

...

<div id=sd onclick="sw()">песня</div>

Фиксирование части дерева объектов сокращает время работы с объектными свойствами: with (object) statement;

123

Дата добавления: 2016-04-19; просмотров: 2324;