Available operators

Logical Operators	What they mean
&&	AND
||	OR
!	NOT
!=	NOT EQUAL
&	Bitwise AND
|	Bitwise OR
^	Bitwise XOR
&=	AND Equal
|=	OR Equal
^=	XOR Equal

Results Table

A	B	A && B	A || B	A ?? B	!A
Falsy1	Falsy2	Falsy1	Falsy2	Falsy2*	Boolean(true)
Falsy1	Truthy1	Falsy1	Truthy1	Truthy1	Boolean(true)
Truthy1	Falsy1	Falsy1	Truthy1	Truthy1	Boolean(false)
Truthy1	Truthy2	Truthy2	Truthy1	Truthy1	Boolean(false)

• ?? operator can be seen as the special case of the || operator (hence, return value columns look identical)
  • ?? considers only null or undefined as falsy (returns right-hand side), otherwise it returns its left-hand side operand (e.g. 0, '', NaN, and false are not falsy for ??)

Falsy Values

/* What qualifies as falsy in JavaScript */
null
NaN
0
"", '', `` (empty strings)
undefined

/* ?? has different consideration of falsy */
null
undefined

/* && has operator precedence over || */
true || false && false // true because && is executed first 
// true || false // true
(true || false) && false // false because () has highest precedence 
// true && false // false

Logical Operators

a || (b * c);  // evaluate `a` first, then produce `a` if `a` is "truthy"
a && (b < c);  // evaluate `a` first, then produce `a` if `a` is "falsy"
a ?? (b || c); // evaluate `a` first, then produce `a` if `a` is not `null` and not `undefined`
a?.b.c;        // evaluate `a` first, then produce `undefined` if `a` is `null` or `undefined`

|| Logical OR

The logical OR || operator (logical disjunction) for a set of operands is true if and only if one or more of its operands is true

• 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

expr1 || expr2

• If expr1 can be converted to true, returns expr1; else, returns expr2

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

• (some truthy expression) || expr is short-circuit evaluated to the truthy expression
  • Short circuit means that the expr part above is not evaluated
  • if expr is a function call, the calling never takes place

function A(){ console.log('called A'); return false; }
function B(){ console.log('called B'); return true; }

console.log( B() || A() );
// logs "called B" due to the function call,
// then logs true (which is the resulting value of the operator)
// does NOT call "called A"

More Examples

o1 = true  || true       // t || t returns true
o2 = false || true       // f || t returns true
o3 = true  || false      // t || f returns true
o4 = false || (3 == 4)   // f || f returns false
o5 = 'Cat' || 'Dog'      // t || t returns "Cat"
o6 = false || 'Cat'      // f || t returns "Cat"
o7 = 'Cat' || false      // t || f returns "Cat"
o8 = ''    || false      // f || f returns false
o9 = false || ''         // f || f returns ""
o10 = false || varObject // f || object returns varObject

Use Case: Using || operator for object null value handling

/* undefined is a falsy value so we print what is on the other side of || */
let person = {
  name: 'Jack',
  age: 34
};

console.log(person.job || 'unemployed'); // 'unemployed'

/* when a truthy value is provided on the left side, the equation short-circuits to left-side value */
let person = {
  name: 'Jack',
  age: 34,
  job: 'teacher'
};

console.log(person.job || 'unemployed'); // teacher

Converting AND to OR

condition1 && condition2

// is always equal to:
!(!condition1 || !condition2)

condition1 || condition2

// is always equal to:
!(!bCondition1 && !bCondition2)