Scribd
Upload
6 views2 pages

Understanding JavaScript Logical OR (||)

Uploaded by

mayuri.softwaredeveloper
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
6 views2 pages

Understanding JavaScript Logical OR (||)

Uploaded by

mayuri.softwaredeveloper
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd

Logical OR (||)

Baseline Widely available




The logical OR (||) (logical disjunction) operator for a set of operands is true if and
only if one or more of its operands is true. It is typically used with boolean (logical)
values. When it is, it returns a Boolean value. However, the || operator actually returns
the value of one of the specified operands, so if this operator is used with non-Boolean
values, it will return a non-Boolean value.

Try it
Syntax
JSCopy to Clipboard
x || y

Description
If x can be converted to true, returns x; else, returns y.

If a value can be converted to true, the value is so-called truthy. If a value can be
converted to false, the value is so-called falsy.

Examples of expressions that can be converted to false are:

 null;
 NaN;
 0;
 empty string ("" or '' or ``);
 undefined.

Even though the || operator can be used with operands that are not Boolean values, it
can still be considered a boolean operator since its return value can always be
converted to a boolean primitive. To explicitly convert its return value (or any
expression in general) to the corresponding boolean value, use a double NOT
operator or the Boolean() constructor.

Short-circuit evaluation

The logical OR expression is evaluated left to right, it is tested for possible "short-
circuit" evaluation using the following rule:

(some truthy expression) || expr is short-circuit evaluated to the truthy expression.


Short circuit means that the expr part above is not evaluated, hence any side effects
of doing so do not take effect (e.g., if expr is a function call, the calling never takes
place). This happens because the value of the operator is already determined after the
evaluation of the first operand. See example:

JSCopy to Clipboard
function A() {
[Link]("called A");
return false;}function B() {
[Link]("called B");
return true;}

[Link](B()|| A());// Logs "called B" due to the function call,// then
logs true (which is the resulting value of the operator)

Operator precedence

The following expressions might seem equivalent, but they are not, because
the && operator is executed before the || operator (see operator precedence).

JSCopy to Clipboard
true || false && false; // returns true, because && is executed
first(true || false) && false; // returns false, because grouping has the
highest precedence

Examples
Using OR

The following code shows examples of the || (logical OR) operator.

JSCopy to Clipboard
true || true; // t || t returns truefalse || true; // f || t returns truetrue ||
false; // t || f returns truefalse || 3 === 4; // f || f returns false"Cat" ||
"Dog"; // t || t returns "Cat"false || "Cat"; // f || t returns "Cat""Cat" ||
false; // t || f returns "Cat""" || false; // f || f returns falsefalse || ""; // f
|| f returns ""false || varObject; // f || object returns varObject
Note: If you use this operator to provide a default value to some
variable, be aware that any falsy value will not be used. If you only
need to filter out null or undefined, consider using the nullish
coalescing operator.

Common questions

Powered by AI

One should consider using the nullish coalescing operator instead of the logical OR (||) operator when a default value needs to be assigned only if the initial value is null or undefined, rather than any falsy value. The logical OR operator treats any falsy value (e.g., 0, "", NaN) as false, which may not be the intended behavior when only null or undefined should trigger the default .

Short-circuit evaluation can be beneficial as it prevents unnecessary computation. For example, in the expression `functionA() || functionB()`, if `functionA()` returns true, `functionB()` is not called, thereby saving computation time and possibly preventing undesired side effects from `functionB()` .

In short-circuit evaluation with the logical OR (||) operator, the evaluation stops as soon as a truthy value is encountered. The second operand is not evaluated if the first one determines the result of the expression. This can prevent the execution of functions or expressions that have side effects, as they are not evaluated once a truthy operand is found .

The result of the expression `true || false && false` is true. This is because the '&&' operator has higher precedence than the '||' operator, so 'false && false' is evaluated first, resulting in false. Then 'true || false' is evaluated, resulting in true .

When the logical OR (||) operator is applied to a mix of Boolean and non-Boolean values, it returns the first operand if it is truthy; otherwise, it returns the second operand, regardless of whether the operands are Boolean or not. The return is not necessarily a Boolean value but rather one of the operands .

A common pitfall is mistakenly using the logical OR (||) operator when any falsy value might inappropriately trigger the assignment of a default value. This occurs with values like 0, empty strings, or NaN that are falsy. If the intention is only to substitute when a value is null or undefined, this misuse can lead to unexpected behavior .

Short-circuit evaluation influences function call behavior by potentially skipping the execution of functions. When a function call is the second operand in a logical OR (||) expression, it won't be called if the first operand is truthy, thus avoiding any side effects or computations the function may perform .

When the logical OR (||) operator is used with non-Boolean operands, it returns the value of the first operand if it can be converted to true (truthy); otherwise, it returns the second operand .

Operator precedence affects the evaluation of expressions by determining the order in which operations are performed. In JavaScript, the && operator has higher precedence than the || operator, so in an expression containing both, && is evaluated before ||. Parentheses can be used to group expressions and alter this default precedence, ensuring that terms are evaluated in the desired order .

Understanding truthy and falsy values is important when using the logical OR (||) operator because its behavior depends on these concepts. The operator returns the first truthy operand or the last operand if none are truthy. Misinterpreting which values are truthy or falsy can lead to unexpected results, especially when handling default values or performing conditional checks .

You might also like