What is the difference between parseInt(string) and Number(string) in JavaScript?
-
2See with full example.KarSho– KarSho2015-04-20 14:07:15 +00:00Commented Apr 20, 2015 at 14:07
Add a comment
|
6 Answers
parseInt("123qwe")
returns 123
Number("123qwe")
returns NaN
In other words parseInt() parses up to the first non-digit and returns whatever it had parsed. Number() wants to convert the entire string into a number, which can also be a float BTW.
EDIT #1: Lucero commented about the radix that can be used along with parseInt(). As far as that is concerned, please see THE DOCTOR's answer below (I'm not going to copy that here, the doc shall have a fair share of the fame...).
EDIT #2: Regarding use cases: That's somewhat written between the lines already. Use Number() in cases where you indirectly want to check if the given string completely represents a numeric value, float or integer. parseInt()/parseFloat() aren't that strict as they just parse along and stop when the numeric value stops (radix!), which makes it useful when you need a numeric value at the front "in case there is one" (note that parseInt("hui") also returns NaN). And the biggest difference is the use of radix that Number() doesn't know of and parseInt() may indirectly guess from the given string (that can cause weird results sometimes).
4 Comments
Lucero
This answer is incomplete because it does not mention the format detection (hex/octal/decimal) performed by
parseInt(), which can cause significant grief because it behaves different to the common expectation in some cases (leading zero). The radix should therefore usually be specified explicitly, even more so when comparing it to the Number() function.
sjngm
@Lucero I agree, actually I ran into exactly that some time ago. That cost me some time to find the bug... I updated my answer with a reference to another answer.
deadboy
Importantly parseInt("") will return NaN, whereas Number("") will return 0.
Sam Saarian
Use of
parseInt() extends to parsing hex numbers whereas Number() works with (string) numbers only; e.g. parseInt('f',16) will return 15, etc. I use parseInt() to dynamically convert colors from one format to another (rgba, hsl, hex).The first one takes two parameters:
parseInt(string, radix)
The radix parameter is used to specify which numeral system to be used, for example, a radix of 16 (hexadecimal) indicates that the number in the string should be parsed from a hexadecimal number to a decimal number.
If the radix parameter is omitted, JavaScript assumes the following:
- If the string begins with "0x", the
radix is 16 (hexadecimal) - If the string begins with "0", the
radix is 8 (octal). This feature
is deprecated - If the string begins with any other value, the radix is 10 (decimal)
The other function you mentioned takes only one parameter:
Number(object)
The Number() function converts the object argument to a number that represents the object's value.
If the value cannot be converted to a legal number, NaN is returned.
2 Comments
dbaq
now when the radix parameter is omitted, JS assumes the radix is 10.
T.J. Crowder
@dbaq: 10 is assumed unless the string starts with
0x or 0X, in which case that's stripped and 16 is assumed. (Using octal if the number starts with 0 was never part of the standard and is now expressly forbidden for parseInt as of ES2015.)parseInt(string) will convert a string containing non-numeric characters to a number, as long as the string begins with numeric characters
'10px' => 10
Number(string) will return NaN if the string contains any non-numeric characters
'10px' => NaN
The parseInt function allows you to specify a radix for the input string and is limited to integer values.
parseInt('Z', 36) === 35
The Number constructor called as a function will parse the string with a grammar and is limited to base 10 and base 16.
StringNumericLiteral :::
StrWhiteSpaceopt
StrWhiteSpaceopt StrNumericLiteral StrWhiteSpaceopt
StrWhiteSpace :::
StrWhiteSpaceChar StrWhiteSpaceopt
StrWhiteSpaceChar :::
WhiteSpace
LineTerminator
StrNumericLiteral :::
StrDecimalLiteral
HexIntegerLiteral
StrDecimalLiteral :::
StrUnsignedDecimalLiteral
+ StrUnsignedDecimalLiteral
- StrUnsignedDecimalLiteral
StrUnsignedDecimalLiteral :::
Infinity
DecimalDigits . DecimalDigitsopt ExponentPartopt
. DecimalDigits ExponentPartopt
DecimalDigits ExponentPartopt
DecimalDigits :::
DecimalDigit
DecimalDigits DecimalDigit
DecimalDigit ::: one of
0 1 2 3 4 5 6 7 8 9
ExponentPart :::
ExponentIndicator SignedInteger
ExponentIndicator ::: one of
e E
SignedInteger :::
DecimalDigits
+ DecimalDigits
- DecimalDigits
HexIntegerLiteral :::
0x HexDigit
0X HexDigit
HexIntegerLiteral HexDigit
HexDigit ::: one of
0 1 2 3 4 5 6 7 8 9 a b c d e f A B C D E F
Addendum to @sjngm's answer:
They both also ignore whitespace:
var foo = " 3 "; console.log(parseInt(foo)); // 3 console.log(Number(foo)); // 3
It is not exactly correct. As sjngm wrote parseInt parses string to first number. It is true. But the problem is when you want to parse number separated with whitespace ie. "12 345". In that case parseInt("12 345") will return 12 instead of 12345.
So to avoid that situation you must trim whitespaces before parsing to number.
My solution would be:
var number=parseInt("12 345".replace(/\s+/g, ''),10);
Notice one extra thing I used in parseInt() function. parseInt("string",10) will set the number to decimal format. If you would parse string like "08" you would get 0 because 8 is not a octal number.Explanation is here
Comments
Addendum to @sjngm's answer:
They both also ignore whitespace:
var foo = " 3 ";
console.log(parseInt(foo)); // 3
console.log(Number(foo)); // 3
