Skip to main content

JavaScript Type Conversion

JavaScript Type Conversion

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

There are two types of type conversion in JavaScript: implicit and explicit.

Implicit type conversion happens automatically when a value of one type is used in a context that expects a value of another type. For example, if you add a number to a string, the number will be converted to a string before being added to the other string.

Explicit type conversion, also known as type casting, occurs when the developer explicitly converts one data type to another using a built-in method such as toString(), Number(), or Boolean(). For example, if you want to convert a string to a number, you can use the Number() function.

Converting Strings to Numbers

In JavaScript, there are several ways to convert a string to a number. Here are some of the most common methods let's explore them one by one.

The Number() function

This function can be used to convert a string to a number. If the string contains only numeric characters, it will be converted to a number. Otherwise, the result will be NaN (not a number).

const str = "123";
const num = Number(str); // num is 123 (a number)

The parseInt() function

This function can be used to convert a string to an integer. It takes a second argument, which specifies the base of the number system used in the string (e.g. 10 for decimal, 16 for hexadecimal). If the string contains non-numeric characters, the result will be the integer part of the string before the first non-numeric character.

const str = "123";
const num = parseInt(str); // num is 123 (an integer)

const hex = "0xFF";
const hexNum = parseInt(hex, 16); // hexNum is 255 (an integer)

The parseFloat() function

This function can be used to convert a string to a floating-point number. It works similarly to parseInt(), but returns a floating-point number instead of an integer.

const str = "3.14";
const num = parseFloat(str); // num is 3.14 (a floating-point number)
caution

It's important to note that if the string cannot be converted to a number, the result will be NaN.

Converting Numbers to Strings

In JavaScript, there are several ways to convert a number to a string. Here are some of the most common methods:

The toString() method

This method can be used to convert a number to a string. It takes an optional argument, which specifies the base of the number system used in the string.

const num = 123;
const str = num.toString(); // str is "123" (a string)

const hexNum = 255;
const hexStr = hexNum.toString(16); // hexStr is "ff" (a string)

The String() function

This function can also be used to convert a number to a string. It works similarly to the toString() method.

const num = 123;
const str = String(num); // str is "123" (a string)

The Template literal

A template literal can be used to convert a number to a string by embedding it in a string using backticks (`). This method can also be used to include other variables or expressions in the resulting string.

const num = 123;
const str = `The number is ${num}`; // str is "The number is 123" (a string)
tip

When converting a number to a string, any leading zeros in the number will be ignored, and any trailing zeros after a decimal point will be preserved. In addition, if the number is NaN, the resulting string will be "NaN".

Converting Dates to Numbers

You can convert a Date object to a number using the getTime() method. This method returns the number of milliseconds since January 1, 1970, 00:00:00 UTC.

As an example:

const date = new Date();
const time = date.getTime(); // time is the number of milliseconds since January 1, 1970, 00:00:00 UTC

You can also use the valueOf() method of the Date object to achieve the same result. This method returns the same value as getTime().

As an example:

const date = new Date();
const time = date.valueOf(); // time is the number of milliseconds since January 1, 1970, 00:00:00 UTC

Once you have the number of milliseconds, you can convert it to a different unit of time (such as seconds or minutes) by dividing it by the appropriate number of milliseconds per unit. For example, to convert milliseconds to seconds, you can divide by 1000:

const date = new Date();
const time = date.getTime(); // time is the number of milliseconds since January 1, 1970, 00:00:00 UTC
const seconds = time / 1000; // seconds is the number of seconds since January 1, 1970, 00:00:00 UTC

Converting Booleans to Numbers

You can convert a Boolean value to a number using the Number() function or the unary plus operator (+).

Here's an example using the Number() function:

const bool = true;
const num = Number(bool); // num is 1 (a number)

const bool2 = false;
const num2 = Number(bool2); // num2 is 0 (a number)

And here's an example using the unary plus operator:

const bool = true;
const num = +bool; // num is 1 (a number)

const bool2 = false;
const num2 = +bool2; // num2 is 0 (a number)
tip

When converting a Boolean value to a number, true is converted to 1, and false is converted to 0.