How To Convert Data Types in JavaScript

Introduction

JavaScript type conversion controls how values change from one primitive type to another. Whether you need to convert strings to numbers, numbers to strings, or perform javascript boolean conversion, understanding both implicit coercion and explicit conversion functions helps avoid bugs and unexpected results.

Implicit type coercion (javascript type coercion)

JavaScript will often try to coerce values automatically when operators or APIs expect a particular type. This implicit conversion can be convenient but also surprising. For example, the + operator performs string concatenation when either operand is a string:

// string concatenation
"2" + "3" // "23"

Other arithmetic operators force numeric conversion:

// subtraction triggers numeric conversion
"15" - "10" // 5

Because of these mixed behaviors—commonly called javascript type coercion—it's usually safer to convert values explicitly when the expected type matters.

Convert values to strings (javascript number to string)

Two common ways to obtain a string representation:

• String(value) — converts almost any value to a string.
• value.toString() — method available on numbers, booleans and other primitives (wrapped), but will throw on null or undefined.

String(42)           // "42"
(200).toString()      // "200"
String(true)         // "true"

When converting for display or concatenation, use these explicit conversions instead of relying on implicit concatenation.

Convert values to numbers (javascript string to number)

To convert data types in JavaScript to numbers you can use several approaches depending on the input:

• Number(value) — converts a value to a number; empty strings or whitespace convert to 0, non-numeric text becomes NaN.
• parseInt(string, radix) — parses an integer from the start of a string; ignores trailing non-digit characters when possible.
• parseFloat(string) — parses a floating-point number from the start of a string.

Number("1984")      // 1984
Number("")          // 0
Number(" ")         // 0
Number("two")       // NaN
parseInt("20px", 10) // 20
parseFloat("3.14abc") // 3.14

When to use Number() vs parseInt() vs parseFloat() (javascript parseint vs number)

• Use Number() when the entire value should be a valid number (otherwise you may get NaN).
• Use parseInt() to extract an integer from the start of a string; always pass a radix to avoid base-related surprises.
• Use parseFloat() when decimals are expected and the string may contain trailing text.

Convert values to booleans (javascript boolean conversion)

The Boolean() function coerces values to true or false based on truthiness:

Boolean(0)       // false
Boolean("")      // false
Boolean(null)     // false
Boolean(NaN)      // false
Boolean("0")     // true (non-empty string)
Boolean(" ")     // true (string with whitespace)

Truthy and falsy rules are commonly used for input validation and conditional checks, but be careful: "0" is truthy even though it looks numeric.

Common pitfalls and tips (how to avoid unexpected type coercion in JavaScript)

• Avoid relying on implicit coercion in complex expressions—explicit conversion makes intent clear.
• When converting user input, trim whitespace before numeric conversion to reduce surprises.
• Check for NaN with Number.isNaN(value) rather than the global isNaN which coerces values first.
• Use typeof to inspect types during debugging: typeof value (javascript typeof).
• Prefer String() or toString() for readable output, and Number() or parseInt/parseFloat for numeric conversion depending on context.

Examples and quick reference

// Convert string to number
const a = Number("123")         // 123
const b = parseInt("123px", 10) // 123

// Convert number to string
const s1 = String(123)           // "123"
const s2 = (123).toString()      // "123"

// Convert to boolean
const ok = Boolean("hello")     // true
const empty = Boolean("")       // false

// Check type
typeof a // "number"

Conclusion

Mastering javascript type conversion helps you write predictable, maintainable code. Use explicit conversions—String(), Number(), Boolean(), parseInt(), and parseFloat()—and be mindful of implicit javascript type coercion and truthy/falsy rules to avoid common bugs.