JavaScript Boolean: True and False in JS

In JavaScript, a boolean is a fundamental data type for conditional logic and other logical operations. Booleans can have two values: true and false.

How to Use Booleans in JavaScript

Using true and false in JavaScript is straightforward. You can assign them to a variable or get them as a result of comparisons and logical operations. Use the syntax to declare boolean values using let, var, or const, depending on whether the value needs to be reassigned.

let isAuthenticated = false;
let isGreaterThanFive = (10 > 5);  // evaluates to true

When to Use Booleans in JavaScript

Booleans are essential when you need to make decisions in your code. Here are some common scenarios where booleans in JavaScript are particularly useful:

Conditional Statements

Conditional statements like if statements rely heavily on boolean values to determine which code block to execute.

let userHasAccess = false;
if (userHasAccess) {
    console.log("Access granted.");
} else {
    console.log("Access denied.");  // This line executes
}

While Loops

In while loops, a boolean condition controls how long the loop will continue to run.

let counter = 3;
while (counter > 0) {
    console.log(counter);
    counter--;  // Decrements counter until the condition is false
}

Examples of Booleans in JavaScript

Here are some simplified examples to illustrate the common use cases of booleans in JavaScript:

Registration Forms

In an HTML registration form, booleans might verify whether the inputs in a form meet certain criteria.

let formIsValid = false;
let age = 20;

if (age >= 18) {
    formIsValid = true;
}
console.log("Form valid:", formIsValid);  // Output: Form valid: true

Feature Toggles

Feature toggles are a common use case where booleans control the activation of certain features in an application.

let featureEnabled = true;
if (featureEnabled) {
    console.log("New feature is live.");
}

Booleans can also be used to dynamically apply CSS styles to elements based on conditions.

const isDarkMode = true;
document.body.style.backgroundColor = isDarkMode ? "black" : "white"; // Change CSS based on boolean value

Learn More About the Boolean Data Type in JavaScript

Truthy and Falsy Values

Besides true and false, other data types can behave as booleans in boolean contexts like conditions.

"Truthy" values behave like true, while "falsy" values behave like false. The six false values in JavaScript are 0, "" (empty string), NaN, null, undefined, and false. Any other value is truthy, i.e. resolves to true.

let name = ""
if (name) {
	console.log(`Hello, ${name}!`);
} else {
	console.log("Please provide a name.");
}

Logical Operators in JavaScript

In JavaScript, logical operators are essential for advanced boolean logic. The primary logical operators are && (and), || (or), and ! (not). The && and || operators evaluate expressions from left to right and return the first operand that determines the outcome.

The && operator only returns true if the expressions on its left and right are both true. If the first expression is false, the logical and “short-circuits” to return false without evaluating the second expression.

let a = true, b = false;
let result = a && b;  // Outputs: false, because b is false
let bothTrue = true && true;  // Outputs: true

The || operator returns true if at least one of the expressions is true. The logical or also uses short-circuiting. If the first expression is true, || returns true without evaluating the second expression.

let c = false, d = true;
let anotherResult = c || d;  // Outputs: true, because d is true
let bothFalse = false || false;  // Outputs: false

The ! operator inverts the truth value of a boolean expression. When an expression is true, the logical not turns it into false and vice versa.

let e = true;
let notTrue = !e;  // Outputs: false
let f = false;
let notFalse = !f;  // Outputs: true

Boolean expressions often involve comparison operators like ==, ===, <, and >=.

let age = 18;
console.log(age >= 18); // true, using a comparison operator
console.log(age === "18"); // false, strict equality check

The Boolean Function in JavaScript

The Boolean() function in JavaScript takes any value as a parameter and converts it to a boolean. If the value is one of the six falsy values (0, "", NaN, null, undefined, and false), the function returns false. For any other values, including arrays and objects, Boolean() returns true.

console.log(Boolean(0));           // false
console.log(Boolean(''));          // false
console.log(Boolean('JavaScript')); // true
console.log(Boolean({}));          // true
console.log(Boolean(undefined));   // false

Boolean values often appear in JSON data when representing true/false conditions.

const userData = {
  name: "Alice",
  emailVerified: true, // Boolean in a JSON object
  premiumUser: false
};

Booleans exist in most programming languages, but JavaScript's loose type coercion allows values to behave as booleans in certain contexts.

console.log(Boolean([])); // true (empty array is truthy)
console.log(Boolean(null)); // false (null is falsy)

Unlike Python, where booleans are subclasses of integers (True equals 1, False equals 0), JavaScript treats true and false as distinct boolean values.

# Python Boolean behavior
print(True + 1) # Output: 2
print(False + 1) # Output: 1

Boolean Objects in JavaScript

In JavaScript, apart from the primitive boolean values true and false, there is also a Boolean object. The Boolean object is a wrapper around the boolean data type, offering some additional functionality.

You can create Boolean objects using the new Boolean() constructor. This might seem similar to the Boolean() function, but it behaves quite differently. The Boolean() function returns a primitive value of type boolean. The new Boolean() constructor, on the other hand, creates an object of the Boolean class.

let booleanObject = new Boolean(true);
let booleanValue = Boolean(true);
console.log(booleanObject); // Outputs: [Boolean: true]
console.log(booleanValue); // Outputs: true

Using Boolean objects usually adds complexity without providing benefits. For almost any purpose, the primitive boolean values true and false are sufficient.

In JavaScript, a boolean primitive is a simple true/false value, while the Boolean object is a wrapper around a boolean.

let primitiveBool = true; // Boolean primitive
let objectBool = new Boolean(true); // Boolean object
console.log(typeof primitiveBool); // 'boolean'
console.log(typeof objectBool); // 'object'