DEV Community

Madhan Raj
Madhan Raj

Posted on

Conversion Types in JavaScript & JavaScript Type Coercion

JavaScript Type Conversion

*Converting Strings to Numbers
*Converting Numbers to Strings
*Converting Dates to Numbers
*Converting Numbers to Dates
*Converting Booleans to Numbers
*Converting Numbers to Booleans
Enter fullscreen mode Exit fullscreen mode

JavaScript variables can be converted to a new variable and another data type:

By the use of a JavaScript function
Automatically by JavaScript itself
Enter fullscreen mode Exit fullscreen mode

Converting Strings to Numbers

The global method Number() converts a variable (or a value) into a number.

A numeric string (like "3.14") converts to a number (like 3.14).

An empty string (like "") converts to 0.

A non numeric string (like "John") converts to NaN (Not a Number).
Converting Numbers to Strings

The global method String() can convert numbers to strings.

It can be used on any type of numbers, literals, variables, or expressions:
Example

String(x)         // returns a string from a number variable x
String(123)       // returns a string from a number literal 123
String(100 + 23)  // returns a string from a number from an expression 

Enter fullscreen mode Exit fullscreen mode

Converting Booleans to Numbers

The global method Number() can also convert booleans to numbers.
Number(false) // returns 0
Number(true) // returns 1

Converting Booleans to Strings

The global method String() can convert booleans to strings.
String(false) // returns "false"
String(true) // returns "true"

The Boolean method toString() does the same.

false.toString()   // returns "false"
true.toString()    // returns "true"

**Reasons to Learn JavaScript Type Conversion**

    Data Handling: In JavaScript when we are working with API responses, user inputs and calculations, these type of the operation require type conversion.
    Prevent Bugs: It is important to understand the type conversion which can help in preventing bugs which occurs when JavaScript implicitly converts value.
    Code Clarity: By performing the explicit conversion makes our code bug free and more clear.




Enter fullscreen mode Exit fullscreen mode

JavaScript Type Coercion

Type Coercion

Type coercion is the automatic conversion of values from one data type to another.

Type coercion happens when you perform an operation on different data types, and the JavaScript engine tries to make them "fit" together.

Example

JavaScript coerces types differently per operator, so type coercion can hide bugs.

Program continues according to the coercion rules, but these may differ from what the programmer wanted to achieve.

let result1 = ('5' + '2'); // = 52
let result2 = ('5' - '2'); // = 3 
Enter fullscreen mode Exit fullscreen mode

Coercion is implicit (handled automatically by the engine), while type conversion is explicit (you manually use functions like Number() or String()).

Because JavaScript is weakly typed, it doesn't throw errors when types don't match; it just tries to coerce them.

String Coercion (+)

If any part of a + operation is a string, JavaScript converts everything to strings and concatenates them.

let x = "5" + 2 // x = "52"
Enter fullscreen mode Exit fullscreen mode

Numeric Coercion

Other arithmetic operators (-, *, /, %) and the unary plus (+x) force values into numbers.

let x = "5" - 2 // x = 3
Enter fullscreen mode Exit fullscreen mode

Boolean Coercion

Values are coerced to booleans in logical contexts like if statements or using the double-NOT operator (!!).

Falsy values: 0, "", null, undefined, NaN, and false.

Truthy values: Everything else (including empty objects {} and arrays []).

Top comments (0)