The parseInt()
function parses a string input argument of function and returns as a result an integer value. If this is not possible, the function returns NaN. In life, we often use values with certain units, such as "$10". To receive the numerical value of such lines we can use the function parseInt()
.
Syntax and parameters
The syntax of the parseInt()
function:
parseInt(string)
parseInt(string, radix)
string
value - the input string to be converted to an integer value (required).
radix
value - also an integer argument indicating the basis of the number system of the analyzed number in the string, value between 2 and 36 is allowed (optional, default value is 10). In general, it is better to specify this argument. Otherwise we may get extra errors in the program.
If this argument is absent or equal to 0, the string value can be parsed by the following ways:
If the first characters of the string "0x" or "0X", then it is parsed as a hexadecimal number.
If the first character of the string is "0", then it is parsed as an octal number. It is worth saying that today not all browsers treat the parsed number as octal. Some strings, even if they start with "0", are parsed as decimal numbers.
If the string begins with a digit other than "0", then it is parsed as a decimal number.
At the end of this article we will consider what arguments can be given to the function parseInt()
and what kinds of numbers exist in general and how many ways you can write the same number.
Return value
Firstly, this function can return an integer if everything is okay. Secondly, the result of the function can be NaN
in case the first non-whitespace character cannot be converted to a number type or in case radix does not fit in the range from 2 to 36 (modulo 2 ** 32 less than 2 or more than 36).
For example, if the radix is equal to 10 as a result of the function will give a decimal number, if the radix is 16, we will have a hexadecimal, etc. Also if radix is more than 10 all numbers after nine are represented by letters of the Latin alphabet. A through F are used, for example, for hexadecimal numbers (base 16).
Sometimes one part of the input string can be transformed by parseInt()
function while the other part of this string cannot be transformed. So if the word begins with characters that can not be spoiled, we immediately get the NaN
result and the function will stop running.
But if in the conversion process parseInt()
detects a number that is not a digit in the radix-based number system, such as G in the 16-digit system or A in the decimal system, the conversion process ends immediately and returns the value obtained from the string at the moment.
Features of the function
Important fact that the function allows the use of spaces at the beginning and end of input string. In addition parseInt()
rounds fractional numbers because in the work it stops at the decimal point.
We already know that some numbers contain the E character in their string representation (12.04E21 for 12.04 × 10 ^ 21). In this case using parseInt()
to reduce numbers can lead to unexpected results when used for very large or very small numbers. Therefore, you should not use parseInt()
as a replacement for Math.floor()
function. Only the first integer found is returned as a result.
parseInt()
understands two signs: "+" for positive numbers and "-" for negative numbers. Well, firstly the function parseInt()
removes whitespaces in the parameter and immediately sees if these characters are present.
If these characters are not found, the function algorithm proceeds to the next step. Otherwise, if this character is present, the function removes the character and continues parsing numbers for the rest of the string.
Examples
Finally, let's look at examples of application of the function parseInt()
where we will not explicitly specify the second parameter.
parseInt("30");
parseInt("30.00");
parseInt("30.33");
parseInt("+30");
parseInt("-30");
parseInt("030");
parseInt("30 years");
As a result in all previous cases we get the number "30".
With the first example there should be no questions. In examples 2 and 3, the function does not recognize the ".". So, as a result displays everything to the left of this sign.
parseInt(" 30 ");
In this case as a result we will also "30". We have already mentioned that the function allows us to use spaces at the beginning and end of the input line and processes them itself.
However, if the spaces are inside the string, the function does not recognize them. Therefore, as a result of the next line, we get the number 30.
parseInt("30 31 32");
In the following cases, the string starts with a character that cannot be converted to a numeric value. So, we will have a NaN
result.
parseInt("Number 30");
parseInt("Hello");
parseInt(" + plus ");
Well let's move on to examples where the second parameter is explicitly set.
parseInt("10",10); // 10 as a result
parseInt("10",8); // 8 as a result
parseInt("0x10", 16); // 16
parseInt("10",16); // 16
In conclusion, if you understand different numeral systems, it will be easy for you to understand the results of the following examples (in each subsequent example it is equal to 15):
parseInt('0xF', 16)
parseInt('F', 16)
parseInt('17', 8)
parseInt(021, 8)
parseInt('015', 10)
parseInt(15.99, 10)
parseInt('15,123', 10)
parseInt('FXX123', 16)
parseInt('1111', 2)
parseInt('15 * 3', 10)
parseInt('15e2', 10)
parseInt('15px', 10)
parseInt('12', 13)
The following examples all return -15:
parseInt('-F', 16)
parseInt('-0F', 16)
parseInt('-0XF', 16)
parseInt(-15.1, 10)
parseInt('-17', 8)
parseInt('-15', 10)
parseInt('-1111', 2)
parseInt('-15e1', 10)
parseInt('-12', 13)
Number systems
We have already learned a bit about how to write a number. For example, if the ticket costs $200, we can say:
price = 200;
price = 200 $;
price = 200 dollars;
price = 2 * 10^2;
price = 2e2;
This applies to the first parameter of the function parseInt()
.
Also, when we studied the parameters of the function parseInt()
we said that the radix
is an integer argument indicating the basis of the number system of the analyzed number in the string.
So what is the number system and its variants? Well, the number system is a way of representing numbers on the number line with a number of symbols and rules. In real life we are accustomed to the decimal number system and we use it the most. This is the usual notation for us of numbers that we studied in school. The decimal system uses 10 different digits (0 1 2 3 4 5 6 7 8 9). With the help of these numbers we can write multi-digit numbers (25, 365, 1000500).
Another very popular and well-known type of number system is the binary number system. Оnly two characters are used in this system (0 and 1). Another well-known system is the hexadecimal system where 16 characters are used (0 1 2 3 4 5 6 7 8 9 A B C D E F). There are also other number systems (octal, hexadecimal, etc.).But let's take a closer look at the binary number system.
Binary number system
Binary number systems are used in computers or other electronic devices, programming, mathematics. This is quite convenient because only 2 characters are used. Let's count to 16 in the binary system:
0 - 0000
8 - 1000
1 - 0001
9 - 1001
2 - 0010
10 - 1010
3 - 0011
11 - 1011
4 - 0100
12 - 1100
5 - 0101
13 - 1101
6 - 0110
14 - 1110
7 - 0111
15 - 1111
This correspondence of numbers can simply be remembered. For more complex numbers there are methods of transferring numbers from one system to another. The method involves dividing a number by two each time (from decimal number system to binary) and searching for the power of two (from binary number system to decimal).
In JavaScript we can use the parseInt()
function we talked about to convert a number from one system to another.
parseInt(5, 2); // 101 as a result
It is quite simple to convert a number from decimal to binary. But in reverse order there are some difficulties. If the input string starts with '0' or '1' symbol, this string is parsed as an octal or decimal number, but not as binary. So, if you need to convert a string from binary to decimal, maybe, you will need to write one additional function that will be able to recognize the input binary string.
BigInt
A few words about BigInt
. It is the object for declaring very large numbers (253 - 1). For example,if we have in input string a large number like 1234567890123456789, what will be the result of the function parseInt()
?
Well, when parseInt()
converts a BigInt value to a Number value, this function can lose precision. The result may not be accurate. The reason for this is discarding trailing non-numeric values ('n').
parseInt('123456n', 10) // 123456
parseInt('123456789012345678n', 10) // 123456789012345700
parseInt() vs Number()
Last but not least, about comparison parseInt()
and Number()
function. You can often hear the question of which of these functions is better, which is more convenient to use and how they differ in general.
Number()
function is able only to convert the type from one to another but parseInt()
can parse the value of input string and then convert it. While the Number()
function will try to convert all input strings, parseInt()
will move step by step if it does not meet number characters.
In case of an error Number()
will give out a completely false result. parseInt()
will print a number which the function managed to recognize before an unrecognized sign. And if we pass the same parameters in both functions, we can get different results.
For example, if the input string for parseInt()
will be null
or true
the result will be NaN
. in case of Number()
function, the result will be 0
and 1
in accordance. And one more example to finally understand:
parseInt("10$") //10
Number("10$"); //NaN
In summary, although these two functions are indeed similar, they do a slightly different job, so they need to be used individually.