Interviews Prep

Data Types & Type Coercion in JavaScript – Explained Simply

Data Types & Type Coercion in JavaScript – Explained Simply

When you’re learning JavaScript, one of the most confusing things early on is the way it handles data types — especially when it magically converts one type to another without warning. This concept is called type coercion, and it can be a tricky (but powerful) part of the language.

In this post, I’ll walk you through:

  • The basic data types in JavaScript

  • The difference between primitive and non-primitive types

  • What type coercion is

  • Real examples of coercion

 

JavaScript Data Types

JavaScript is a dynamically typed language, meaning you don’t need to declare the type of a variable explicitly. It figures that out for you. This is convenient — but also why bugs can creep in.

Primitive Data Types

Primitive types are the most basic building blocks. They are immutable and stored directly in memory.

  • String – 'Hello', "world", `template`

  • Number – 42, 3.14, -100

  • Boolean – true, false

  • Null – an intentional absence of value (null)

  • Undefined – a declared variable that hasn’t been assigned yet

  • BigInt – for arbitrarily large integers (e.g. 123n)

  • Symbol – for creating unique identifiers

    let name = "Alice";       // string
let age = 30;             // number
let isLoggedIn = true;    // boolean
let x = null;             // null
let y;                    // undefined

Non-Primitive (Reference) Types

These types can hold collections of values or more complex data.

  • Object

  • Array

  • Function

  • Date, RegExp, Map, Set, etc.

let person = { name: "Alice", age: 30 };
let hobbies = ["reading", "coding"];
let greet = function () { console.log("Hello!"); };

 

What is Type Coercion?

Type coercion is when JavaScript automatically converts one data type to another, often behind the scenes.

There are two kinds:

  • Implicit coercion – JS does it for you

  • Explicit coercion – You do it on purpose using built-in functions

 Implicit Coercion Example

"5" + 1   //  "51" (number 1 is coerced to a string)
"5" - 1   // 4    (string "5" is coerced to a number)
true + 1  // 2    (true becomes 1)
false + "2" // "false2"

See how wild it can get?

JavaScript tries to "help" by converting types so your code doesn’t crash — but that can easily backfire if you’re not expecting it.

 Explicit Coercion

Number("5")      // 5
String(100)      //  "100"
Boolean("")      // false
Boolean("hi")    // true

Truthy & Falsy Values

JavaScript uses type coercion in conditions, like if statements.

Falsy Values:

false, 0, "", null, undefined, NaN

Everything else is truthy!

if ("hello") { console.log("Yes!"); } // Runs
if (0) { console.log("Nope"); }       // Doesn't run

Common Gotchas (and how to avoid them)

1. Equality Check Confusion

'5' == 5 // true 😬 '5' === 5 // false ✅ (strict equality – no coercion)

Always use === and !== to avoid unintended coercion.

2. Adding vs Subtracting

"10" + 2 // "102" "10" - 2 // 8

Addition + triggers string concatenation if either operand is a string. Subtraction only works with numbers, so coercion kicks in.

Share: