JavaScript Logical Operators

❮ Prev Next ❯

Logical operators are typically used to determine the logic between variables or values. They return a Boolean value of true or false depending on the evaluation. There are three logical operators in JavaScript: || (OR), && (AND), ! (NOT).

They are called “logical”, but can be applied to values of any type, their result can also be of any type.

|| (OR)

The OR operator is performed with two vertical lines and can manipulate boolean values only. The logical || (OR) can manipulate boolean values only. In case any of its arguments are true, it returns true, if not, it returns false. With this operator, at least one of the statements has to evaluate to true, otherwise it returns false.

boolValue = a || b;

There are four possible logical combinations:

javascript OR operator

console.log( true || true ); // true console.log( false || true ); // true console.log( true || false ); // true console.log( false || false ); // false

As you see, the result is always true except for the case when both operands are false. If an operand isn’t a boolean, then it’s converted to a boolean for the rating.

For instance, the number 1 is attended as true, the number 0 as false:

javascript OR operator

if (1 || 0) { //works the same way( true || false ) console.log('true!'); }

Sometimes || (OR) is used in an if statement to test if any of the given conditions is true.

javascript OR operator

let age = 10; if (age > 0 || age < 18) { console.log('You are too young'); }

|| (OR) finds the first truthy value

Described above logic is classical. Now let’s discuss the “extra” attributes of JavaScript. The extended algorithm works as follows.

Given multiple OR’ed values:

result = value1 || value2 || value3;

The || (OR) operator executes the following things:

Evaluates operands from left to right.
For each operand, converts it to boolean. In case the result is true, it stops and returns the original value of that operand.
If all operands are false, it returns the last operand.

A value is returned in its initial form, without any changes.

javascript multiple OR operator

console.log( 0 || 1); // 1 (1 is truthy) console.log( true || 'anything' ); // (true is truthy) console.log( 1 || null ); // 1 (1 is truthy value) console.log( null || 0 || 1 ); // 1 (1 is the first truthy value) console.log( undefined || null || 0 ); // 0 ( returns the last value, because all falsy )

&& (AND)

The AND operator is performed with two ampersands &&and returns true if both operands are truthy and false otherwise:

javascript multiple AND operator

console.log( true && true ); // true console.log( false && true ); // false console.log( true && false ); // false console.log( false && false ); // false

Example of the AND operator with if:

javascript multiple AND operator

let hour = 11; if (hour > 10 && hour < 18) { console.log('We are open!'); }

&& (AND) finds the first falsy value

Given multiple AND’ed values:

result = value1 && value2 && value3;

The AND && operator makes the following:

Asses operands from left to right.
Converts it to a boolean for each operand. In case the result is false, it stops and returns the original value of that operand.
If all operands were truthy, it returns the last operand.

Shortly, AND returns the first falsy value or the last value if none were found.

The rules above are similar to OR. The difference between them is that AND returns the first falsy value while OR returns the first truthy one.

AND returns the second operand if the first operand is truthy:

javascript AND operator

console.log( 1 && 0 ); // 0 console.log( 1 && 6); // 6

AND returns the first operand, if it is false, the second operand is ignored:

javascript AND operator

console.log( null && 6 ); // null console.log( 0 && "anything" ); // 0

! (NOT)

The logical NOT operator is represented with an exclamation sign ! (NOT) . It reverses or negates the value of a boolean.

It’s syntax is very simple:

result = !value;

The operator accepts a single argument and does presented below functions:

Transforms the operand to boolean type: true/false.
Returns the opposite value.

Example of the NOT operator:

javascript Not operator

console.log( !false ); // true console.log( !1 ); // false

Sometimes we use a double !! (NOT) to convert a value to boolean type:

javascript Not operator

console.log( !!"not-empty string" ); // true console.log( !!null ); // false

The first NOT transforms the value to boolean and returns the opposite, the second NOT inverses it again. After all, we have a plain value-to-boolean conversion.

There’s a little more wordy way to do the same thing – a built-in Boolean function:

javascript Not operator

console.log( Boolean("not-empty string") ); // true console.log( Boolean(null) ); // false

The priority of ! (NOT) is the highest of all logical operators, that’s why it always executes first, before && or ||.