Binary Logical Operators in JavaScript

19 min read·Jan 1, 2026

In JavaScript, when a non-boolean value is used in a boolean context, for example in a conditional statement, such as an if, this value is automatically coerced into either true or false to avoid unexpected behavior.

Any value that is considered true when evaluated in a boolean context is called truthy, and includes:

  • true
  • non-empty strings (e.g., "hello", "0", "false")
  • non-zero numbers (e.g., 1, -2.5)
  • arrays (even empty)
  • objects (even empty)
  • functions

On the other hand, any value that is considered false when evaluated in a boolean context is called falsy, and includes:

  • false
  • 0
  • null
  • undefined
  • NaN
  • empty strings (e.g., "")

Binary logical operators

Binary logical operators are used to combine multiple boolean expressions and return their resulting combined evaluation or value.

The logical AND operator

The logical AND operator && is used to combine two or more expressions, and either returns the first expression that evaluates to false or the last expression that evaluates to true.

expression && expression [&& expression ...]

Note: In the context of conditional statements, the entire condition will evaluate to false if any of its composing expressions is considered falsy.

Example

Let's consider this script:

const a = true && 'John';
const b = 'Jack' && 'John';
const c = 1 && 'John';

console.log(a, b, c);

When executed, it will:

  1. Assign the string "John" to the a variable as true is a truthy expression.
  2. Assign the string "John" to the b variable as "Jack" is a truthy expression.
  3. Assign the string "John" to the c variable as 1 is a truthy expression.

Which will produce this output:

John John John

Let's consider this script:

const a = false && 'John';
const b = null && 'John';
const c = 0 && 'John';

console.log(a, b, c);

When execute, it will:

  1. Assign the boolean false to the a variable as it is a falsy expression.
  2. Assign the value null to the b variable as it is a falsy expression.
  3. Assign the integer 0 to the c variable as it is a falsy expression.

Which will produce this output:

false null 0

Let's consider this script:

const age = 16;
const country = 'France';
let isAdult = false;

if (age >= 21 && country === 'USA') {
  isAdult = true;
}

console.log(isAdult);

When executed, it will:

  1. Define a variable named age and initialize it with the integer 16.
  2. Define a variable named country and initialize it with the string "France".
  3. Define a variable named isAdult and initialize it with the boolean false.
  4. Check if the value of the age variable is greater or equal to 21 and if the value of the country variable equals to the string "USA".
  5. Assign the boolean true to the isAdult variable if the condition evaluates to true.
  6. Output the value of the isAdult variable.

Which will produce this output:

false

The logical OR operator

The logical OR operator || is used to combine two or more expressions, and either returns the first expression that evaluates to true or the last expression that evaluates to false.

expression || expression [|| expression ...]

Note: In the context of conditional statements, the entire condition will evaluate to true if any of its composing expressions is considered truthy.

Example

Let's consider this script:

const a = true || 'John';
const b = 'Jack' || 'John';
const c = 1 || 'John';

console.log(a, b, c);

When executed, it will:

  1. Assign the boolean true to the a variable as it is a truthy expression.
  2. Assign the string "Jack" to the b variable as it is a truthy expression.
  3. Assign the integer 1 to the c variable as it is a truthy expression.

Which will produce this output:

$ node script.js
true Jack 1

Example

Let's consider this script:

const a = false || 'John';
const b = null || 'John';
const c = 0 || 'John';

console.log(a, b, c);

When execute, it will:

  1. Assign the "John" string to the a variable as the boolean false is a falsy expression.
  2. Assign the "John" string to the b variable as the value null is a falsy expression.
  3. Assign the "John" string to the c variable as the integer 0 is a falsy expression.

Which will produce this output:

$ node script.js
John John John

Let's consider this script:

const country = 'France';
let isEligible = false;

if (country === 'France' || country === 'England') {
  isEligible = true;
}

console.log(isEligible);

When executed, it will:

  1. Define a variable named country and initialize it with the string "France".
  2. Define a variable named isEligible and initialize it with the boolean false.
  3. Check if the value of the country variable either equals the string "France" or "England".
  4. Assign the boolean true to the isEligible variable if the condition evaluates to true.
  5. Output the value of the isEligible variable.

Which will produce this output:

true

The nullish coalescing operator

Similar to the ternary operator, the nullish coalescing operator ?? returns its right-hand side operand when its left-hand side operand is null or undefined, and otherwise returns its left-hand side operand.

operand ?? operand

Example

Let's consider this script:

const vegetable = null;
const fruit = 'Apple';

console.log(vegetable ?? fruit);

