Type conversion in JavaScript involves converting values from one data type to another. JavaScript supports both explicit (manual) and implicit (automatic) type conversions. Here’s a detailed discussion of both types, along with examples.
Explicit Type Conversion
Explicit type conversion, also known as type casting, is when you manually convert a value from one type to another using built-in functions.
1. String Conversion
- Using String() Function: Converts any value to a string.
let num = 123;
let str = String(num);
console.log(str); // “123”
console.log(typeof str); // “string”
- Using toString() Method: Converts a value to a string.
let num = 123;
let str = num.toString();
console.log(str); // “123”
console.log(typeof str); // “string”
2. Number Conversion
- Using Number() Function: Converts a value to a number.
let str = “123”;
let num = Number(str);
console.log(num); // 123
console.log(typeof num); // “number”
- Using parseInt() and parseFloat() Functions: Converts a string to an integer or a floating-point number.
let str = “123.45”;
let intNum = parseInt(str);
let floatNum = parseFloat(str);
console.log(intNum); // 123
console.log(floatNum); // 123.45
3. Boolean Conversion
- Using Boolean() Function: Converts a value to a boolean.
let num = 0;
let bool = Boolean(num);
console.log(bool); // false
console.log(typeof bool); // “boolean”
Implicit Type Conversion
Implicit type conversion, also known as type coercion, happens automatically when JavaScript tries to perform an operation between mismatched types.
1. String Conversion
- When using the + operator with a string and another type
let num = 123;
let str = “456”;
let result = num + str;
console.log(result); // “123456”
console.log(typeof result); // “string”
2. Number Conversion
- When using arithmetic operators other than +.
let str = “123”;
let num = 456;
let result = str – num;
console.log(result); // -333
console.log(typeof result); // “number”
- When using comparison operators.
let bool = “true” == true;
console.log(bool); // false
3. Boolean Conversion
- In logical contexts, such as if statements or logical operators.
if (“”) {
console.log(“This will not execute.”);
} else {
console.log(“This will execute.”); // This will execute.
}
Examples of Type Conversion
String to Number
let str = “123”;
let num = +str; // Unary plus operator
console.log(num); // 123
console.log(typeof num); // “number”
Number to String
let num = 123;
let str = num + “”; // Implicit conversion
console.log(str); // “123”
console.log(typeof str); // “string”
Boolean to Number
let bool = true;
let num = +bool; // Unary plus operator
console.log(num); // 1
console.log(typeof num); // “number”
Number to Boolean
let num = 0;
let bool = !!num; // Double negation
console.log(bool); // false
console.log(typeof bool); // “boolean”
Type Conversion in Comparison
JavaScript performs type conversion during comparisons to ensure the operands are of the same type.
Examples:
console.log(“123” == 123); // true (implicit conversion)
console.log(“123” === 123); // false (strict equality, no conversion)
Summary
- Explicit Conversion: Manually convert types using functions like String(), Number(), Boolean(), parseInt(), and parseFloat().
- Implicit Conversion: JavaScript automatically converts types during operations like concatenation, arithmetic, and comparisons.
- Type Coercion: Be aware of automatic type conversions that can lead to unexpected results.
Understanding type conversion helps avoid bugs and write more predictable and maintainable code in JavaScript.