JavaScript parseInt() Function
This tutorial introduces JavaScript's parseInt() function. parseInt() is a built-in core JavaScript function, not part of the Number object. We chose to cover it with our Number object tutorials since it is with this data type that parseInt(), and its sibling parseFloat(), will mostly deal. The parseInt() function attempts to extract an integer from string values. In addition to being a commonly used data type (think of web form input), string values are also returned by all JavaScript Number object's methods.
Using JavaScript's parseInt() Function with One Argument
The parseInt() function takes at least one argument, the string from which to convert to an integer value. The script below uses parseInt() to extract an integer from a quoted floating point number.
var carter = "12.97";
alert( parseInt(carter).toString() );
The script above returned the number 12. It illustrates the parseInt() function's extracting logic: it does not attempt to round the extracted number the nearest integer. Instead, parseInt() makes the most of the string argument.
We will now pass more ambiguous arguments to the parseInt() function:
var carter1 = "13th is today's date";
var carter2 = "Today is the 13th";
alert( parseInt(carter1) +"\n"+ parseInt(carter2) );
We omitted the toString() method for clarity: JavaScript automatically converts to string arguments passed to the alert() method. The last line of code displays the integer parseInt() extracted from the first string, and on the next line, the string extracted from the second string variable.
The JavaScript interpreter was able to correctly convert the leading number of our first string to an integer. In the second case, however, parseInt() was confused by the string characters surrounding the number. As a result, the parseInt() function gave up, and returned the NaN Number property.
Handling NaN Values Returned by the parseInt() Function
Whenever the parseInt() function is unsuccessful at converting a string to an integer value, it simply returns NaN ("Not a Number"). It is then easy to check on the success of the string to integer conversion before proceeding with your next code statement, by using the isNaN() function (covered later).
var userAge = "I am 13";
if( isNaN( parseInt(userAge) ) )
alert(" Please re-enter your age.");
As experienced earlier, the JavaScript interpreter could not convert the string to an integer. Thanks to the isNaN() function, the problem was handled.
Using JavaScript's parseInt() Function with Two Arguments
The parseInt() function accepts a second, optional argument. The second argument determines in which base to express the integer extracted; if no second argument is passed, a conversion to base 10 occurs. The parseInt() function only performs a base conversion in case of successful extraction.
var numex = "F";
alert( parseInt(numex,16) );
The piece of code above extracted a base 16 (hexadecimal) number from a quoted letter "F" (case-insensitive), and returned 15, the value of F in base 16.
If the second argument had been omitted, or if 10 had been passed, the parseInt() function would have returned NaN.
Using regular expressions with parseInt()
The parseInt() method will fail in some cases, namely when it cannot successfully extract a number from a string (in other words, when it cannot parse the integer in the string you are testing). Fortunately, JavaScript regular expressions can come in to help. In the following script, we are first removing any non-numerical characters, and then running parseInt() on the resulting string:
// Declare a string containing an integer:
var carter = "I know 5 things about JavaScript";
// Remove non-digits from the string we'll send to parseInt:
// (In other words, replace non-numbers with an empty string)
carter = carter.replace( /\D/g , "" );
// Parse integers in the resulting string:
var numex = parseInt(carter); // numex now contains integer value 5
The JavaScript code above could of course have been more efficiently re-written as a single statement:
parseInt( carter.replace(/\D/g,"") );
As you probably guessed, the symbol "\D
" is used to denote non-numerical characters in regular expressions with JavaScript and other programming languages. The symbol used to match numbers is "\d" (escaped lowercase "d
" for digits, and escaped uppercase "D
" for non-digits). Whenever possible and feasible, you can use JS regular expressions to extend the integer-parsing abilities of the parseInt() function.
The "g
" modifier in "/\D/g
" is very important: it applies the global property to our regular expression: this instructs JavaScript to match not just the first non-digit character, but all of them. Without applying the global property, the string we passed as parseInt() argument would have been " know 5 things about JavaScript"
- (and the parseInt() function would have failed).
Test the parseInt() Function
Interactively test the parseInt() function by editing the JavaScript code below and clicking the Test parseInt() function button.
Browser support for JavaScript parseInt() function | |||
---|---|---|---|