How to convert a string to a number in JavaScript

There are multiple ways to convert a string into a number using JavaScript. You can use an actual number (e.g. 89) or a string (e.g. '89') to represent a number.

But if you compare both, they won't be the same as they represent two different kinds of objects:

const number1 = 89
const number2 = '89'

if (number1 === number2) {
  Console.log(true)
} else {
  console.log(false)
}

// Output => false

Let's look at 6 different methods to convert a string into a number.

parseInt() method

The parseInt() method converts a string into a whole number (an integer). It takes two arguments. The first argument is the string to convert. The second optional argument is the base number called radix:

parseInt('45') // 45
parseInt('99.49') // 99
parseInt('123Greetings.png') // 123

For decimal numbers, the radix is always 10. The parseInt() method can also be used for parsing hexadecimal strings with radix value 16:

parseInt(0xFF) // 255
parseInt('0xEE', 16) // 238

Always use parseInt() with a radix to avoid unexpected results. parseInt() can also be used to get a number from a string that may contain other characters (only if it starts with a number):

parseInt('10M') // 10
parseInt('$10M') // NaN

parseFloat() method

The parseFloat() method converts a string into a floating point number. It only takes one parameter, which is the string to parse. Unlike parseInt(), parseFloat() does not parse hexadecimal strings to numbers. The decimal separator must be a point (.). Otherwise, it will be dropped from the result:

parseFloat('9.49') // 9.99
parseFloat('50.00') // 50
parseFloat('3.5%') // 3.5
parseFloat('45,00') // 45
parseFloat('He is 29') // NaN

Number() method

As the name suggests, the Number() method converts a string into a number. It takes one argument that can be an integer, a point number, a boolean value, or even a date object. However, if you pass a string that contains random characters, you will get NaN - a stand for "Not a Number."

It's a less safe choice than parseInt() and parseFloat() for string to number conversion. If you are sure about the format of the number being parsed, use those methods instead. If you want the parsing to fail with NaN if the string contains other symbols, Number() may actually be an excellent choice:

Number('24') //24 
Number('15.49') // 15.49
Number('10,350') // NaN
Number('2rem') // NaN

Bitwise Not (~)

Bitwise not (~) is another method that can be used to convert a string into an integer. It does not work for floating numbers and returns 0 instead of NaN if the string contains characters:

~~9.99 // 9
~~'50' // 50
~~'10.89' // 10
~~'10px' // 0

Bitwise not (~) can be a better choice to ensure the input string does not include any character while parsing it to an integer.

Unary operators

Unary operators (+, *, -, and /) can also be used for string conversion to numbers. Just like bitwise not, unary operators are not happy to see other characters in the string and return NaN instead of 0 or guessing the number:

+'10' // 10
'0xFF' - 15 // 240
'49.5' * 1 // 49.5
'100' / 2 // 50
'10,00' * 1 // NaN

Math.floor() method

The Math.floor() method is similar to the unary operator + but only returns the integer part of the string:

Math.floor('10') // 10
Math.floor('12.5') // 12
Math.floor('10,000') // NaN

✌️ Like this article? Follow me on Twitter and LinkedIn. You can also subscribe to RSS Feed.

You might also like...

Digital Ocean

The simplest cloud platform for developers & teams. Start with a $200 free credit.

Buy me a coffee ☕

If you enjoy reading my articles and want to help me out paying bills, please consider buying me a coffee ($5) or two ($10). I will be highly grateful to you ✌️

Enter the number of coffees below:

✨ Learn to build modern web applications using JavaScript and Spring Boot

I started this blog as a place to share everything I have learned in the last decade. I write about modern JavaScript, Node.js, Spring Boot, core Java, RESTful APIs, and all things web development.

The newsletter is sent every week and includes early access to clear, concise, and easy-to-follow tutorials, and other stuff I think you'd enjoy! No spam ever, unsubscribe at any time.