Type Conversion in JavaScript

Automatic conversion

JavaScript is a weak type programming language. It will always try to execute the code, regardless of the given value's data types, even if it does not make sense. For example:

console.log(1 + "1");

11

In this case, JavaScript will assume you are trying to perform a concatenation operation, and it will convert the number 1 into a string and then join the two strings together.

console.log(5 * null);

0

And in this example, null will be converted into the number 0, and 5 times 0 gives 0.

Even though these examples technically work, you should never rely on automatic conversions, as they can lead to unexpected problems.

A better way to code is to convert the values involved in the operation explicitly to ensure they are always the intended types.

Convert to strings

For example, if you intend to perform string concatenation, then make sure all the values are converted into strings using the String() function.

console.log(typeof String(null));
console.log(typeof String(undefined));
console.log(typeof String(true));
console.log(typeof String(false));
console.log(typeof String(123));
console.log(typeof String("123"));

string
string
string
string
string
string

The Boolean and number types also have a built-in toString() method that can do the same thing. Except it doesn't work on the value directly. You must pass the value to a variable and then call the method through the variable name.

let a = true;
let b = false;
let c = 123;
let d = "123";
 
console.log(typeof a.toString());
console.log(typeof b.toString());
console.log(typeof c.toString());
console.log(typeof d.toString());

string
string
string
string

The String() method converts the value itself into a string, while the toString() method returns a converted result without altering the original value.

Convert to numbers

The Number() function can be used to convert other data types into numbers. The conversion obeys the following rules:

• Strings that contain only white spaces will be converted into 0.

console.log(Number("\n\t   "));

0

• Strings that can be converted into numbers without errors, meaning they contain only number digits or a sign in the front, will be converted into the corresponding number.

console.log(Number("00001"));
console.log(Number("12345"));
console.log(Number("-12345"));
console.log(Number("-0.001"));

1
12345
-12345
-0.001

• The leading and tailing white spaces will be automatically removed.

console.log(Number("\t00001\t"));
console.log(Number("12345\n"));

1
12345

• If an error is encountered during conversion, meaning one or more characters can not be converted, then the string will become NaN.

console.log(Number("000a01"));
console.log(Number("123 45"));
console.log(Number("-12-345"));
console.log(Number("-0.00.1"));

NaN
NaN
NaN
NaN

• For Boolean values, true will become 1, and false will become 0.

console.log(Number(true));
console.log(Number(false));

1
0

• null will become 0, and undefined will become NaN. This is also one of the few differences between null and undefined. But again, in practice, you are unlikely to encounter circumstances where you need to differentiate the two explicitly.

console.log(Number(null));
console.log(Number(undefined));

0
NaN

Convert to Boolean values

The Boolean() function is used to convert other data types into either true or false. As we've demonstrated before, all falsy values will become false:

console.log(Boolean(null));
console.log(Boolean(undefined));
console.log(Boolean(0));
console.log(Boolean(""));

false
false
false
false

And all truthy values will become true:

console.log(Boolean(10));
console.log(Boolean(-10));
console.log(Boolean(" "));
console.log(Boolean("qwerty"));

true
true
true
true