When you're working with data from various sources, some of these data may arrive in the incorrect format. And you'll need to correct those formats before performing certain actions on the data.

This is just one of the many reasons you might want to learn how to convert a string to a number in JavaScript.

In this article, we will learn how to convert string to number by going through the various methods and providing examples for each.

Before we begin, a common way to distinguish a string value is that it is always enclosed in either a single or double quote, whereas a number is not:

"John Doe" -> String
'John Doe' -> String
"12" -> String
12 -> Number

Suppose we have our string stored in a variable. A good way to check if a variable is a string is by using the typeof operator:

let name = "John Doe";

console.log(typeof name) // "string"

Let’s now learn how to convert a string to a number.

How to Convert a String to a Number Using the Number() Function

The Number function is a powerful method that you can use to convert strings or other values to the Number type. This method will also return NaN if the value can't be converted:

console.log(Number('212'))  // 212
console.log(Number("2124"))  // 2124
console.log(Number('0.0314E+2')); // 3.14

console.log(Number("Hello World"))  // NaN
console.log(Number(undefined))  // NaN

This also works with variables:

let age = "12";
let password = "John12";

console.log(Number(age)) // 12
console.log(Number(password)) // NaN

This is one of the easiest methods to use as it also works with decimal values and returns the values without manipulating them:

let answer = "12.0";
let answer = "12.0267";

console.log(Number(answer)) // 12.0
console.log(Number(answer)) // 12.0267

How to Convert a String to a Number Using the parseInt() and parseFloat() Functions

Both the parseInt() and parseFloat() functions takes in a string as a parameter, and then convert that string to an integer/number.

You can also use parseInt() for converting a non-integer number to an integer, while parseFloat() is the more powerful method as it can maintain floats and some mathematical logic:

console.log(parseInt('12')) // 12
console.log(parseInt('12.092')) // 12.092
console.log(parseInt('  3.14  ')) // 3
console.log(parseInt('0.0314E+2')) // 0
console.log(parseInt('John Doe')) // NaN

console.log(parseFloat('12')) // 12
console.log(parseFloat('12.092')) // 12.092
console.log(parseFloat('  3.14  ')) // 3.14
console.log(parseFloat('0.0314E+2')) // 3.14
console.log(parseFloat('John Doe')) // NaN

As usual this also works with variables:

let age = "12";

console.log(parseInt(age)) // 12
console.log(parseFloat(age)) // 12

Note: The parseFloat() function will always return NaN when the character of the string cannot be converted to number:

console.log(parseFloat('N0.0314E+2')) // NaN

How to Convert a String to a Number Using the Unary Plus Operator (+)

The is one of the fastest and easiest ways to convert something into a number. I said “something” because it converts far more than just string representations of numbers and floats – it also works on the non-string values true, false, and null or an empty string.

One advantage (or also disadvantage) of this method is that it does not perform any other operations on the number like rounding up or converting it to an integer.

Let’s take a look at some examples:

console.log(+'100'); // 100
console.log(+'100.0373'); // 100.0373
console.log(+''); // 0
console.log(+null); // 0
console.log(+true); // 1
console.log(+false); // 0
console.log(+'John Doe'); // NaN
console.log(+'0.0314E+2'); // 3.14

As expected this also works with variables:

let age = "74";

console.log(+age); // 74

If you compare ParseInt() and the plus Unary Operator, you might end up using the plus Unary Operator over the parseInt() method in some situations.

For example, let's say you're getting random values – let’s say a UUID value which at some point might start with numbers and at other points can start with letters. This means using the parseInt() function might sometime return NaN and other times return the first characters that are numbers:

console.log(parseInt("cb34d-234ks-2343f-00xj")); // NaN
console.log(parseInt("997da-00xj-2343f-234ks")); // 997


console.log(+"cb34d-234ks-2343f-00xj"); // NaN
console.log(+"997da-00xj-2343f-234ks"); // NaN

How to Convert a String to a Number Using JavaScript Math Methods

Another way to convert strings to number is by using some JavScript math methods.

You can use the floor() method, which will round down the passed value to the nearest integer. The ceil() method, which is the opposite of floor(), rounds up to the nearest integer. Lastly the round() method, which is between both, just rounds the number to the nearest integer (either up or down depending on the closeness).

How to Convert a String to a Number Using the Math.floor() JavaScript Method

Just like I explained above, this will always return an integer. Suppose we pass a float value – it will round down the value to the nearest integer. This will return NaN if we pass letters as a string or any other non-integer character:

console.log(Math.floor("14.5")); // 14
console.log(Math.floor("654.508")); // 654
console.log(Math.floor("0.0314E+2")); // 3
console.log(Math.floor("34d-234ks")); // NaN
console.log(Math.floor("cb34d-234ks-2343f-00xj")); // NaN

How to Convert a String to a Number Using the Math.ceil() JavaScript Method

This is quite similar and will only round up our float values to always return a whole number:

console.log(Math.ceil("14.5")); // 15
console.log(Math.ceil("654.508")); // 655
console.log(Math.ceil("0.0314E+2")); // 3
console.log(Math.ceil("34d-234ks")); // NaN

How to Convert a String to a Number Using the Math.round() JavaScript Method

This works like both methods but just returns the whole number after rounding up to the nearest integer:

console.log(Math.round("14.5")); // 15
console.log(Math.round("654.508")); // 655
console.log(Math.round("0.0314E+2")); // 3
console.log(Math.round("34d-234ks")); // NaN

All the above Math methods also work with variables:

let age = "14.5";

console.log(Math.floor(age)); // 14
console.log(Math.ceil(age)); // 15
console.log(Math.round(age)); // 15

How to Convert a String to a Number Using some Mathematical Operations

This isn't really a method, but it's worth knowing. So far, we've discussed direct methods for achieving this conversion – but in some cases, you might just want to perform these mathematical operations to help with the conversion.

These includes multiplication by 1, division by 1 and also subtraction by 0. When we perform any of these operations on a string, they will be converted to integers:

console.log("14.5" / 1); // 14.5
console.log("0.0314E+2" / 1); // 3.14

console.log("14.5" * 1); // 14.5
console.log("0.0314E+2" * 1); // 3.14

console.log("14.5" - 0); // 14.5
console.log("0.0314E+2" - 0); // 3.14

As usual this also works with variables:

let age = "14.5";

console.log(age / 1); // 14.5
console.log(age * 1); // 14.5
console.log(age - 0); // 14.5

Conclusion

In this article, we looked at various methods and approaches for converting strings to integers in JavaScript.

It is best to be aware that many methods exist so that you can choose what works best for you and apply it in any situation.