183 lines
7.6 KiB
Markdown
183 lines
7.6 KiB
Markdown
---
|
||
sidebar_position: 6
|
||
---
|
||
|
||
# Условия и логические операторы
|
||
|
||
## Условное ветвление: if, '?'
|
||
|
||
Инструкция if(...) вычисляет условие в скобках и, если результат true, то выполняет блок кода.
|
||
|
||
***Несколько условий: «else if»***
|
||
|
||
## Конструкция "switch"
|
||
```js
|
||
let a = 2 + 2;
|
||
|
||
switch (a) {
|
||
case 3:
|
||
alert( 'Маловато' );
|
||
break;
|
||
case 4:
|
||
alert( 'В точку!' );
|
||
break;
|
||
case 5:
|
||
alert( 'Перебор' );
|
||
break;
|
||
default:
|
||
alert( "Нет таких значений" );
|
||
}
|
||
```
|
||
## Условный оператор „?“ (тернарный)
|
||
```js
|
||
let result = условие ? значение1 : значение2;
|
||
```
|
||
## Логические операторы
|
||
|
||
В JavaScript есть семь логических операторов:
|
||
|
||
- || (ИЛИ)
|
||
- ||= (Оператор логического присваивания ИЛИ)
|
||
- && (И)
|
||
- &&= (Оператор логического присваивания И)
|
||
- ! (НЕ)
|
||
- ?? (Оператор нулевого слияния)
|
||
- ??= (Оператор нулевого присваивания)
|
||
|
||
### || (ИЛИ)
|
||
```js
|
||
( true || true ); // true
|
||
( false || true ); // true
|
||
( true || false ); // true
|
||
( false || false ); // false
|
||
```
|
||
### ИЛИ "||" находит первое истинное значение
|
||
```js
|
||
( 1 || 0 ); // 1 (1 - истинное значение)
|
||
( true || 'какая-то строка' ); // true
|
||
( null || 1 ); // 1 (первое истинное значение)
|
||
( null || 0 || 1 ); // 1 (первое истинное значение)
|
||
( undefined || null || 0 ); // 0 (поскольку все ложно, возвращается последнее значение)
|
||
```
|
||
|
||
### ||= (Логическое присваивание ИЛИ)
|
||
```js
|
||
a ||= b;
|
||
```
|
||
Оператор `||=` принимает два операнда и выполняет следующие действия:
|
||
|
||
- Вычисляет операнды слева направо.
|
||
- Конвертирует ***a*** в логическое значение.
|
||
- Если ***a*** ложно, присваивает ***a*** значение ***b***.
|
||
|
||
### && (И)
|
||
```js
|
||
( true && true ); // true
|
||
( false && true ); // false
|
||
( true && false ); // false
|
||
( false && false ); // false
|
||
```
|
||
#### И «&&» находит первое ложное значение
|
||
```js
|
||
result = value1 && value2 && value3;
|
||
```
|
||
Оператор `&&` выполняет следующие действия:
|
||
|
||
- Вычисляет операнды слева направо.
|
||
- Каждый операнд преобразует в логическое значение. Если результат **false**, останавливается и возвращает исходное
|
||
значение этого операнда.
|
||
- Если все операнды были истинными, возвращается последний.
|
||
|
||
Другими словами, **И** возвращает первое ложное значение. Или последнее, если ничего не найдено.
|
||
|
||
Вышеуказанные правила схожи с поведением **ИЛИ**. Разница в том, что **И** возвращает первое ложное значение, а **ИЛИ**
|
||
первое истинное.
|
||
|
||
❗ ***Приоритет оператора && больше, чем у ||*** \
|
||
Приоритет оператора **И &&** больше, чем **ИЛИ ||**, так что он выполняется раньше.
|
||
|
||
Таким образом, код **a && b || c && d** по существу такой же,
|
||
как если бы выражения **&&** были в круглых скобках: **(a && b) || (c && d)**
|
||
|
||
❗ ***Не заменяйте if на || или &&*** \
|
||
Несмотря на то, что вариант с && кажется более коротким, if более нагляден и, как правило, более читабелен.
|
||
|
||
### &&= (Логическое присваивание И)
|
||
```js
|
||
a &&= b;
|
||
```
|
||
Принцип действия **&&=** практически такой же, как и у оператора логического присваивания **ИЛИ ||=**. \
|
||
Единственное отличие заключается в том, что **&&=** присвоит **a** значение **b** только в том случае, если **a**
|
||
истинно.
|
||
|
||
### ! (НЕ)
|
||
|
||
```js
|
||
result = !value;
|
||
```
|
||
|
||
Оператор принимает один аргумент и выполняет следующие действия:
|
||
|
||
1. Сначала приводит аргумент к логическому типу **true/false**.
|
||
2. Затем возвращает противоположное значение.
|
||
|
||
❗ Приоритет **НЕ !** является наивысшим из всех логических операторов, поэтому он всегда выполняется первым, перед **&&
|
||
** или **||**.
|
||
|
||
### Оператор нулевого слияния (??)
|
||
|
||
Результат выражения **a ?? b** будет следующим:
|
||
|
||
- если **a** определено, то **a**,
|
||
- если **a** не определено, то **b**.
|
||
|
||
Иначе говоря, оператор **??** возвращает первый аргумент, если он не **null/undefined**, иначе второй.
|
||
|
||
#### Сравнение с ||
|
||
|
||
Важное различие между ними заключается в том, что:
|
||
|
||
- || возвращает первое истинное значение.
|
||
- ?? возвращает первое определённое значение.
|
||
|
||
Приоритет оператора ?? такой же, как и у ||. Они оба равны 3 в таблице на MDN.
|
||
|
||
#### Использование ?? вместе с && или ||
|
||
|
||
По соображениям безопасности JavaScript запрещает использование оператора **??** вместе с **&&** и **||**, если
|
||
приоритет явно не указан при помощи круглых скобок.
|
||
```js
|
||
let x = 1 && 2 ?? 3; // Синтаксическая ошибка
|
||
```
|
||
|
||
Используйте скобки, чтобы обойти это ограничение:
|
||
```js
|
||
let x = (1 && 2) ?? 3; // Работает без ошибок
|
||
```
|
||
### Оператор нулевого присваивания (??=)
|
||
|
||
Предположим, нам необходимо проверить, равна ли переменная null или undefined, и если это так — присвоить этой
|
||
переменной какое-либо другое значение.
|
||
```js
|
||
let userAge = null;
|
||
|
||
if (userAge === null || userAge === undefined) {
|
||
userAge = 18;
|
||
}
|
||
```
|
||
|
||
Выглядит громоздко, правда? Существует оператор, более подходящий для подобных задач.
|
||
```js
|
||
x ??= y
|
||
```
|
||
|
||
Оператор **??=** присвоит **x** значение **y** только в том случае, если **x** не определено (null/undefined).
|
||
```js
|
||
let userAge = null;
|
||
userAge ??= 18;
|
||
alert(userAge) // 18
|
||
```
|
||
|
||
🚀 **Источник if-else: [https://learn.javascript.ru/ifelse](https://learn.javascript.ru/ifelse)**
|
||
🚀 **Источник logical ops: [https://learn.javascript.ru/logical-operators](https://learn.javascript.ru/logical-operators)**
|
||
🚀 **Источник nullish ops: [https://learn.javascript.ru/nullish-operators](https://learn.javascript.ru/nullish-operators)** |