Understanding Javascript Functions: parseInt ()

When using the parseInt () function a few days ago, you may not be able to give the answer at a time in case of some conversions. Simply study it to avoid thinking about it again in the future.

Definition
1. w3school:

The parseInt () function parses a string and returns an integer.

 
2. mozilla developers

Parses a string argument and returns an integer of the specified radix or base.
 
The differences between browsers are worth noting.

Analysis
According to the official explanation above, parseInt (string, radix)

There are two methods to call a function:

1. Specify radix. This is also the recommended method. Unfortunately, I didn't do this before.

2. Do not specify radix, that is, parseInt (string ). Although simple, there are many rules, which is the core of this article.

ParseInt (string, radix)
Radix indicates the conversion base, which is commonly referred to as binary, octal, decimal, and hexadecimal. The range is from 2 ~ 36, but when we call this method in JS, the conversion is basically based on 10.

If this parameter is smaller than 2 or greater than 36, parseInt () returns NaN.

The detailed rules for applying the "string" parameter are as follows:

(The base number 10 is used as an example because the occurrence frequency is the highest in actual use. However, if you forget to use other base numbers, you still need to be clear about the conversion between different operating systems. This should be a key course in computer science, it will be "Uncomfortable" to use this method "):

1) if they are all letters, NaN is returned, for example:

<Script type = "text/javascript">
Window. onload = function testParse (){
Alert (parseInt ("abc", 10 ));
}
</Script> 2) If none of them are letters, 123 is returned, for example:

<Script type = "text/javascript">
Window. onload = function testParse (){
Alert (parseInt ("123", 10 ));
}
</Script> 3) if both letters and numbers exist, for example:

<Script type = "text/javascript">
Window. onload = function testParse (){
Alert (parseInt ("1x2bc", 10 ));
Alert (parseInt ("df2bc", 10 ));
}
</Script>
ParseInt ("1x2bc", 10) returns: 1

ParseInt ("df2bc", 10) returns: NaN

Two rules are involved:

3.1) if the parameter "string" starts with a number, convert all the numbers before the first letter appears (NND, I always feel that the description is not in place ).

In the above example, the first letter that appears is 'x'. Take the previous digit string and only one digit is '1'. Then 1 is returned.

3.2) if the parameter "string" starts with a letter, NaN is directly returned (because the 10-digit letter is not a valid expression, what if radix is 16? The results can be run on your own .)

The above description is based on the explanation of ECMAScript (officially translated, very powerful ):

The parseInt () method first checks the character at the position 0 to determine whether it is a valid number. If not, the method returns NaN and does not continue to perform other operations. However, if the character is a valid number, this method will view the characters at position 1 and perform the same test. This process continues until a non-valid number is found. At this time, parseInt () converts the string before this character into a number.

This section describes parseInt (string, radix). If there are any errors or omissions, please refer to our official comments and thank you for your reference.

ParseInt (string)
When calling this function in this way, there will be many "Hidden Rules" because there is no specified radix displayed"

Below are two references

W3school

When the value of the radix parameter is 0, or this parameter is not set, parseInt () determines the base number based on the string.

For example, if the string starts with "0x", parseInt () resolves the rest of the string to a hexadecimal integer. If the string starts with 0, ECMAScript v3 allows an implementation of parseInt () to parse the subsequent characters into octal or hexadecimal numbers. If string is 1 ~ Start with a number of 9, parseInt () will resolve it to a decimal integer.

Mozilla developers

If the input string begins with "0x" or "0X", radix is 16 (hexadecimal) and the remainder of the string is parsed.
If the input string begins with "0", radix is eight (octal) or 10 (decimal ). exactly which radix is chosen is implementation-dependent. ECMAScript 5 specifies that 10 (decimal) is used, but not all browsers support this yet. for this reason always specify a radix when using parseInt.
If the input string begins with any other value, the radix is 10 (decimal ).
If the first character cannot be converted to a number, parseInt returns NaN.

The following is an example of the above content.

1) if the parameter "string" starts with "0x" or "0X", the base number is 16 by default, that is, the string is parsed in hexadecimal notation.

<Script type = "text/javascript">
Window. onload = function testParse (){
Alert (parseInt ("0 Xabcg "));
}
</Script> result: 2478,10 * 16² + 11*16 + 12*1

If it is parseInt ("0 Xgabcg"), what? The answer is NaN. As I have already said above, the letter that follows 0X is g, not a valid hexadecimal character. According to ECMAScript's explanation, NaN is directly returned.

2) If the parameter "string" starts with "0", the default base is?

Obviously, the w3school and mozilla statements are inconsistent. Let's test and see that IE10, Chrome, and Firefox are the latest versions)

<Script type = "text/javascript">
Window. onload = function testParse (){
Alert (parseInt ("010 "));
}
</Script> the result is 10, 10, and 8 in sequence. IE10 and Chrome are parsed in decimal notation, and FF is parsed in octal notation.

It seems that there is no hexadecimal parsing. Is it true? Continue Verification

<Script type = "text/javascript">
Window. onload = function testParse (){
Alert (parseInt ("09 "));
}
</Script>
The results are 9, 9, and 0 in sequence. IE10 and Chrome are parsed in hexadecimal notation, and FF is parsed in hexadecimal notation (because 9 is not a valid representation of hexadecimal notation, therefore, only the first digit 0 is parsed and the result is 0 ).

The conclusion of the verification is obvious. The description above by the mozilla developer seems to be correct.

I only have these three browsers on my computer, so I cannot know what results will be produced by other browsers. If any one of them verifies that they can be converted in hexadecimal format, please inform 3Q

3) if the parameter "string" does not start with the above two types, it will be parsed in hexadecimal notation.

<Script type = "text/javascript">
Window. onload = function testParse (){
Alert (parseInt ("fff "));
}
</Script> the returned result is NaN. The first letter 'F' is not a valid 10-digit representation, and NaN is directly returned.

4) The rules for calling the method also follow the rules in the parseInt (string, radix) section, that is, only valid characters are parsed. For example:

<Script type = "text/javascript">
Window. onload = function testParse (){
Alert (parseInt ("0xf1x "));
Alert (parseInt ("021x "));
}
</Script>
The results are as follows:

241 (IE, Chrome, FF), valid characters: "f1", 15*16 + 1 = 241

21 (IE, Chrome) or 17 (FF), valid character is "21", 10 is equal to 21,8: 2*8 + 1 = 17

End
ParseInt () is a simple function in JS, but it is because you do not pay much attention to these details that it is very "troublesome" to use ". I hope this chapter will help you.