Логические операторы | Основы JavaScript
Для перемещения по курсу нужно зарегистрироваться
1. Введение ↳ теория
2. Hello, World! ↳ теория / тесты / упражнение
3. Инструкции ↳ теория / тесты / упражнение
4. Арифметические операции ↳ теория / тесты / упражнение
5. Ошибки оформления (синтаксиса и линтера) ↳ теория / тесты / упражнение
6. Строки ↳ теория / тесты / упражнение
7. Переменные ↳ теория / тесты / упражнение
8. Выражения в определениях ↳ теория / тесты / упражнение
9. Именование ↳ теория / тесты / упражнение
10. Интерполяция ↳ теория / тесты / упражнение
11. Извлечение символов из строки ↳ теория / тесты / упражнение
12. Типы данных ↳ теория / тесты / упражнение
13. Неизменяемость и примитивные типы ↳ теория / тесты / упражнение
14. Функции и их вызов ↳ теория / тесты / упражнение
15. Сигнатура функции ↳ теория / тесты / упражнение
16. Вызов функции — выражение ↳ теория / тесты / упражнение
17.
18. Детерминированность ↳ теория / тесты / упражнение
19. Стандартная библиотека ↳ теория / тесты / упражнение
20. Свойства и методы ↳ теория / тесты / упражнение
21. Цепочка вызовов ↳ теория / тесты / упражнение
22. Определение функций ↳ теория / тесты / упражнение
23. Возврат значений ↳ теория / тесты / упражнение
24. Параметры функций ↳ теория / тесты / упражнение
25. Необязательные параметры функций ↳ теория / тесты / упражнение
26. Упрощенный синтаксис функций ↳ теория / тесты / упражнение
27. Логика ↳ теория / тесты / упражнение
28. Логические операторы ↳ теория / тесты / упражнение
29. Результат логических операций ↳ теория / тесты / упражнение
30. Условные конструкции ↳ теория / тесты / упражнение
31. Тернарный оператор ↳ теория / тесты / упражнение
32. Конструкция Switch ↳ теория / тесты / упражнение
33. Цикл while ↳ теория / тесты / упражнение
34. Агрегация данных ↳ теория / тесты / упражнение
35. Обход строк в цикле ↳ теория / тесты / упражнение
36. Условия внутри тела цикла ↳ теория / тесты / упражнение
37. Инкремент и декремент ↳ теория / тесты / упражнение
38. Цикл for ↳ теория / тесты / упражнение
39. Модули ↳ теория / тесты / упражнение
Испытания
1. Фибоначчи
2. Найди Fizz и Buzz
3. Переворот числа
4. Счастливый билет
5. Фасад
6. Идеальные числа
7. Инвертированный регистр
8. Счастливые числа
Порой обучение продвигается с трудом. Сложная теория, непонятные задания… Хочется бросить. Не сдавайтесь, все сложности можно преодолеть. Рассказываем, как
Не понятна формулировка, нашли опечатку?
Выделите текст, нажмите ctrl + enter и опишите проблему, затем отправьте нам. В течение нескольких дней мы улучшим формулировку или исправим опечатку
Что-то не получается в уроке?
Загляните в раздел «Обсуждение»:
- Изучите вопросы, которые задавали по уроку другие студенты — возможно, ответ на ваш уже есть
- Если вопросы остались, задайте свой. Расскажите, что непонятно или сложно, дайте ссылку на ваше решение. Обратите внимание — команда поддержки не отвечает на вопросы по коду, но поможет разобраться с заданием или выводом тестов
- Мы отвечаем на сообщения в течение 2-3 дней. К «Обсуждениям» могут подключаться и другие студенты. Возможно, получится решить вопрос быстрее!
Подробнее о том, как задавать вопросы по уроку
JavaScript. Логические операторы
Содержание
- 1 Логическое И (AND) в JS
- 2 Логическое ИЛИ (OR) в JS
- 3 Логическое НЕ (NOT) в JS
Логические операторы в JavaScript очень часто используются в условных выражениях if…else. Есть три основных логических оператора:
- И (AND) — &&
- ИЛИ (OR) —
||
- НЕ (NOT) —
!
Логическое И (AND) в JS
Логическое И записывается двумя амперсандами &&
и возвращает true
, если оба выражения (слева и справа) вернут true
. Т.е. и значение слева, и значение справа должны быть true
, тогда оператор вернет true
.
true && true
Оператор И в JavaScript выполняет сравнение слева направо, преобразовывает выражение (операнд) в логическое значение и вернет false
как только одно из значений будет false
let bool1 = false, bool2 = true;
let result = bool1 && bool2; // false
Как только выполнение кода дойдет до bool1
, а эта переменная равняется false
, тогда код дальше выполняться не будет, т.к. не важно что будет дальше, потому что первое значение ложь
.
Вот несколько примеров и результат, что будет возвращено в итоге:
let pr1 = true && true; // true
let pr2 = true && false; // false
let pr3 = false && true; // false
let pr4 = 'Hello' && 'World'; // true, т.к. строковое значение (не пустое) вернет true
let pr5 = '' && 'Hello'; // false
let pr6 = 1 && 0; // false
Можно также сравнивать несколько значений:
val1 && val2 && val3
Так как данный оператор приводит к логическому выражению, мы можем передавать разные данные (строки, числа, функцию, которая будет что-то возвращать и так далее).
let val1 = ''; // пустая строка, это false
let arr1 = [1, 2];
if (val1 && arr1.length) {}
В примере выше, мы в условие передаем пустую строку и проверяем длину массива, и т.к. пустая строка нам вернет false в булевом значении, у нас данное условие не сработает.
Логическое ИЛИ (OR) в JS
Логический оператор ИЛИ будет возвращать true
, если хоть одно из значений (слева или справа) будет истинно, т.е. будет true
:
let result = true || false; // result = true;
Также как и оператор И, он приводит операнды слева и справа к булевому значению.
let pr1 = true || true; // true
let pr2 = true || false; // true
let pr3 = false || true; // true
let pr4 = 'Hello' || 'World'; // true, т.к. строковое значение (не пустое) вернет true
let pr5 = '' || 'Hello'; // true
let pr6 = 1 || 0; // true
Также с данным оператором можно проверять несколько значений
let val1 = 1, val2 = 0, val3 = 'string';
if (val1 || val2 || val3) {}
Данное условие будет выполнено, т. к. хоть одно из значений будет true
(в нашем случае val1 = 1
— true, val3 = 'string'
— тоже true)
Логическое НЕ (NOT) в JS
Оператор НЕ работает следующим образом:
- Приводит выражение к булевому значению (true/false)
- Затем делает отрицание, т.е. на
true
возвращаетfalse
, а наfalse
возвращаетtrue
.
let bool1 = !true; // будет равно false
let bool2 = !false; // будет равно true
let isLoading = false;
if (!isLoading) {
// Если данные уже загружены, тогда делай следующее...
}
Оператор отрицания также часто используется в конструкции if…else. Допустим у вас есть приложение, при загрузке данных вы переменной isLoading
присваиваете значение true
(например, для отображения индикатора загрузки) и как только данные получены, хотите их отобразить, тогда вам нужно проверить, что переменная isLoading
не равняется true
, т. е. загрузка данных завершена. Условие выше аналогично следующей записи:
if (isLoading === false) {}
Ваши вопросы и комментарии:
операторов JavaScript — javatpoint
следующий → ← предыдущая Операторы JavaScript — это символы, используемые для выполнения операций над операндами. Например: сумма переменных=10+20; Здесь + — арифметический оператор, а = — оператор присваивания. В JavaScript есть следующие типы операторов.
Арифметические операторы JavaScriptАрифметические операторы используются для выполнения арифметических операций над операндами. Следующие операторы известны как арифметические операторы JavaScript.
Операторы сравнения JavaScriptОператор сравнения JavaScript сравнивает два операнда. Операторы сравнения следующие:
Javascript Bitвись.Побитовые операторы выполняют побитовые операции над операндами. Побитовые операторы следующие: 920 == 33) = False | ||||||||||||||||||||||||||||||||||||||||||||||||||||
~ | BITWISE NOT | (~ 10) = -10 | ||||||||||||||||||||||||||||||||||||||||||||||||||
BITWISE LEF (10>>2) = 2 | ||||||||||||||||||||||||||||||||||||||||||||||||||||
>>> | Побитовый сдвиг вправо с нулем | (10>>2) = 2 |
Логические операторы JavaScript
Следующие операторы известны как логические операторы JavaScript.
Оператор | Описание | Пример |
---|---|---|
&& | Логическое И | (10==20 && 20==33) = ложь | Логическое ИЛИ | (10==20 || 20==33) = ложь |
! | Логический Не | !(10==20) = true |
Операторы присваивания JavaScript
Следующие операторы известны как операторы присваивания JavaScript.
Оператор | Описание | Пример | ||
---|---|---|---|---|
= | Назначен | 10 +10 = 20 | ||
+= | Добавить и назначить | VAR A = 100004 += | . ADD и назначить | . а+=20; Теперь a = 30 |
-= | Вычесть и присвоить | var a=20; а-=10; Теперь a = 10 | ||
*= | Умножьте и присвойте | var a=10; а*=20; Теперь а = 200 | ||
/= | Разделить и присвоить | var a=10; а/=2; Теперь a = 5 | ||
%= | Модуль и присвоить | var a=10; а%=2; Теперь a = 0 |
Специальные операторы JavaScript
Следующие операторы известны как специальные операторы JavaScript.
Оператор | Описание | |
---|---|---|
(?:) | Условный оператор возвращает значение на основе условия. Это как если-иначе. | |
, | Оператор запятой позволяет вычислять несколько выражений как один оператор. | |
удалить | Удалить Оператор удаляет свойство из объекта. | |
в | в проверке операторов, если объект имеет данное свойство | |
Encementof | Проверки, если объект является экземпляром данного типа | |
Новый | . тип | проверяет тип объекта. |
void | отбрасывает возвращаемое выражением значение. | |
yield | проверяет, что возвращается в генераторе итератором генератора. |
Next TopicJavaScript Оператор if-else
← предыдущая следующий →
Освоение JavaScript && и || логические операторы | Николас Маркора
Это распространенное заблуждение, что сами по себе с помощью AND &&
или ИЛИ || Операторы
всегда должны возвращать true
или false
. Это НЕ так, и в этом коротком посте я хотел бы изучить, как цепочка &&
s и ||
будут вести себя на самом деле, и как мы можем использовать это в своих интересах.
Приведение типов
Прежде всего, краткое примечание о приведении типов: true
и false
являются логическими значениями
. Привести значение к логическому значению означает взять любое значение, которое НЕ равно 9.0421 true или false
и попытайтесь преобразовать его в любой из них. В JavaScript вы можете легко проверить результат преобразования любого значения в логическое значение, набрав: Boolean(value)
. Давайте попробуем это в консоли:
Вы можете видеть, что некоторые значения оцениваются как true
, а другие как false
. Эти значения обычно называют истинными и ложными значениями. Таким образом, вы можете сказать, что любое значение, которое при преобразовании в логическое значение становится равным true
является истинным, в то время как любое значение, которое становится false
, является ложным.
Теперь, когда мы разобрались с этим, давайте перейдем к тому, как &&
и ||
вести себя.
Оператор И ( && )
В цепочке из &&
с каждое значение будет оцениваться слева направо. Если какое-либо из этих значений окажется ложным , это значение будет возвращено, и цепочка не будет продолжена. Если цепочка не разорвется до достижения конца, будет возвращено последнее значение в цепочке.
Давайте откроем нашу консоль и проверим это:
Вы это видите? Давайте рассмотрим это шаг за шагом:
В первом примере мы проверяем наше первое значение, оно истинно, поэтому мы переходим к следующему значению, которое является ложным, поэтому мы возвращаем его и останавливаемся на этом.
Во втором примере происходит то же самое. Мы проверяем первое значение, которое является истинным, мы проверяем второе значение, которое является ложным, поэтому мы возвращаем его и останавливаемся на этом. Обратите внимание, что хотя и существует третье значение, которое на самом деле является истинным, это значение никогда не достигается, потому что перед ним появилось ложное значение, которое разорвало цепочку.
Третий пример показывает такое же поведение, только с другим типом ложного значения.
Последний пример показывает, что если все значения в цепочке истинны, возвращается последнее значение в цепочке.
Оператор ИЛИ ( || )
|| Оператор
ведет себя точно так же, как &&
, только наоборот! В то время как цепочка &&
s разорвется, если будет найдено ложное значение, цепочка ||
сломается, когда найдет истинное значение . И, как и в случае с &&
s, если нет истинных значений и достигнут конец цепочки, возвращается последнее значение в этой цепочке.
Давайте также проверим это в консоли:
Вы можете видеть, что они также следуют одному и тому же шаблону:
В первом примере цепочка заканчивается, когда это верное
найдено и возвращено.
Во втором примере цепочка обрывается, потому что "Я правдив"
является истинным значением, поэтому цепочка разрывается и возвращается "Я правдив"
.
В третьем примере , несмотря на то, что ВСЕ значения в цепочке верны, цепочка разрывается после того, как первое значение оказывается правдивым и возвращается, поэтому две другие строки, следующие за ним, никогда не оцениваются.
В последних 2-х примерах видно, как, когда все значения в цепочке ложны, возвращается последнее значение в цепочке.
Внутри оператора if
Вот что происходит, когда вы используете эти цепочки внутри оператора if
:
Получение немного большей функциональности
Использование логических операторов таким более практичным способом обычно называется оценкой короткого замыкания .
До сих пор мы видели только такие значения, как строки, undefined, null и оцениваемые объекты. Это уже может быть полезно само по себе, но что, если я скажу вам, что вы также можете помещать функции внутрь этих цепочек?
Что здесь происходит?
Сначала проверяется истинная переменная
, и поскольку это непустая строка, она оценивается как истинная
, и поэтому код переходит к проверке следующего значения… Только это значение является функцией! Итак, функция запускается, и JavaScript оценивает значение , возвращаемое функцией
. Таким образом, truey && doSomeStuff()
в конечном итоге становится «Я правдивый» && «хороший»
после оценки обоих значений, и "хорошо"
возвращается, потому что это последняя истина в этой цепочке &&
. Но для того, чтобы получить это значение "хорошо"
, функция должна была быть выполнена, и выполнял действия
, которые были зарегистрированы в консоли. Это означает, что когда функция оценивается, она запускается, и любой код, который мы туда вставляем, выполняется. Надеюсь, мы начинаем видеть, как мы можем использовать это в наших интересах!
Представьте, что у вас есть переменная userIsLoggedIn
, которая установлена до true
или false
, сообщающие нам, вошел ли пользователь в систему или нет. Теперь мы можем сделать что-то вроде этого в нашем коде:
В этом случае нам все равно, что вернет выражение, но мы хотим выполнить эту функцию только в том случае, если пользователь зарегистрирован в . Мы используем это выражение для его побочных эффектов, а не для возвращаемого значения.
Эта единственная строка будет делать то же самое, что и этот код:
Но разве это не выглядит намного чище? Я лично думаю, что да!
Пойдем немного дальше:
Здесь мы хотим выполнить эту функцию sendLetter()
, но только если пользователь существует, у него есть адрес и в адресе есть первая строка. Если в какой-либо точке цепочки значение окажется ложным, то цепочка разорвется и sendLetter()
вызываться не будет.
Использование логических операторов в дикой природе
Это компонент React. Если вы посмотрите на строку 8 , вы увидите 9Оператор 0421 && используется для включения приветствия h2 пользователю, но только если доступно имя
пользователя.
Если вы хотите узнать немного больше о React с самого начала, я рекомендую вам взглянуть на мою предыдущую статью: React from Scratch.
Я нашел эту функцию в официальной кодовой базе React на Github, вы можете найти ее здесь. Он используется для проверки того, является ли объект допустимым элементом React, и возвращает true
, если все условия выполнены, или false, если любое из условий равно 9.0421 ложь и разорвет цепочку.
Смешивание вещей
Хотя не рекомендуется смешивать &&
и ||
вместе, я просто хотел указать, что &&
имеет приоритет над ||
при вычислении, подобно тому, как умножение *
имеет приоритет над сложением +
в математике. Итак:
'весна' && 'зубная паста || 'зима' && 'конфеты'
будут оцениваться как:
("весна" && "зубная паста") || («зима» && «конфеты»)
Другими словами, &&
будут сгруппированы вместе.
Предупреждение
Вполне вероятно, что когда вы впервые начнете изучать JavaScript, вы будете использовать и находить эти операторы только внутри операторов if
, и это совершенно нормально. Но по мере того, как вы начнете продвигаться вперед и читать более продвинутые базы кода, такие как библиотеки, вы начнете видеть их и чаще использовать, чтобы сделать свой код чище и лаконичнее.
Все, что в избытке, может быть вредным, поэтому, прежде чем использовать их, всегда думайте, делаете ли вы свой код легче или сложнее для чтения. Читабельность имеет значение!
Подводя итог
Логические операторы &&
и ||
очень универсальны и часто неправильно понимаются.