TOC

Как написать условные выражения в JavaScript

Вступление

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

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

Условные операторы выполняют определенное действие, основываясь на результатах исхода https://www.digitalocean.com/community/tutorials/understanding-data-types-in-javascript#booleans [+ true + или + false +] ,

Вот несколько примеров условных операторов JavaScript:

  • Проверьте местоположение пользователя и отобразите правильный язык в зависимости от страны

  • Отправьте форму при отправке или отобразите предупреждения рядом с пропущенными обязательными полями

  • Откройте раскрывающийся список для события щелчка или закройте раскрывающийся список, если он уже открыт

  • Отображение веб-сайта поставщика алкоголя, если пользователь старше установленного возраста

  • Показать форму бронирования отеля, но не, если отель забронирован

Условные операторы являются частью логики, принятия решений или управления потоком компьютерной программы. Вы можете сравнить условный оператор с книгой «https://en.wikipedia.org/wiki/Choose_Your_Own_Adventure[Choose Your Own Adventure]» или блок-схемой.

В этом уроке мы рассмотрим условные операторы, в том числе ключевые слова + if +, + else + и + else if +. Мы также рассмотрим троичный оператор.

Если заявление

Наиболее фундаментальным условным оператором является оператор + if +. Оператор + if + оценивает, является ли оператор истинным или ложным, и выполняется, только если оператор возвращает + true +. Блок кода будет игнорироваться в случае результата + false +, и программа перейдет к следующему разделу.

Оператор + if + записывается с ключевым словом + if +, за которым следует условие в скобках, а код должен выполняться в фигурных скобках. Короче говоря, это можно записать как + if () {} +.

Вот более длинное рассмотрение основного оператора + if +.

if (condition) {
   // code that will execute if condition is true
}

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

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

shop.js

// Set balance and price of item
const balance = 500;
const jeans = 40;

// Check if there are enough funds to purchase item
if (jeans <= balance) {
 console.log("You have enough money to purchase the item!");
}
OutputYou have enough money to purchase the item!

У нас есть баланс на счете + 500 , и мы хотим купить пару джинсов за + 40 +. Используя оператора «меньше или равно», мы можем проверить, меньше ли цена джинсов или равна той сумме средств, которая у нас есть. Поскольку ` jeans ⇐ balance ` оценивается как ` true +`, условие пройдет и блок кода будет запущен.

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

shop.js

// Set balance and price of item
const balance = 500;
const phone = 600;

// Check if there is enough funds to purchase item
if (phone <= balance) {
   console.log("You have enough money to purchase the item!");
}

Этот пример не будет выводиться, так как + phone ⇐ balance + оценивается как + false +. Блок кода будет просто проигнорирован, и программа перейдет к следующей строке.

Остальное заявление

С операторами + if мы выполняем код только тогда, когда оператор оценивается как` + true`, но часто мы хотим, чтобы в случае сбоя условия происходило что-то еще.

Например, мы можем захотеть отобразить сообщение, сообщающее пользователю, какие поля были заполнены правильно, если форма не была отправлена ​​должным образом. В этом случае мы будем использовать оператор + else +, который будет выполнять код, если исходное условие не выполнится.

Оператор + else + записывается после оператора + if +, и в скобках нет условий. Вот синтаксис для базового оператора + if …​ else +.

if (condition) {
   // code that will execute if condition is true
} else {
   // code that will execute if condition is false
}

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

shop.js

// Set balance and price of item
const balance = 500;
const phone = 600;

// Check if there is enough funds to purchase item
if (phone <= balance) {
   console.log("You have enough money to purchase the item!");
} else {
   console.log("You do not have enough money in your account to purchase this item.");
}
OutputYou do not have enough money in your account to purchase this item.

Поскольку условие + if не выполнено, код переходит к тому, что содержится в операторе` + else`.

