JavaScript is a dynamically typed language, which means variables can hold values of any data type without explicit type declarations. However, JavaScript sometimes needs to convert values between types, either explicitly or implicitly. This is where Type Conversion and Type Coercion come into picture.
In this guide of JavaScript Mastery Series, we’ll step by step understand :
- What is Type Conversion in JavaScript with examples?
- What is the difference between Type Coercion and Type Conversion?
- What is the difference between Type Casting and Type Coercion?
- What is Coercion in JavaScript with examples?
- Along with some super useful JavaScript Interview Questions 🚀
By the end of this tutorial, I’ll try to explain in simplest manner regarding Type Conversion and Type Coercion in JavaScript and how they impact your code.
Type Conversion in JavaScript with Example
Type Conversion (also called type casting) refers to explicitly converting a value from one data type to another using built-in JavaScript functions.
Common Type Conversion Methods :
| Data Type | JS Function to Convert |
|---|---|
| To String | String(yourValue) or yourValue.toString() |
| To Number | Number(yourValue) or parseInt(yourValue) / parseFloat(yourValue) |
| To Boolean | Boolean(<code>yourValue) |
Example of Type Conversion in JavaScript :
// Converting to String -
let num = 123;
let strNum = String(num);
console.log(strNum); // "123"
console.log(typeof strNum); // string
// Converting to Number -
let str = "456";
let numStr = Number(str);
console.log(numStr); // 456
console.log(typeof numStr); // number
// Converting to Boolean -
let value = "hello";
let boolValue = Boolean(value);
console.log(boolValue); // true
console.log(typeof boolValue); // booleanType Coercion in JavaScript with Example
Coercion is nothing but an internal process where JavaScript engine automatically converts data types when necessary. There are two types of Coercion:
1. Implicit Coercion (Automatic)
This happens when JavaScript converts one data type to another automatically during operations.
console.log("5" * 3); // 15 (String coerced to Number)
console.log(5 + "3"); // "53" (Number coerced to String)2. Explicit Coercion (Manual)
This occurs when a developer manually converts values using JavaScript functions.
let numStr = "20";
let num = Number(numStr);
console.log(num + 5); // 25🚀 Interview Tip
If any Interviewer asks – When should we use explicit conversions?
You should answer – When dealing with user inputs, always perform explicit conversion to prevent coercion-related bugs.
Difference Between Type Coercion and Type Conversion in JavaScript
There are multiple key differences between Type Coercion and Type Conversion –
| Category | Type Conversion in JS | Type Coercion in JS |
|---|---|---|
| Definition | Manually changing the type using functions like Number(), String(), Boolean(). | JavaScript automatically converts values during operations. |
| Control | The developer explicitly decides when and how to convert data. | Happens automatically based on JavaScript’s internal rules. |
| Example | let num = Number("123"); | let result = "5" * 2; // 10 |
🚀 Interview Tip
Always be cautious when using==instead of===because==allows type coercion, which may lead to unexpected results.
What is the difference between Type Casting and Type Coercion?
Many developers confuse type casting with type coercion, but they are different:
- Type Casting: Another term for Type Conversion (explicit conversion).
- Type Coercion: Implicit conversion performed by JavaScript.
Example: Type Casting vs. Type Coercion
// Type Casting (Explicit)
let strNum = "50";
let num = Number(strNum);
console.log(num + 10); // 60 (Converted explicitly)
// Type Coercion (Implicit)
console.log("50" - 10); // 40 (JavaScript converts "50" to a number automatically)Final Points
In this blog, we explored Type Conversion and Type Coercion in JavaScript and how JavaScript handles type changes. We learned :
- Type Conversion is explicit and uses functions like
Number(),String(), andBoolean(). - Type Coercion is implicit and happens automatically during operations.
- The difference between type casting and type coercion is that type casting is manual, while type coercion is automatic.
- Implicit coercion happens in arithmetic operations (
"5" * 3→15), while explicit coercion is done using JavaScript functions. - Understanding how JavaScript converts types helps avoid unexpected behaviors in programs.
By mastering type conversion and coercion, you can write more predictable and bug-free JavaScript code. Keep practicing with different type conversions to gain confidence!
Next –
- To learn more simple and detailed JavaScript guides, do check our “Free” JavaScript Mastery Series.
- To use hundreds of “Free” tools to fasten your daily development and testing tasks, visit – Tools.LogicalDuniya.com
- To know about more tutorials of other latest technologies & concepts, visit our Tutorials page.
Happy Learning,
Shubham : )
