❮ Previous Next ❯

JavaScript Truthy & Falsy

  • This lesson explains truthy and falsy values in JavaScript.

  • Introduction

    In JavaScript, conditions do not always require true or false explicitly.

    Instead, JavaScript internally converts values into:

    • true → Truthy

    • false → Falsy

    This concept is extremely important because it is used in:

    • if-else

    • while loops

    • logical operators

    • form validation

    • real-world decision making

    Understanding truthy and falsy helps you predict program behavior correctly.

    What Are Truthy & Falsy Values ?

    Definition

    Truthy values are values that JavaScript treats as true when used in a conditional statement.

    Falsy values are values that JavaScript treats as false when used in a conditional statement.

    Why Does JavaScript Do This ?

    JavaScript is a flexible and loosely typed language.

    Instead of forcing developers to write:

    if (value === true)

    JavaScript allows:

    if (value)

    This makes code:

    • Shorter

    • Cleaner

    • More readable

    Falsy Values in JavaScript 

    JavaScript has only 6 falsy values.

    These values always behave as false in conditions.

    ValueMeaning
    falseBoolean false
    0Number zero
    -0Negative zero
    ""Empty string
    nullNo value
    undefinedNot assigned
    NaNNot a Number

    If a value is not in this list, it is truthy.

Checking Falsy Values in Conditions

Demonstrates how 0 is treated as falsy in an if-else statement. 

// 0 is a falsy value

if (0) {
  console.log("True");
} else {
  console.log("False"); // runs because 0 is falsy
}

  • Truthy Values in JavaScript

    All values except the falsy ones are truthy.

    Some common truthy values:

    ValueReason
    trueBoolean true
    1, -5, 100Non-zero numbers
    "hello"Non-empty string
    " "Space is not empty
    [ ]Empty array
    { }Empty object
    function( ){ }Function

Checking Truthy Values in Conditions

Demonstrates how non-empty strings are treated as truthy in JavaScript. 

// Non-empty string is truthy

if ("hello") {
  console.log("Truthy value"); // runs because "hello" is truthy
}
  • Very Important Confusion

Difference Between Empty String and Space String

Demonstrates that empty string is falsy while space string is truthy. 

// Empty string ("") is falsy
if ("") {
  console.log("True");
} else {
  console.log("False"); // runs because "" is falsy
}


// String with space (" ") is truthy
if (" ") {
  console.log("True"); // runs because " " is truthy
}

  • Reason:

    • "" → empty string → falsy

    • " " → contains space → truthy

Using Truthy and Falsy in if-else

Demonstrates how empty values are treated as false in conditions. 

// Empty string is falsy

let username = "";

if (username) {
  console.log("Welcome User");
} else {
  console.log("Please enter username"); // runs because username is empty
}
  • Because empty string is falsy.

Login Status Check Using if-else

Demonstrates how to control access based on login status. 

// Checking login status

let isLoggedIn = true;

if (isLoggedIn) {
  console.log("Dashboard Access");
} else {
  console.log("Login Required");
}

  • Here:

    • true → truthy

    • Condition passes

Truthy and Falsy with Numbers

Demonstrates how non-zero numbers are truthy and 0 is falsy in conditions. 

// Non-zero number is truthy
let count = 5;

if (count) {
  console.log("Items available"); // runs
}


// Zero is falsy
let count2 = 0;

if (count2) {
  console.log("Items available");
} else {
  console.log("No items"); // runs because 0 is falsy
}
  • Truthy & Falsy with Arrays and Objects

Arrays and Objects with Truthy and Falsy Values

Demonstrates that even empty arrays and objects are treated as truthy in JavaScript. 

// Empty array is truthy
if ([]) {
  console.log("Array is truthy"); // runs
}


// Empty object is also truthy
if ({}) {
  console.log("Object is truthy"); // runs
}

  • Why Are Arrays and Objects Truthy ?

    Because:

    • They are reference types

    • They occupy memory

    • They are not null or undefined

Checking Empty Array Properly

Demonstrates the correct way to check if an array has elements using length. 

// Wrong way (always true because array is truthy)
let arr = [];

if (arr) {
  console.log("Array has values");
}


// Correct way (check length)
if (arr.length > 0) {
  console.log("Array has values");
}
  • Truthy & Falsy with Logical Operators

Logical Operators with Truthy and Falsy Values

Demonstrates how AND and OR return values based on truthy and falsy behavior. 

// AND (&&) operator
console.log(true && "Hello");   // "Hello"
console.log(false && "Hello");  // false


// OR (||) operator
console.log("" || "Default");   // "Default"
console.log("User" || "Guest"); // "User"
  • Practical Use Case: Default Values

Using OR Operator for Default Values

Demonstrates how to assign default values using logical OR operator. 

// Default value using OR (||)

let name = "";
let userName = name || "Guest";

console.log(userName); // Guest

  • Common Mistakes

    1. Assuming empty array is falsy

    2. Assuming empty object is falsy

    3. Confusing 0 with "0"

    4. Forgetting falsy values list

    5. Overusing == instead of understanding truthy/falsy

❮ Previous Next ❯