JS◆ The JavaScript Book
About

Chapter IV · Operators & Expressions

Type Coercion

Type coercion is JavaScript automatically converting a value from one type to another — a string to a number, an object to a boolean — usually because an operator or context demands a specific type.

01 What Is Type Coercion?

JavaScript is a dynamically typed language: a variable can hold any type, and operators will convert operands as needed to make an operation possible, rather than throwing an error. This exists so expressions like "Score: " + 5 just work without a manual conversion step — a deliberate ease-of-use tradeoff.

Coercion happens in two flavors: implicit (the engine does it silently, e.g. inside + or an if) and explicit (you request it, e.g. Number(value) or String(value)).

02 Simple Example

Implicit vs. explicit coercion side by side.

coercion.js
// Implicit
console.log('5' + 3);   // '53' — + prefers string concatenation
console.log('5' - 3);   // 2   — - only makes sense numerically, so it coerces

// Explicit
console.log(Number('5')); // 5
console.log(String(5));   // '5'
console.log(Boolean(''));  // false

03 How It Works

+ is the odd one out: if either operand is a string, it concatenates. Every other arithmetic operator (- * / %) only makes sense for numbers, so they always coerce both sides toward numbers. Boolean contexts (like an if condition) coerce using the truthy/falsy rules instead.

"5" (string) 5 (number) true (boolean) Number("5") Boolean(5) JavaScript converts between types automatically in mixed expressions — implicit coercion follows fixed rules, not guesswork.

Values move between types through explicit conversion functions or implicit operator rules.

04 Production Example

Reading a numeric value out of a URL query string or form input, where everything arrives as text.

parse-input.js
function parsePageNumber(queryParam) {
  const page = Number(queryParam);
  return Number.isNaN(page) || page < 1 ? 1 : page;
}

parsePageNumber('3');    // 3
parsePageNumber('abc');  // 1 (falls back safely)

05 Mental Model

"A universal adapter plug: JavaScript tries to make whatever value you hand it fit the socket the operator expects, following a fixed set of adapter rules."

06 Common Mistakes & Best Practices

  • [] + [] is '' and [] + {} is '[object Object]' — both coerce to strings before concatenating, which rarely matches intent.
  • Best practice: coerce explicitly (Number(), String(), Boolean()) at input boundaries instead of relying on an operator to do it implicitly mid-expression.

07 Interview Questions

Q: Why does '5' + 3 give '53' but '5' - 3 give 2?

+ prefers string concatenation when either operand is a string; every other arithmetic operator only makes sense numerically, so it coerces both sides toward numbers instead.

Q: What's the difference between implicit and explicit coercion?

Implicit coercion happens silently as a side effect of an operator (like +); explicit coercion is a deliberate call like Number(value) or String(value).

Key Takeaway

Coercion converts values between types automatically for operators, and explicitly via Number()/String()/Boolean() — explicit conversion at input boundaries avoids most of the surprises.

Related Concepts