89101986160

Условия javaScript

Назад

Простое ветвление

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

И сразу же первая задача: нужно разработать программу «Можно ли съесть ещё?». Это очень важный вопрос для всех, кто готовится к выставке. В программе используются следующие данные:

  • дневная норма корма, в переменной dayLimit;
  • вес съеденного за сегодня корма, в переменной foodInGrams.

Если корма съедено больше дневной нормы, то больше съесть нельзя, иначе можно.

До сих пор мы писали линейные программы, которые всегда выполняли одинаковые команды. Сейчас нам нужно, чтобы программа стала нелинейной: в зависимости от разных условий она должна выполнять разные команды. Как научить программу проверять условия и принимать решения на основе результатов проверок?

Для проверки условий используют условный оператор if:

if (условие) {
  действия;
}

Здесь «условие» — это выражение, возвращающее true или false, а «действия» внутри фигурных скобок — это команды, которые выполняются если условие удовлетворено.


Используем альтернативу

Программа отлично показывает, когда можно съесть ещё, но совсем ничего не сообщает, если превышение всё-таки есть. Из-за этого Кекс чуть было не съел лишние 10 грамм! Нужно исправлять ситуацию.

Создадим ветку, которая будет срабатывать, если условие не выполнено. Для этого используем вот такой шаблон:

if (условие) {
  действия;
} else {
  другие действия;
}

Ветка «действия» срабатывает, если условие выполнено. Ветка «другие действия» срабатывает, если условие не выполнено.

И когда все условия работы описаны, программа может работать с реальными данными от заказчика.


Простые сравнения

В предыдущем задании мы сравнили количество съеденного корма и дневную норму корма, которую может съесть Кекс. И решили ещё одну задачу босса.

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

В этом задании мы потренируемся использовать операторы «больше» > и «меньше» <, занимаясь исправлением ошибок в экспериментальных разработках босса.

Кекс обнаружил на флипчарте в отделе продаж несколько маркеров разного цвета: один красный, два жёлтых и три зелёных. Он уже написал аналитическую программу, которая должна сравнивать количество маркеров и выводить соответствующие прогнозы. Но сравнения по какой-то причине не работают: выводятся сообщения, что прогноз неприемлем, а при этих входных данных должны выводиться позитивные прогнозы.

Нужно разобраться в причине и исправить программу так, чтобы прогнозы радовали босса.

Хотя делать прогнозы по рынку на основании цветов маркеров в отделе продаж может только кот.


Сравнения, допускающие равенство

Отлично, рыночный анализатор Кекса по цветам маркеров в отделе продаж исправно работает.

Но вот незадача, на флипчарте нашлись ещё и синие маркеры, которыми обводятся рискованные сделки. Кекс доработал свой анализатор, но снова с ошибками.

Чтобы починить новую версию анализатора, нам нужно изучить ещё два оператора, используемых для сравнения. Если известно, что одно число может быть больше или равно другому, используют оператор «больше или равно» >=. Аналогично, если первое число может быть меньше или равно, используют оператор «меньше или равно» <=.

Программа дополнена ещё двумя условиями и их снова нужно исправить.


Равенство, неравенство

И вторую версию анализатора починили. Но кот где-то услышал про теорию оценки с помощью равенств и неравенств. Кексу понадобилось, чтобы анализатор сравнивал маркеры одного цвета по новым правилам, и кот быстро реализовал эту логику. И снова сработало правило «где быстрые лапы, там разные баги».

Чтобы починить эту программу, нам нужно углубиться в операторы сравнения. Чтобы выяснить, равны два значения или нет, в JavaScript используют операторы ==!==== и !==:

Оператор Действие
== Сравнивает два значения, перед этим приводит одно из значений к типу другого. Если значения равны, возвращает true.
=== Сравнивает два значения. Если типы значений разные или значения не равны, возвращает false.
!= Сравнивает два значения, перед этим приводит одно из значений к типу другого. Если значения не равны, возвращает true.
!== Сравнивает два значения. Если типы значений разные или значения не равны, возвращает true.

Строгое сравнение строк

Как же быть, если есть два значения разных типов, а на приведение по умолчанию надеяться не хочется? Использовать приведение «руками».

Например, можно привести числовое значение к строковому типу. Один из способов — использовать команду .toString(). Например:

var number = 1;

// выведет число: 1 (number)
console.log(number);

// выведет строку: "1" (string)
console.log(number.toString());

Строгое сравнение чисел

Привести число к строке можно с помощью команды .toString(). Но иногда, наоборот, требуется превратить строку в число, чтобы сравнить их.

