Type Conversion

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

Example:

"100"

is a String.

After conversion:

100

becomes a Number.

---

Why Type Conversion?

Data often comes from:

• Forms
• APIs
• Databases
• User Input

Most user input is received as a String.

Example:

let age = "21";

If we want to perform calculations:

age + 1

we should first convert it into a number.

---

Types of Conversion

JavaScript supports three types of conversion:

• Explicit Casting
• Implicit Casting
• Type Coercion

---

Explicit Casting

Explicit Casting means the developer manually converts one data type into another.

---

String to Number

Number()

Number() converts a value into a number.

Example:

let age = "21";

let numAge =
Number(age);

console.log(numAge);

Output:

21

Check the type:

console.log(typeof numAge);

Output:

number

Another example:

Number("100");

Output:

100

Decimal values:

Number("99.99");

Output:

99.99

Invalid conversion:

Number("Hello");

Output:

NaN

NaN means Not a Number.

---

parseInt()

parseInt() converts a string into an integer.

Example:

parseInt("100");

Output:

100

Decimal values:

parseInt("99.99");

Output:

99

The decimal part is removed.

Mixed strings:

parseInt("123px");

Output:

123

---

parseFloat()

parseFloat() converts a string into a decimal number.

Example:

parseFloat("99.99");

Output:

99.99

Mixed values:

parseFloat("123.45px");

Output:

123.45

---

Converting to String

String()

String() converts any value into a string.

Example:

String(100);

Output:

"100"

Another example:

String(true);

Output:

"true"

---

Converting to Boolean

Boolean()

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

Example:

Boolean(1);

Output:

true

Boolean(0);

Output:

false

Boolean("Hello");

Output:

true

Boolean("");

Output:

false

---

Truthy and Falsy Values

When converted to Boolean, some values become false.

Falsy values:

• false
• 0
• -0
• 0n
• ""
• null
• undefined
• NaN

Example:

Boolean("");

Output:

false

Everything else is truthy.

Examples:

• "Hello"
• 123
• []
• {}
• true

Output:

true

---

Explicit Conversion Summary

Method	Purpose
Number()	Convert to Number
parseInt()	Convert to Integer
parseFloat()	Convert to Decimal
String()	Convert to String
Boolean()	Convert to Boolean

---

Implicit Casting

Implicit Casting happens automatically.

JavaScript converts values without the programmer explicitly asking for it.

Example:

"5" + 1

Output:

"51"

Why?

JavaScript converts:

1

into:

"1"

and performs string concatenation.

"5"
+
1
      ↓
"5"
+
"1"
      ↓
"51"

---

Another example:

"10" + "20";

Output:

"1020"

"Hello" + 123;

Output:

"Hello123"

---

Implicit Numeric Conversion

Subtraction, multiplication, and division automatically convert strings into numbers.

Example:

"5" - 1;

Output:

4

JavaScript converts:

"5"

to:

5

before subtraction.

More examples:

"10" * 2;

Output:

20

"20" / 4;

Output:

5

Comparison example:

"5" > 3;

Output:

true

The string "5" is converted into the number 5.

---

Type Coercion

Type Coercion is JavaScript's automatic conversion of values during operations.

In practice:

Implicit Casting
      =
Type Coercion

---

String Coercion

"Age: " + 21;

Output:

Age: 21

---

Numeric Coercion

"10" - "5";

Output:

5

---

Boolean Coercion

if ("Hello") {

    console.log("Runs");

}

Output:

Runs

Because:

"Hello"
      ↓
true

---

Equality Operators

JavaScript has two equality operators.

---

Loose Equality (==)

Loose equality performs automatic type conversion.

5 == "5";

Output:

true

The string "5" is converted into the number 5.

---

Strict Equality (===)

Strict equality compares both value and data type.

5 === "5";

Output:

false

No type conversion occurs.

---

== vs ===

Loose Equality (==)	Strict Equality (===)
Converts Types	No Conversion
Can Produce Unexpected Results	More Predictable
Generally Avoid	Recommended

---

Common Examples

Example 1:

"5" + 2;

Output:

"52"

---

Example 2:

"5" - 2;

Output:

3

---

Example 3:

true + 1;

Output:

2

Because:

true
 ↓
1

---

Example 4:

false + 1;

Output:

1

Because:

false
 ↓
0

---

Example 5:

null + 1;

Output:

1

Because:

null
 ↓
0

---

Best Practices

Prefer explicit conversion.

Good:

const age =
Number(inputValue);

Avoid relying on implicit conversion.

inputValue * 1;

Use strict equality.

Good:

5 === "5";

Output:

false

Avoid:

5 == "5";

Validate user input.

const age =
Number(input);

if (isNaN(age)) {

    console.log("Invalid");

}

---

Complete Example

const input = "25";

const age =
Number(input);

console.log(age + 5);

Output:

30

---

Key Takeaway

JavaScript can automatically convert values between data types, but relying on automatic conversion may produce unexpected results.

Prefer explicit conversion:

Number(value);

String(value);

Boolean(value);

Use strict equality:

===

instead of:

==

Remember:

Explicit Casting
        ↓
You Control Conversion

Implicit Casting / Type Coercion
        ↓
JavaScript Controls Conversion

Understanding type conversion helps you write more predictable, reliable, and bug-free JavaScript code.