Это может быть очень полезно для отображения предупреждений или для информирования пользователя о том, какие действия необходимо предпринять для продвижения вперед. Обычно действие требуется как в случае успеха, так и в случае неудачи, поэтому + if …​ else + встречается чаще, чем одиночный оператор + if +.

Остальное если заявление

С помощью + if и` + else` мы можем запускать блоки кода в зависимости от того, является ли условие + true или` + false`. Однако иногда у нас может быть несколько возможных условий и выходов, и нам нужно больше, чем просто два варианта. Один из способов сделать это с помощью оператора + else if, который может оценить более двух возможных результатов.

Вот базовый пример блока кода, который содержит оператор + if +, несколько операторов + else if + и оператор + else +, если ни одно из условий не вычислено как + true +.

if (condition a) {
   // code that will execute if condition a is true
} else if (condition b) {
   // code that will execute if condition b is true
} else if (condition c) {
   // code that will execute if condition c is true
} else {
   // code that will execute if all above conditions are false
}

JavaScript попытается выполнить все операторы по порядку, и если ни один из них не будет успешным, он по умолчанию будет использовать блок «+ else +».

Вы можете иметь столько операторов + else if, сколько необходимо. В случае многих операторов + else if +, https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch [+ switch + оператор] может быть предпочтительным для удобства чтения ,

В качестве примера нескольких операторов + else if +, мы можем создать приложение для оценки, которое будет выводить буквенную оценку на основе оценки из 100.

Требования этого приложения заключаются в следующем:

  • Класс 90 и выше является

  • Оценка от 80 до 89 является B

  • Оценка от 70 до 79 баллов

  • Класс от 60 до 69 - это D

  • Оценка 59 или ниже - F

Ниже мы создадим простой набор операторов + if +, + else + и + else if + и проверим их на соответствие заданному уровню.

grades.js

// Set the current grade of the student
let grade = 87;

// Check if grade is an A, B, C, D, or F
if (grade >= 90) {
 console.log("A");
} else if (grade >= 80) {
 console.log("B");
} else if (grade >= 70) {
 console.log("C");
} else if (grade >= 60) {
 console.log("D");
} else {
 console.log("F");
}
OutputB

В нашем примере мы сначала проверяем наивысшую оценку, которая будет больше или равна + 90 +. После этого операторы + else if + будут проверять наличие больше, чем + 80 +, + 70 + и + 60 +, пока не достигнет значения по умолчанию + else + для неудавшейся оценки.

Хотя наше + grade + значение + 87 + технически верно и для + C +, + D + и + F +, операторы остановятся на первом, который успешен. Следовательно, мы получаем вывод + B +, который является первым соответствием.

Троичный оператор

  • Тернарный оператор *, также известный как условный оператор, используется как сокращение для оператора + if …​ else +.

Тернарный оператор записывается с синтаксисом вопросительного знака (+? +), За которым следует двоеточие (+: +), как показано ниже.

(condition) ? expression on true : expression on false

В вышеприведенном утверждении сначала записывается условие, за которым следует +? +. Первое выражение будет выполнено в + true +, а второе выражение будет выполнено в + false +. Это очень похоже на оператор + if …​ else + с более компактным синтаксисом.

В этом примере мы создадим программу, которая проверяет, является ли пользователь + 21 + или старше. Если это так, он выведет " Вы можете ввести " в консоль. Если это не так, он выведет " Вы не можете войти. " На консоль.

age.js

// Set age of user
let age = 20;

// Place result of ternary operation in a variable
const oldEnough = (age >= 21) ? "You may enter." : "You may not enter.";

// Print output
oldEnough;
Output'You may not enter.'

Так как + age + пользователя было меньше, чем + 21 +, сообщение об ошибке выводилось на консоль. + If …​ else +, эквивалентный этому, будет " Вы можете ввести. " В выражении + if +, и " Вы не можете вводить. " В + else + заявление.

Заключение

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

В этой статье мы узнали о том, как использовать ключевые слова + if,` + else` и + else if, а также о вложенности операторов и использовании тернарного оператора.

Related