Опубликован: 19.10.2006 | Уровень: для всех | Доступ: платный
Лекция 2:

Операторы и функции

< Лекция 1 || Лекция 2: 12 || Лекция 3 >
Аннотация: Основы проверки сценариев. Операторы if и else. Способы записи комментариев. Краткое знакомство с функциями.

При тестировании сценария, написанного в "предыдущей лекции" , можно заметить, что результат, получаемый из prompt, требует некоторой проверки. Когда сценарий спрашивает, сколько яблок желает съесть пользователь, то пользователь может ввести число больше 5, меньше 0 или что-то, что вообще не является числом. В каждом из таких случаев желательно информировать пользователей, что введено недопустимое значение

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

var apples = 5;
alert('Имеется ' + apples + ' яблок!');

var eat    = prompt('Сколько яблок вы хотите съесть?', '1');

var eaten  = parseInt(eat);
if(eaten > 5){
  alert('Простите, но имеется только 5 яблок.' + 'Вы не можете съесть ' + eaten + ' яблок!');
} else {
  apples    -= eaten;
  alert('А теперь имеется только ' + apples + ' яблок!');
}

Основными новыми понятиями здесь являются операторы if и else. Операторы if и else достаточно легко понять. Приведенный выше код дает возможность сказать: "Если пользователь выбрал для еды более 5 яблок, то сообщите ему, что такого количества яблок нет. Иначе позвольте ему съесть столько яблок, сколько он попросит.".

Основной синтаксис оператора if / else следующий:

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

Необходимо отметить открывающую и закрывающую скобки, { и }, в приведенном выше коде. Открывающая скобка сообщает коду, где начинается блок кода, а закрывающая скобка указывает коду, где блок заканчивается. Поэтому все между { и } выполняется как часть оператора if. Необходимо отметить, что закрывающая скобка оператора if размещается непосредственно перед ключевым словом else. Оператор else имеет свой собственный набор скобок и свой собственный блок для выполнения.

Две косые черты // в приведенном примере говорят коду, что здесь находится комментарий. Комментарий является частью кода, который не выполняется. Они обычно используются для описания функций реального кода, чтобы не требовалось изучать код для выяснения, что он делает. Если, например, имеется очень длинный фрагмент кода, который проверяет входящие данные формы, то будет вполне разумно вставить комментарий, говорящий что-нибудь вроде " Следующий код проверяет ввод пользователя в форму ". В этом случае любой, кто будет просматривать код, или сам автор кода несколько месяцев спустя после написания, сразу поймет, что этот код делает.

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

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

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

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

Вернемся к нашему оператору if,

if(eaten > 5){
  alert('Простите, но имеется только 5 яблок.  
 Вы не можете съесть ' + eaten + ' яблок!');
} else {
  apples    -= eaten;
  alert('А теперь имеется только ' + apples + ' яблок!');
}

Можно видеть, что условием является eaten > 5. Знак > означает " больше чем ", так что это условие означает " если eaten больше 5 ". Аналогично, < означает " меньше чем ".

Существует два других аналогичных знака >= и <=, которые означают " больше чем или равно " и " меньше чем или равно " соответственно.

В приведенном выше коде мы сообщаем пользователю о том, что он ввел значение больше 5 яблок. Только если он выбрал не более 5 яблок, это число вычитается из текущего количества яблок и затем пользователю сообщается, сколько яблок осталось. Однако существует еще два возможных случая. Что, если пользователь введет число меньше 0? Что, если он введет значение, которое не является числом? Первый случай читатель может теперь обработать самостоятельно. Второй случай требует использования другой встроенной функции, isNaN. При попытке преобразовать что-нибудь в число с помощью функции parseInt, возвращается значение NaN, если функция не может выполнить операцию. NaN означает Not a Number (Не число). Если вызвать функцию parseInt, например, со значением apple, то будет получено значение NaN, так как слово apple не является числом.

var apples = 5;
alert('Имеется ' + apples + ' яблок!');

var eat    = prompt('Сколько яблок вы хотите съесть?', '1');

var eaten  = parseInt(eat);
if(isNaN(eaten)){
  alert('Вы должны ввести допустимое число яблок!');
} else if(eaten > apples){
  alert('Простите, но имеется только ' + apples + ' яблок.  
 Вы не можете съесть ' + eaten + 
     ' яблок!');
} else if(eaten < 0){
  alert('Простите, но вы не можете съесть 
  отрицательное количество яблок!');
} else {
  apples -= eaten;
  alert('А теперь имеется только ' + apples + ' яблок!');
}
< Лекция 1 || Лекция 2: 12 || Лекция 3 >
Елена Сапегова
Елена Сапегова

После прохождения теоретической части пришло письмо об окончании теоретической части курса, будет ли практическая часть?

Рустам Рахимов
Рустам Рахимов

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

function Complete() {

    var x = "Имя: " + document.tutform.firstname.value;

alert(x);

} - Так брать значение из формы tutform, firstname-получаем значение из имени. 

<INPUT TYPE="button" VALUE="Готово" onClick="Complete();"> - Нужно к кнопке прописать событие, при нажатие на кнопку готово, чтобы возвращалось значение с помощью функции. А так ничего не работает, и смысла учить нету, если не знать почему не работает.