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

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

Операторы отношения

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

  • > Больше чем
  • >= Больше или равно
  • < Меньше чем
  • <= Меньше или равно
  • != Не равно
  • !== Строгое не равно
  • == равно
  • === Строго равно

Теперь давайте посмотрим, как работают эти операторы, определив несколько переменных и проведя сравнения с помощью этих операторов с помощью оболочки Spidermonkey:

js> let word = "hello";
js> number > 50
true
js> number >= 101
false
js> word < "Hello"
false
js> word > "garbage"
true
js> number <= 100
true

Числовые сравнения должны быть понятны, но вам может быть любопытно сравнение строк. Строки сравниваются путем сравнения значений ASCII каждой буквы, начиная с первой буквы каждого слова. Если первая буква первого слова имеет более высокое значение ASCII, чем первая буква второго слова, первое слово больше. Вот почему «привет» в приведенном выше примере не меньше «привет».

Если вы не знакомы с ASCII, перейдите сюда для объяснения.

Два реляционных оператора, которые могут нуждаться в пояснении, - это строгие операторы === и !==. Эти операторы необходимы из-за некоторых особенностей конструкции JavaScript. Я могу лучше всего объяснить эти причуды на демонстрации с использованием оболочки:

js> let number = 100;
js> let strNumber = "100";
js> number == strNumber
true

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

js> number === strNumber
false

Мы можем продемонстрировать ту же причудливость с оператором not equal to:

js> let number = 100;
js> let strNumber = "100";
js> number != strNumber
false
js> number !== strNumber
true

Простое утверждение if

Первый тип оператора if в JavaScript - это простой if. В этой форме проверяется реляционное выражение, и если выражение истинно, выполняется инструкция или набор инструкций.

Вот шаблон синтаксиса для простого if:

if (выражение отношения) {
оператор (ы);
}

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

Если вы разбираетесь в программировании, то можете заметить, что я ничего не упомянул о фигурных скобках, которые заключают в скобки операторы. В JavaScript, как и в большинстве других языков, фигурные скобки могут быть необязательными, если в блоке всего одна инструкция. Однако стандартной практикой программирования становится включение фигурных скобок, несмотря ни на что, для сдерживания логических ошибок, которые возникают, когда вы хотите, чтобы внутри блока выполнялось более одного оператора, но вы опускали фигурные скобки. Эта практика действительно была начата известным программистом JavaScript Дугласом Крокфордом, который написал об этой практике в своей книге JavaScript: полезные части.

Вот пример программы, демонстрирующей, как работает простой if:

let grade = 0;
putstr("Enter your grade: ");
grade = parseInt(readline());
if (grade >= 70) {
  print("You passed!");
}

Вот два запуска этой программы:

Enter your grade: 78
You passed!
Enter your grade: 65

Вы заметите, что при вводе числа 65 ничего не произошло. Это потому, что в простом if ничего не должно произойти, если выражение отношения ложно. Для этого вам понадобится вторая форма оператора if - оператор if-else.

Заявление if-else

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

if (выражение отношения) {
оператор (ы);
}
else {
оператор (ы);
}

Теперь мы можем переписать приведенный выше пример, чтобы пользователю было выдано сообщение, если он не набрал проходной балл:

let grade = 0;
putstr("Enter your grade: ");
grade = parseInt(readline());
if (grade >= 70) {
  print("You passed!");
}
else {
  print("Sorry. You did not pass.");
}

Вот два запуска этой программы:

C:\js>js test.js
Enter your grade: 78
You passed!
C:\js>js test.js
Enter your grade: 68
Sorry. You did not pass.

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

Оператор if-else if

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

90–100 A
80–89 B
70–79 C
60–69 D
0–59 F

Вот шаблон синтаксиса для оператора if-else if:

if (выражение отношения) {
оператор (ы);
}
else if (выражение отношения) {
оператор (ы);
}
else if (выражение отношения) {
инструкция (и);
}

else {
инструкция (и);
}

Многоточие означает, что в операторе может быть больше else if блоков.

Каждое реляционное выражение после первого необязательно, как и else в конце оператора.

Давайте посмотрим, как if-else if можно использовать для решения проблемы с буквенной оценкой, которую я представил выше:

let letterGrade = "";
let grade = 0;
putstr("Enter the grade: ");
grade = parseInt(readline());
if (grade >= 90) {
  letterGrade = "A";
}
else if (grade >= 80) {
  letterGrade = "B";
}
else if (grade >= 70) {
  letterGrade = "C";
}
else if (grade >= 60) {
  letterGrade = "D";
}
else if (grade >= 0) {
  letterGrade = "F";
}
print(`A numeric grade of ${grade} earns a letter grade of
      ${letterGrade}.`);

Вот несколько запусков программы:

C:\js>js test.js
Enter the grade: 88
A numeric grade of 88 earns a letter grade of B.
C:\js>js test.js
Enter the grade: 71
A numeric grade of 71 earns a letter grade of C.

Условный оператор

Существует сокращенный метод написания оператора if-else, называемый условным оператором. Этот оператор состоит из двух символов $:. Вот шаблон синтаксиса для условного оператора:

(выражение отношения)? выражение-оценка-если-истина: выражение-оценка-если-ложь;

Вот программа годен / негодна, написанная с использованием условного оператора:

let grade = 0;
putstr("Enter the grade: ");
grade = parseInt(readline());
(grade >= 70) ? print("You passed!") : print("Sorry. You didn't 
   pass.");

Вот два запуска программы:

C:\js>js test.js
Enter the grade: 74
You passed!
C:\js>js test.js
Enter the grade: 65
Sorry. You didn't pass.

Условный оператор часто короче для написания, чем оператор if-else, но его не всегда легко читать и понимать, поэтому используйте этот оператор осторожно, если вас беспокоит, что другие читают и понимают, что делает ваша программа.

Спасибо за чтение, напишите мне с комментариями и предложениями. Если вас интересуют мои онлайн-курсы по программированию, посетите https://learncpp.teachable.com.