When executed, it will:

  1. Define a variable named vegetable and initialize it with the value null.
  2. Define a variable named fruit and initialize it with the string "Apple".
  3. Output the value of the fruit variable considering that the value of the vegetable variable is null.

Which will produce this output:

Apple

The logical NOT operator

The logical NOT operator ! is used to invert the boolean value of an expression and either returns true if it evaluates to false, and vice-versa.

!(expression)

Note: The parenthesis are optional when negating single word expressions, such as variables.

Example

Let's consider this script:

const age = 18;
let isEligible = age >= 21;

if (!isEligible) {
  console.log('Is not eligible!');
}

When executed, it will:

  1. Define a variable named age and initialize it with the number 18.
  2. Define a variable named isEligible and initialize it with the boolean evaluation of the age >= 21 expression, which in this case is false.
  3. Evaluates whether the isEligible variable is falsy by negating it using the NOT ! operator and output the string "Is not eligible!".

Which will produce this output:

Is not eligible!

Combine logical operators

In programming, logical operators have a precedence that determines the order in which they are evaluated when combined in expressions.

!expression && expression || expression

In JavaScript, the precedence of logical operators is as follows:

  • The logical NOT ! has the highest precedence.
  • The logical AND && has the second highest precedence.
  • The logical OR || has the lowest precedence.

Example

Let's consider this script:

const hasDebt = false;
const isMember = true;
const hasDayPass = false;

if (!hasDebt && isMember || hasDayPass) {
  console.log('Access granted');
} else {
  console.log('Access denied');
}

When executed, it will:

  1. Define 3 boolean variables named hasDebt, isMember, and hasDayPay respectively initialized with false, true, and false.
  2. Evaluate the !hasDebt && isMember expression first and convert it into a boolean expression; in this case true.
  3. Evaluate the complete expression, in this case true || false.
  4. Output the string "Access granted".

Which will produce this output:

Access granted

Modify the precedence of logical operators

To explicit the precedence of logical operators and force certain parts of an expression to be evaluated first, regardless of the default operator precedence, you can group two or more expressions together using parentheses () as follows:

expression && (expression || expression)

Example

Let's consider this script:

const hasDebt = false;
const isMember = true;
const hasDayPass = false;

if (!hasDebt && (isMember || hasDayPass)) {
  console.log('Access granted');
} else {
  console.log('Access denied');
}

When executed, it will:

  1. Define 3 boolean variables hasDebt, isMember, and hasDayPay.
  2. Evaluate the isMember || hasDayPass expression first and convert it into a boolean expression; in this case true.
  3. Evaluate the complete expression, in this case true && true.
  4. Output the string "Access granted".

The ternary operator

The ternary operator ?:, which is a concise version of the if..else statement, is mostly used for assigning values or determining expressions based on a condition.

If its expression is truthy, it returns its left-hand side operand; otherwise, it returns its right-hand side operand.

(expression) ? operand : operand

Example

Let's consider this script:

const age = 21;
const drink;

if (age >= 18) {
  drink = 'Beer';
} else {
  drink = 'Juice';
}

console.log(drink);

Using the ternary operator allows us to rewrite it with a much shorter syntax:

const age = 21;
const drink = (age >= 18) ? 'Beer' : 'Juice';

console.log(drink);

When executed, it will:

  1. Define a variable named age and initialize it with 21.
  2. Check if the value of the age variable is greater or equal to 18, and either assign the string "Beer" to the drink variable if it evaluates to true, or the string "Juice" if it evaluates to false.
  3. Output the value of the drink variable.

Which will produce this output:

Beer

Summary

Here's a summary of what you've learned in this lesson:

  • Any value that is considered true in a boolean context is called truthy.
  • Any value that is considered false in a boolean context is called falsy.
  • The logical AND operator && returns the first expression that evaluates to false or the last expression that evaluates to true.
  • The logical OR operator || returns the first expression that evaluates to true or the last expression that evaluates to false.
  • The nullish coalescing operator ?? returns its right-hand side operand when its left-hand side operand is null or undefined, and otherwise returns its left-hand side operand.
  • The logical NOT operator ! returns true if the expression evaluates to false, and vice-versa.
  • Parentheses () are used to modify the precedence of logical operators by forcing an expression to be evaluated first.
  • The ternary operator ?: is a concise version of the if..else statement, mostly used for assigning values or determining expressions based on a condition.

Enjoying the courses?

I've made these courses completely free so anyone can learn from them. If they've helped you and you'd like to actively support the work behind BackendBrewery, you can leave a tip:

Support BackendBrewery
Next lesson
Binary Logical Operators in JavaScript | Backend Brewery