Чтение онлайн

Итак, мы определили в коде, что имеется 5 яблок. Что дальше? Информация о яблоках имеется в коде, но никто об этом не знает. Надо сообщить о яблоках! Одним из наиболее распространенных методов вывода простого сообщения пользователю является отправка уведомления (alert):

var apples = 5;

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

Если протестировать этот сценарий, то на экране появится окно с сообщением " Имеется 5 яблок!" Сейчас подходящее время, чтобы ввести строки (String) и так называемую конкатенацию или соединение строк. Строка является просто небольшим фрагментом текста и может содержать любой текст. В JavaScript мы сообщаем коду, что имеется строка, заключая ее в одиночные или двойные кавычки (" или '). Можно использовать любой тип кавычек. Знаки плюс (+) в примере выше сообщают коду, что мы соединяем строку с предыдущей строкой.

Итак мы имеем строку "Имеется" за которой следует переменная apples (равная 5), за которой следует еще одна строка "яблок!". Соединим их вместе и получим "Имеется 5 яблок!". Команда alert получает то, что ей передается (то, что находится между скобок) и открывает окно с текстом.

Что если мы хотим предложить пользователю съесть яблоко? Можно, например, спросить, сколько яблок он хотел бы съесть:

var apples = 5;

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

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

prompt является другой встроенной функцией, аналогичной alert. Однако вместо простого вывода информации она также получает ввод от пользователя. В данном случае мы спрашиваем у пользователя, сколько яблок он хотел бы съесть. '1' в коде сообщает функции prompt, что значением по умолчанию для количества яблок будет 1, так как люди обычно едят только одно яблоко за раз. Однако пользователь может изменить это значение на любое другое. Когда пользователь щелкнет на кнопке OK, переменной eat будет задано значение этого ввода. Поэтому если пользователь введет 2, то eat будет равно 2.

Поэтому, если пользователь съел 2 яблока, то останется 3, так? Поэтому выполним несколько простых математических операций и покажем результат.

var apples = 5;

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

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

apples -= parseInt(eat);

alert('А теперь имеется только' + apples + ' яблок!');

Здесь мы видим два новых элемента. Прежде всего, обращение к функции parseInt, которая получает строку и возвращает число. Так как для выполнения математических операций требуются числа, то это гарантирует, что мы имеем число. Если пользователь введет в поле 2, то parseInt превратит это в число 2.

Затем, оператор – =, который означает вычитание из левой части оператора значения правой части. Поэтому значение переменной eat вычитается из переменной apples. Можно также записать эту строку следующим образом:

apples = apples - parseInt(eat);

Это означает в точности то же самое и может быть немного легче для понимания. Теперь, когда известно, сколько осталось яблок, мы еще раз сообщаем пользователю эту информацию.

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

+

–

/

*

+=

– =

/=

*=

Вот и все для начала. В следующей лекции мы добавим в код проверку, введем операторы 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 имеет свой собственный набор скобок и свой собственный блок для выполнения.