Logical Operators

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:

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:

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.

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.

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:

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:

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:

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

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

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

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:

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

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

console.log( !!null ); // false

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

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

console.log( !!null ); // false

The first NOT transform 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:

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 ||.