# Vanilla JS - 7 ways to convert a string to a number in JavaScript

This is a quick post to show examples of 7 different ways to convert a string to a number in JavaScript along with the output that each gives for different values.

Number()

The `Number()`

function accepts a string parameter and converts it to an integer or floating point number, or returns `NaN`

(Not a Number) if the input value doesn't represent a number. An interesting thing to note is that zero (`0`

) is returned for an empty string (`Number('')`

).

The way to check if a value equals `NaN`

is to use the `isNan()`

function.

parseInt()

The `parseInt()`

function accepts a string parameter and converts it to an integer number, or returns `NaN`

(Not a Number) if the input value doesn't represent a number. If the input string begins with a number (e.g. `'123abc'`

) then `parseInt()`

will return the number from the beginning of the string (e.g. `123`

). If the input is an empty string (`Number('')`

) then `NaN`

(Not a Number) is returned.

parseFloat()

The `parseFloat()`

function accepts a string parameter and converts it to an floating point number (with a decimal point if required), or returns `NaN`

(Not a Number) if the input value doesn't represent a number. If the input string begins with a number (e.g. `'123abc'`

) then `parseInt()`

will return the number from the beginning of the string (e.g. `123`

). If the input is an empty string (`Number('')`

) then `NaN`

(Not a Number) is returned.

Unary plus operator (+)

The unary plus operator (`+`

) placed before a string converts it to an integer or floating point number, or returns `NaN`

(Not a Number) if the input value doesn't represent a number. Like the `Number()`

function, it returns zero (`0`

) for an empty string (`+''`

).

Multiply by 1 (* 1)

Multiplying a string by 1 (`[string] * 1`

) works just like the unary plus operator above, it converts the string to an integer or floating point number, or returns `NaN`

(Not a Number) if the input value doesn't represent a number. Like the `Number()`

function, it returns zero (`0`

) for an empty string (`'' * 1`

).

Math.round()

The `Math.round()`

method accepts a string parameter and converts it to an integer that is rounded to the closest whole number, for example `'12.4'`

is converted to `12`

and `'12.5'`

is converted to `13`

. It returns `NaN`

(Not a Number) if the input value doesn't represent a number, and like `Number()`

it returns zero (`0`

) for an empty string (`Math.round('')`

).

Math.floor()

The `Math.floor()`

method accepts a string parameter and converts it to an integer that is rounded down to the lowest whole number, for example `'12.9'`

is converted to `12`

. It returns `NaN`

(Not a Number) if the input value doesn't represent a number, and like `Number()`

it returns zero (`0`

) for an empty string (`Math.floor('')`

).

Here they are in action: (Edit on StackBlitz at https://stackblitz.com/edit/vanilla-js-ways-to-convert-a-string-to-a-number)

JavaScript Convert String to Number Code

This is the JavaScript code running in the above example.

```
// Number
set('number1', Number('123'));
set('number2', Number('12.5'));
set('number3', Number('123abc'));
set('number4', Number('abc'));
set('number5', Number(''));
// parseInt
set('parseInt1', parseInt('123'));
set('parseInt2', parseInt('12.5'));
set('parseInt3', parseInt('123abc'));
set('parseInt4', parseInt('abc'));
set('parseInt5', parseInt(''));
// parseFloat
set('parseFloat1', parseFloat('123'));
set('parseFloat2', parseFloat('12.5'));
set('parseFloat3', parseFloat('123abc'));
set('parseFloat4', parseFloat('abc'));
set('parseFloat5', parseFloat(''));
// unary plus operator (+)
set('unaryPlus1', +'123');
set('unaryPlus2', +'12.5');
set('unaryPlus3', +'123abc');
set('unaryPlus4', +'abc');
set('unaryPlus5', +'');
// multiply by 1 (* 1)
set('multiply1', '123' * 1);
set('multiply2', '12.5' * 1);
set('multiply3', '123abc' * 1);
set('multiply4', 'abc' * 1);
set('multiply5', '' * 1);
// Math.round
set('mathRound1', Math.round('123'));
set('mathRound2', Math.round('12.5'));
set('mathRound3', Math.round('123abc'));
set('mathRound4', Math.round('abc'));
set('mathRound5', Math.round(''));
// Math.floor
set('mathFloor1', Math.floor('123'));
set('mathFloor2', Math.floor('12.5'));
set('mathFloor3', Math.floor('123abc'));
set('mathFloor4', Math.floor('abc'));
set('mathFloor5', Math.floor(''));
function set(id, value) {
document.getElementById(id).innerHTML = value;
}
```

Need Some Vanilla JS Help?

Search fiverr for freelance Vanilla JS developers.

Follow me for updates

When I'm not coding...

Me and Tina are on a motorcycle adventure around Australia.

Come along for the ride!