Для этого можно использовать команду parseInt(). Пример:

var string = '1';

console.log(string);
// выведет строку: "1" (string)

console.log(parseInt(string, 10));
// выведет число: 1 (number)

Обратите внимание, что у команды два аргумента:

  1. строка, которую мы пытаемся превратить в число;
  2. основание системы счисления, в которую мы переводим число.

Мы привыкли работать в десятичной системе счисления, но в программировании часто приходится иметь дело с другими системами: двоичной, восьмеричной, шестнадцатеричной. Именно поэтому у parseInt() есть второй аргумент. И хотя сейчас мы не будем разбираться в тонкостях систем счисления, не забывайте про эту особенность команды parseInt() и всегда явно указывайте второй аргумент, чтобы избежать ошибок.

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


Действия по условию

Заканчиваем отдыхать, письмо от босса!

Вторая задача: нужно усовершенствовать программу «Можно ли съесть ещё?». Входные данные те же:

  • дневная норма корма, в переменной dayLimit;
  • вес съеденного за сегодня корма, в переменной foodInGrams.

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

Сначала продумаем алгоритм решения:

  1. заводим новую переменную для хранения количества корма, которое ещё можно съесть;
  2. проверяем, съедено ли корма меньше, чем норма;
  3. если да, то вычитаем из нормы количество съеденного корма, а результат сохраняем в новую переменную;
  4. если нет, то записываем в новую переменную ноль;
  5. выводим красивое информативное сообщение.

Как вы видите, внутри условий можно и нужно производить операции над переменными, а не только выводить сообщения.


Если условие не выполнено

Мы посчитали, сколько корма можно съесть, если дневная норма не превышена.

Осталось посчитать количество корма, которое можно съесть, если съедено больше нормы. Это самое лёгкое задание, потому что нужно просто приравнять значение нулю.

И на последнем шаге нужно вывести красиво отформатированное сообщение. Это вы уже умеете.


Значения как условие

Значения логического типа (true и false) и переменные, имеющие эти значения, сами могут выступать в качестве условий.

На самом деле, в качестве условий могут выступать и числа, и строки. При приведении строки к логическому типу, false будет получено только для пустой строки, а при приведении числа — только для нуля.

Кекс работает над ещё одной программой «Можно ли приступать к проекту». А мы будем тестировать её и исправлять ошибки, если потребуется.

Программа рассматривает несколько условий и выдаёт экспертное заключение. Вначале она проверяет, гуляет ли кто-то из разработчиков в отпуске. Нам нужно оттестировать это условие на разных типах данных.

Дело в том, что информацию об отпусках мы получаем от менеджеров в абсолютно разных форматах. Кто-то сразу скажет, что разработчики ещё в отпуске, то есть передаст true, кто-то не поймёт вопроса и скажет, сколько разработчиков в отпуске, то есть отдаст нам какое-то число. А кто-то вообще промолчит, если никого в отпуске нет, то есть мы получим пустую строку.

Чтобы убедиться, что условие отрабатывает правильно, попробуем поменять значение переменной onVacation.


Вложенные условия

Что делать, если принятие решения зависит не от одного, а от двух и более условий? Можно использовать один if, а затем, если условие выполнилось, выполнить ещё одно условие внутри вложенного if:

if (условие1) {
  if (условие2) {
    действия;
  }
}

Затем внутри второй проверки можно выполнить третью и так до бесконечности.

Продолжим писать программу «Можно ли приступать к проекту», которая как нельзя кстати усложнилась. Теперь приступать к проекту можно, если выполняются два условия:

  1. есть достаточное количество разработчиков — переменная enoughDevelopers;
  2. и разработчики владеют требуемыми технологиями — переменная techAvailable.

Если разработчиков достаточно и требуемая технология освоена, выводим сообщение «Можно приступать к проекту», иначе сообщение остаётся неизменённым: «Нельзя приступать к проекту».


Логические операторы: &&, ||

Работа над программой кипит и Кекс просит внести в логику принятия решений ещё несколько изменений:

  • Проект можно начинать, если разработчиков достаточно и они владеют необходимыми технологиями.
  • Проект нельзя начинать, если кто-то из разработчиков в отпуске или на больничном.

Первую часть логики, ту которая содержит и, мы уже умеем реализовывать с помощью вложенных условий. Но как быть со второй частью, которая содержит или? Мы можем комбинировать условия внутри if с помощью логических операторов: && и ||. Например:

var conditionOne = true;
var conditionTwo = true;
var conditionThree = false;
var conditionFour = true;

