Working with Logical Operators in JavaScript

Last Updated: 25th April, 2024

Introduction

JavaScript supports logical operators that allow developers to compare values and make decisions based on the result of those comparisons. In this lesson, we will explore the three logical operators in JavaScript: AND (&&), OR (||), and NOT (!), and provide examples of how they can be used in code.

AND (&&) Operator

The AND operator returns true if both operands are true, and false otherwise. The syntax for the AND operator is &&. The following table shows the truth table for the AND operator:

Example:

Loading...
 Run

In this example, the AND operator is used to check if both num1 and num2 are positive. If both operands are positive, the console will output "Both numbers are positive".

OR (||) Operator

The OR operator returns true if at least one of the operands is true, and false otherwise. The syntax for the OR operator is ||. The following table shows the truth table for the OR operator:

Example:

Loading...
 Run

In this example, the OR operator is used to check if at least one of num1 and num2 is positive. If at least one operand is positive, the console will output "At least one number is positive".

NOT (!) Operator

The NOT operator negates the value of its operand. If the operand is true, the NOT operator returns false. If the operand is false, the NOT operator returns true. The syntax for the NOT operator is !.

Example:

Loading...
 Run

In this example, the NOT operator is used to check if num1 is not greater than 10. If num1 is not greater than 10, the console will output "num1 is not greater than 10".

Logical operator precedence

Logical operator precedence determines the order in which logical operators are evaluated in an expression. In JavaScript, logical operator precedence is as follows:

1. NOT (!)
2. AND (&&)
3. OR (||)

This means that NOT (!) is evaluated first, followed by AND (&&), and finally OR (||).

Example:

Loading...
 Run

In this example, the expression false || true && false is evaluated. According to the operator precedence rules, the AND operator (&&) is evaluated first, so true && false is evaluated, which returns false. Next, the OR operator (||) is evaluated, so false || false is evaluated, which returns false. Therefore, the value of result is false, and the console will output "false".

To avoid confusion and ensure that the expressions are evaluated as intended, developers can use parentheses to group the expressions in the desired order. For example:

Loading...
 Run

In this example, the parentheses group the OR operation (||) first, so false || true is evaluated, which returns true. Next, the AND operation (&&) is evaluated, so true && false is evaluated, which returns false. Therefore, the value of result is false, and the console will output "false".

Chain of operators

Chain of operators, also known as a series of operators, refers to the use of multiple logical operators in an expression. In JavaScript, the order in which operators are evaluated is determined by their precedence, as we discussed earlier. However, when multiple operators have the same precedence, the order of evaluation is determined by their associativity.

In JavaScript, logical operators are left-associative, which means that expressions are evaluated from left to right. This means that if multiple operators have the same precedence, the operator on the left side of the expression is evaluated first.

Example:

Loading...
 Run

In this example, the expression false || true && false || true is evaluated. According to the operator precedence rules, the AND operator (&&) is evaluated first, so true && false is evaluated, which returns false. Next, the first OR operator (||) is evaluated, so false || false is evaluated, which returns false. Finally, the second OR operator (||) is evaluated, so false || true is evaluated, which returns true. Therefore, the value of result is true, and the console will output "true".

Best Practices

1. Use parentheses to group expressions: To avoid confusion and ensure that expressions are evaluated as intended, it's a good practice to use parentheses to group expressions in the desired order. This is especially important when multiple operators are used in an expression.
2. Avoid complex expressions: While logical operators can be used to create complex conditions, it's important to avoid creating expressions that are too complex or difficult to read. This can make the code harder to maintain and debug.
3. Use descriptive variable and function names: When using logical operators, it's important to use descriptive variable and function names that convey the purpose and intent of the code. This makes it easier for other developers to understand the code and make changes or updates as needed.
4. Be aware of operator precedence: Understanding operator precedence is important to ensure that expressions are evaluated as intended. By following the operator precedence rules and using parentheses to group expressions when necessary, developers can avoid errors and create more reliable code.
5. Use short-circuit evaluation: Short-circuit evaluation is a technique used to improve the efficiency of code that uses logical operators. By using short-circuit evaluation, the code can skip unnecessary evaluations and save time and resources.

Conclusion

In conclusion, logical operators are an important aspect of programming that allows developers to make decisions based on the result of comparisons. JavaScript supports three logical operators: AND (&&), OR (||), and NOT (!). The AND operator returns true if both operands are true, the OR operator returns true if at least one operand is true, and the NOT operator negates the value of its operand. By following the operator precedence rules and using parentheses to group expressions when necessary, developers can avoid errors and create more reliable code.