- Object-Oriented JavaScript(Second Edition)
- Stoyan Stefanov Kumar Chetan Sharma
- 897字
- 2021-08-13 16:19:28
Logical operators
There are three operators, called logical operators, that work with Boolean values. These are:
!
– logical NOT (negation)&&
– logical AND||
– logical OR
You know that when something is not true, it must be false. Here's how this is expressed using JavaScript and the logical !
operator:
> var b = !true;
> b;
false
If you use the logical NOT twice, you get the original value:
> var b = !!true;
> b;
true
If you use a logical operator on a non-Boolean value, the value is converted to Boolean behind the scenes:
> var b = "one";
> !b;
false
In the preceding case, the string value "one"
is converted to a Boolean, true
, and then negated. The result of negating true
is false
. In the next example, there's a double negation, so the result is true
:
> var b = "one";
> !!b;
true
You can convert any value to its Boolean equivalent using a double negation. Understanding how any value converts to a Boolean is important. Most values convert to true
with the exception of the following, which convert to false
:
- The empty string
""
null
undefined
- The number
0
- The number
NaN
- The Boolean
false
These six values are referred to as falsy, while all others are truthy (including, for example, the strings "0"
, " "
, and "false"
).
Let's see some examples of the other two operators—the logical AND (&&
) and the logical OR (||
). When you use &&
, the result is true
only if all of the operands are true
. When you use ||
, the result is true
if at least one of the operands is true
:
> var b1 = true, b2 = false; > b1 || b2; true > b1 && b2; false
Here's a list of the possible operations and their results:

You can use several logical operations one after the other:
> true && true && false && true; false > false || true || false; true
You can also mix &&
and ||
in the same expression. In such cases, you should use parentheses to clarify how you intend the operation to work. Consider these:
> false && false || true && true; true > false && (false || true) && true; false
Operator precedence
You might wonder why the previous expression (false && false || true && true
) returned true
. The answer lies in the operator precedence. As you know from mathematics:
> 1 + 2 * 3;
7
This is because multiplication has higher precedence over addition, so 2 * 3
is evaluated first, as if you typed:
> 1 + (2 * 3);
7
Similarly for logical operations, !
has the highest precedence and is executed first, assuming there are no parentheses that demand otherwise. Then, in the order of precedence, comes &&
and finally ||
. In other words, the following two code snippets are the same:
> false && false || true && true;
true
and
> (false && false) || (true && true);
true
Tip
Best practice
Use parentheses instead of relying on operator precedence. This makes your code easier to read and understand.
The ECMAScript standard defines the precedence of operators. While it may be a good memorization exercise, this book doesn't offer it. First of all, you'll forget it, and second, even if you manage to remember it, you shouldn't rely on it. The person reading and maintaining your code will likely be confused.
Lazy evaluation
If you have several logical operations one after the other, but the result becomes clear at some point before the end, the final operations will not be performed because they don't affect the end result. Consider this:
> true || false || true || false || true;
true
Since these are all OR operations and have the same precedence, the result will be true
if at least one of the operands is true
. After the first operand is evaluated, it becomes clear that the result will be true
, no matter what values follow. So, the JavaScript engine decides to be lazy (OK, efficient) and avoids unnecessary work by evaluating code that doesn't affect the end result. You can verify this short-circuiting behavior by experimenting in the console:
> var b = 5; > true || (b = 6); true > b; 5 > true && (b = 6); 6 > b; 6
This example also shows another interesting behavior: if JavaScript encounters a non-Boolean expression as an operand in a logical operation, the non-Boolean is returned as a result:
> true || "something"; true > true && "something"; "something" > true && "something" && true; true
This behavior is not something you should rely on because it makes the code harder to understand. It's common to use this behavior to define variables when you're not sure whether they were previously defined. In the next example, if the variable mynumber
is defined, its value is kept; otherwise, it's initialized with the value 10
:
> var mynumber = mynumber || 10;
> mynumber;
10
This is simple and looks elegant, but be aware that it's not completely foolproof. If mynumber
is defined and initialized to 0 (or to any of the six falsy values), this code might not behave as you expect:
> var mynumber = 0;
> var mynumber = mynumber || 10;
> mynumber;
10
- Learning C# by Developing Games with Unity 2020
- PHP 從入門到項目實踐(超值版)
- R語言數據可視化之美:專業圖表繪制指南
- Getting Started with PowerShell
- ASP.NET Core 2 and Vue.js
- 青少年Python編程入門
- jQuery開發基礎教程
- 數據結構習題解析與實驗指導
- Getting Started with LLVM Core Libraries
- C語言程序設計
- Python全棧數據工程師養成攻略(視頻講解版)
- Learning Apache Karaf
- Django 3.0應用開發詳解
- 零代碼實戰:企業級應用搭建與案例詳解
- Kotlin語言實例精解