JavaScript Type Conversion & Type Coercion

While writing JavaScript programs, you'll often work with different data types together. For example, you might have a number in one variable and a string containing a number in another.

JavaScript sometimes needs to change one data type into another so that an operation can be performed.

This is called type conversion or type coercion, depending on how the conversion happens.

Let's make this simple.

What is Type Conversion?

Type conversion is the process of explicitly changing a value from one data type to another.

For example, we can convert a string into a number:

let age = "20";

let numberAge = Number(age);

console.log(numberAge);
console.log(typeof numberAge);

Output:

20
number

Here, "20" was originally a string, but Number() converted it into a number.

This is called explicit type conversion because we are telling JavaScript to perform the conversion.

Common Type Conversion Methods

JavaScript provides several built-in functions for converting values.

Let's look at them one by one.

Converting to Number

Use Number() when you want to convert a value into a number.

let value = "100";

let result = Number(value);

console.log(result);
console.log(typeof result);

Output:

100
number

It can also convert decimal strings:

let price = "99.99";

console.log(Number(price));

Output:

99.99

If the string cannot be converted into a valid number, JavaScript returns NaN.

let value = "Hello";

console.log(Number(value));

Output:

NaN

NaN means Not a Number.

Converting to String

We can use String() to convert a value into a string.

let age = 20;

let result = String(age);

console.log(result);
console.log(typeof result);

Output:

20
string

The number 20 is now the string "20".

Converting to Boolean

The Boolean() function converts a value into either true or false.

console.log(Boolean(1));
console.log(Boolean(0));

Output:

true
false

Some common values that become false are:

false
0
""
null
undefined
NaN

Most other values become true.

For example:

console.log(Boolean("Hello"));
console.log(Boolean(100));

Output:

true
true

What is Type Coercion?

Type coercion is the automatic conversion of one data type into another by JavaScript.

Unlike type conversion, we don't explicitly tell JavaScript to convert the value. JavaScript does it automatically when necessary.

For example:

let result = "10" + 5;

console.log(result);

Output:

105

You might expect 15, but JavaScript sees a string and a number with the + operator.

It converts 5 into "5" and joins the two strings:

"10" + "5" → "105"

This is type coercion.

Another Example

Consider:

let result = "10" - 5;

console.log(result);

Output:

5

Why didn't JavaScript produce "105" this time?

Because the - operator is used for subtraction. JavaScript converts "10" into the number 10.

So internally, it becomes:

10 - 5 → 5

This is why JavaScript's automatic type coercion can sometimes be confusing.

+ Operator and Type Coercion

The + operator behaves differently when strings are involved.

console.log(10 + 5);
console.log("10" + 5);
console.log(10 + "5");

Output:

15
105
105

When a string is involved, + usually performs string concatenation instead of numerical addition.

That's something you'll encounter quite often.

Comparison and Type Coercion

JavaScript also performs type coercion when using the loose equality operator ==.

For example:

console.log(5 == "5");

Output:

true

JavaScript converts one of the values so that they can be compared.

But with strict equality ===:

console.log(5 === "5");

Output:

false

Why?

Because === checks both:

1. The value

2. The data type

So:

5 == "5"   → true
5 === "5"  → false

In modern JavaScript, === is generally preferred because it avoids many unexpected type-coercion results.

Explicit vs Automatic Conversion

The easiest way to understand the difference is:

Type Conversion

You explicitly convert the value.

let age = "20";

let result = Number(age);

You told JavaScript:

"Convert this string into a number."

Type Coercion

JavaScript automatically converts the value.

let result = "20" - 5;

JavaScript automatically converts "20" into 20.

A Practical Example

Imagine a user enters their age through a form:

let age = "21";

Even though the user entered a number, form input is commonly received as a string.

If we want to perform calculations, we should convert it:

let age = "21";

let nextYearAge = Number(age) + 1;

console.log(nextYearAge);

Output:

22

Without conversion, this could happen:

let age = "21";

console.log(age + 1);

Output:

211

That's because "21" is a string, so JavaScript concatenates "1" to it.

This is a very common situation when working with user input.

Type Conversion vs Type Coercion

Conclusion

Type conversion means explicitly changing a value from one data type to another, while type coercion happens automatically when JavaScript converts values during an operation.

The key difference is simple:

Type Conversion → You convert it
Type Coercion   → JavaScript converts it

As a beginner, pay special attention when mixing strings and numbers, especially with +, -, and comparison operators. Understanding this behavior will save you from many confusing JavaScript bugs later.