JavaScript parseInt() is a function that is used to convert String datatype into Integer datatype.
This function contains two parameters.
- String
- Radix
Table of Contents
Syntax
parseInt(string, radix);
The string is a value that the user wants to convert into an Integer. And radix is a number that represents the numeral system; its value lies between 2 and 36. The radix parameter is optional.
What does JavaScript parseInt() Function Return?
It returns a number that is converted from the given string. And it also returns NaN (Not a Number) in two conditions. The first condition is when the user provides a radix with a value less than 2 or greater than 36. And the second condition is when it cannot convert the first character, or the first character is non-whitespace.
How to Use JavaScript parseInt() Function?
By putting parameters into the function, we discussed above. We need to provide a string parameter and radix parameter. We discussed that the radix parameter is optional, so what value will it assume by default if we do not provide it a radix value? It will take the value as 16 if the string starts from 0x or 0X, 8 if the string starts from 0, And the value as 10 for all the other values. Let’s have a look at different examples.
Example# 01
In this example, we’ll initialize a variable and call the parseInt() function passing a simple number in string format. And it will return us an integer value.
Code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p id="demo"></p>
<script>
str = parseInt("75");
document.getElementById("demo").innerHTML = "parseInt('75') = " + str;
</script>
</body>
</html>
Output

Example# 02
In this example, we’ll initialize variables and call the parseInt() function, passing different floating number values in string format. And will also return integer values.
Code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p id="demo"></p>
<script>
str1 = parseInt("75.00");
str2 = parseInt("75.16");
str3 = parseInt("75.75");
document.getElementById("demo").innerHTML = "parseInt('75.00') = " + str1
+ ", " + "parseInt('75.16') = " + str2 + ", " + "parseInt('75.75') = " + str3;
</script>
</body>
</html>
Output

Example# 03
In this example, we’ll initialize a variable and call the parseInt() function passing simple number values with string format spaces. And it will return the first value that occurs before space in an integer format.
Code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p id="demo"></p>
<script>
str1 = parseInt("75 00 16");
document.getElementById("demo").innerHTML = "parseInt('75 00 16') = " + str1;
</script>
</body>
</html>
Output

Example# 04
In this example, we’ll initialize a variable and call the parseInt() function passing simple number value with string value whole in string format. And it will return the number value in integer form if the string parameter is starting from the number, or else if the string parameter is starting from the string value, it will return NaN.
Code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p id="demo"></p>
<script>
str1 = parseInt("75 roll");
str2 = parseInt("roll 75");
document.getElementById("demo").innerHTML = "parseInt('75 roll') = " + str1
+ ", " + "parseInt('roll 75') = " + str2;
</script>
</body>
</html>
Output

Example# 05
In this example, we’ll initialize a variable and call the parseInt() function passing simple number value whole in string format and radix as well. Let’s have a look on different examples and it’s results in one.
Code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p id="demo"></p>
<p id="demo2"></p>
<script>
str1 = parseInt("20", 20);
str2 = parseInt("010");
str3 = parseInt("20", 7);
str4 = parseInt("0x10");
str5 = parseInt("10", 17);
str6 = parseInt("F", 16);
str7 = parseInt("0xA", 16);
document.getElementById("demo").innerHTML = "parseInt('20', 20) = " +
str1 + ", parseInt('010')" + str2 + ", parseInt('20', 7) = " + str3 +
", parseInt('0x10') = " + str4;
document.getElementById("demo2").innerHTML = "parseInt('10', 17) = " + str5 +
", parseInt('F', 16) = " + str6 + ", parseInt('0xA', 16) = " + str7;
</script>
</body>
</html>
Output

Conclusion
In this article we had discussion on JavaScript parseInt() function. It converts string type into an integer and it passes two parameters in it, String and Radix. The string is the value we wanted to convert, and radix is the numeral system number value between 2 and 36. And we also saw different examples in different scenarios.