if (conditionOne && conditionTwo) {
  // код выполнится
}
if (conditionThree || conditionFour) {
  // код тоже выполнится
}

Оператор && или «логическое И» возвращает true только в том случае, если оба условия, слева и справа от него, возвращают true.

Оператор || или «логическое ИЛИ» возвращает true если любое из условий слева или справа от него, возвращают true.

Теперь понятно, как запрограммировать вторую часть логики: скомбинируем условия «сотрудники в отпуске» и «сотрудники на больничном» через «логическое ИЛИ».

Первую часть логики тоже запрограммируем без вложенных if: объединим условия «достаточно разработчиков» и «технология освоена» через «логическое И». Мы отказались от вкладывания условий, так как это может сделать код сложным и запутанным. Если вложенность большая, то понять, почему выполняется то или иное действие, становится трудно.


Ловушки логики

В текущую программу закралась ошибка. Просто пересылаю цитату из письма босса:

Как-то, мур-мяу, сложно.

Сначала проверяет одно и говорит, что можно начинать.

А потом начинает проверять или то, или это и говорит подождать.

И я вижу два сообщения: сначала можно, потом сразу нельзя. И не знаю, что делать.

Пусть просто говорит когда можно начинать, а когда нельзя.

Жаль, что вам пришлось столкнуться с задачами «анализ требований заказчика» и «исправление багов с помощью чтения мыслей» так рано. Но ничего не поделаешь. Давайте разбираться, где ошибка, и чего хочет босс.

Из письма следует, что при каких-то условиях программа выдаёт сразу два сообщения. Чтобы поймать ошибку, её сначала надо воспроизвести. Поэтому давайте менять значения входных данных.


Логическое отрицание

Отлично! Мы нашли ошибку. Как говорил Декарт: «Если баг воспроизводится, значит он существует».

В чём ошибка? Сейчас в программе есть две отдельных проверки. И эти проверки могут сработать одновременно. Когда это случается, появляется два сообщения.

Чтобы исправить ошибку, сначала введём новые проверки с отрицаниями:

  • нет разработчиков в отпуске;
  • нет разработчиков на больничном.

В этих условиях есть ключевое слово «нет», а значит они должны выполняться в тех случаях, когда значение переменной false и не выполняться, если значение — true.

Чтобы создать проверки с отрицанием используют унарный (одноместный) логический оператор !. Пример:

var condition = false;

if (!condition) {
  // код выполнится
}

Попрактикуемся в использовании отрицания в программе «Можно ли начинать проект»

Комбинируем логические операторы

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

Нам нужно объединить две отдельных проверки в одну общую. Проект можно начать, если:

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

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

var conditionOne = true;
var conditionTwo = true;
var conditionThree = false;

if (conditionOne && conditionTwo && !conditionThree) {
  // код выполнится
}

Пора завершить третью программу этого рабочего дня!


Вторая программа: «Сколько гулять?»

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

Мяу! Длительность прогулки зависит от нескольких условий.

Во-первых, если идёт дождь, прогулка не может состояться. В этом случае длительность прогулки должна равняться 0.

Во-вторых, если температура слишком низкая (ниже 0°C) или слишком высокая (выше 35°C), прогулка тоже не состоится.

В-третьих, идеальная температура для прогулки — 20°C. В этом случае прогулка длится 20 минут.

В остальных случаях длительность прогулки уменьшается на минуту с каждым градусом отклонения от идеальной температуры: при 19°C или 21°C длительность составит 19 минут, при 18°C или 22°C — 18 минут и так далее.

Переменная itsRaining хранит флаг «идёт дождь», а temperature — температуру на улице. Результат необходимо записать в переменную minutes.

Это необычное задание. В нём заказчик будет тестировать вашу программу, подставляя разные значения во входные переменные и проверяя рекомендации, которые выдаёт программа. Только когда все тесты пройдут успешно, задание будет выполнено.

Чтобы позвать Кекса для проверки программы, жмите кнопку

Решение:

var temperature = 12;
var itsRaining = false;
var ideal = 20;
var minutes;

if (itsRaining || temperature <= 0 || temperature >35)
{
console.log(‘Гулять нелья – Холодно дождь или жарко ‘+(minutes = 0));
}
else{
if(temperature <= 20) {
console.log (‘Можно гулять ‘ + (minutes = temperature * 100 / ideal /5)+ ‘ Минут’);
}
else{
if(temperature > 20){
console.log (‘Можно гулять ‘ + (minutes = ideal-temperature + ideal )+ ‘ Минут’);

};
}
};