How to parseInt() Function convert a string to an integer in javascript?

This parseint JavaScript article explains how to use the Number Function called parseInt() with syntax and examples.The parseInt() method is a native method in JS which allows users to convert a all the Data string to dataype of an integer Data value.

JavaScript: Number parseInt() Function

In JavaScript, parseInt() is a Number Function that is used to parse a string and return its value as an integer Number format. Because parseInt() is a Function of the Number object, it must be invoked through the object called Number.

Syntax

In JavaScript, the Baisc syntax for the parseInt() Function is:

Number.parseInt(string_value [, radix]);

Parameters or Arguments

string_value

The Custom Data string value to convert to an integer number format.

radix

elective. It indicates the radix or base of the mathematical expressing numeral system of numeration to use to convert the data_str_val to datatype of an integer. It can be datatype of an integer value between range of the 2 and 36.

For example, a radix of 2 would mean the data_str_val should be evaluated as a Binary Number format, a radix of 10 would mean that the data_str_val should be evaluated as a Decimal Number format, and so on.

If no radix is provided, the data_str_val will be evaluated as a Decimal Number format.

Returns

The parseInt() Function parses a string and returns its value as an integer Number format (evaluating the data_str_val based on the mathematical expressing numeral system of numeration specified by the optional radix parameter).

If the parseInt() Function is passed a value that can not be converted to an integer using the appropriate radix (ie: Decimal is the default when no radix is provided), it will return NaN.

Read Also:  jQuery parseInt Convert String to Integer Number

Note

In mathematical expressing numeral systems of numeration, the radix specifies the number of unique digitals in the numeral system of numeration including 0. For example, a radix of 10 would showing the Decimal number system because the Decimal number system uses ten digits from 0 through 9. So, a radix of 2 would showing the Binary number system because the Binary number system uses only 2 digits which are 0 and 1.

Example:

Let’s take a look at an example of how to use the parseInt() Function in JavaScript.

For example: Convert empty string(“”) to integer with parseInt() in js

console.log(Number.parseInt('35.6'));
console.log(Number.parseInt('123ABC4'));
console.log(Number.parseInt('ABC123'));

console.log(Number.parseInt('98.89'));
console.log(Number.parseInt('9898XYZW'));
console.log(Number.parseInt('XYZW98665'));

In this example, we have invoked the parseInt() Function using the Number class.

We have written the display results of the parseInt() Function to the web browser console log, for demonstration purposes, to show what the parseInt() Function returns.

The following will be display results to the web browser console log:

98
9898
NaN

In this example, the first display results to the console log returned 98 which is the integer representation of the string value ‘98.89’.

The onther display results to the console log returned 9898 since the parseInt() Function will parse the string value ‘9898XYZW’ until a non-numeric character is encountered and then it will trash the others of the Data string, returning the integer data value.

The last example display results to the console log returned NaN since the string value ‘XYZW98665’ does not start with a numeric value.

Read Also:  Laravel INSERT Multiple Rows Into a Table

Specifying a radix parameter

You can also identify a radix total parameter to evaluate your data_str_val in a different mathematical numeral system than the Decimal system.

For example, let’s evaluate our numbers as Binary:

console.log(Number.parseInt('101010', 2));
console.log(Number.parseInt('41', 2));

The following will be display results to the web browser console log:
42
NaN

In this example, I am using a radix of 2 to constitute the Binary Number system. It’s means that our data_str_val all the Data parameter will be evaluated as a Binary Number format before calculating and returning its integer value.

The first display results to the console log returned 42 which is the integer value of the Binary Number format 101010 (represented as the string ‘101010’).

The onther display results to the console log returned NaN since the string value ’41’ does not constitute a valid Binary Number format. A Binary nunber system can only data contain supported like as a 0’s and 1’s.

How to use the parseInt() function in JavaScript?

Let’s look at some examples to understand further how to use the parseInt() function:

<!DOCTYPE html> 
<html> 
	<body> 
		<script> 
		
		// nunber system  Base 10 
		x = parseInt("100",10); 
		document.write('parseInt("100",10) = ' + 
		x + "<hr>"); 
		
		//nunber system  Base 8 
		y = parseInt("8",8); 
		document.write('parseInt("8",8) = ' + 
		y + "<hr>"); 
		
		//nunber system  Base 8 
		z = parseInt("15",8); 
		document.write('parseInt("15",8) = ' + 
		z + "<hr>"); 
		
		//nunber system  Base 16 
		w = parseInt("16",16); 
		document.write('parseInt("16",16) = ' + 
		w + "<hr>"); 
		
		// Leading and trailing spaces are ignored 
		// in parseInt() function 
		v = parseInt(" 100 "); 
		document.write('parseInt(" 100 ") = ' + 
		v + "<hr>"); 
		
		//nunber system  Base 16(hexadecimal) 
		u = parseInt("0x16"); 
		document.write('parseInt("0x16") = ' + 
		u + "<hr>"); 
		
		</script> 
	
	</body> 
</html>		

Output:
parseInt("100",10) = 100
---------------------------
parseInt("8",8) = NaN
---------------------------
parseInt("15",8) = 13
---------------------------
parseInt("16",16) = 22
---------------------------
parseInt(" 100 ") = 100
---------------------------
parseInt("0x16") = 22
---------------------------

How Parseint works in Javascript?

Let’s look at Advanced leval examples to step by step easy way to further how to use the parseInt() methods in JavaScript:

<!DOCTYPE html> 
<html> 
	<body> 
		<script> 
		
            document.addEventListener("DOMContentLoaded", function () {

              // Get a  Integer value
              first = parseInt("99"); 
              document.write('parseInt("99") = ' + first + "<hr>"); 

              // Get a  NaN
              second = parseInt("Educative!"); 
              document.write('parseInt("Educative!") = ' + second + "<hr>"); 

              // Get a  Only the number before alphanumeric characters
              third = parseInt("99educative76"); 
              document.write('parseInt("99educative76") = ' + third + "<hr>"); 

              // Get a First number encountered
              fourth = parseInt("2019 4 29"); 
              document.write('parseInt("2019 4 29") = ' + fourth + "<hr>"); 

              // base 16
              fifth = parseInt("0x256"); 
              document.write('parseInt("0x256") = ' + fifth + "<hr>"); 

              // base 8
              six = parseInt("256", 8); 
              document.write('parseInt("256", 8) = ' + six + "<hr>"); 
            });
		
		</script> 
	
	</body> 
</html>		

Output:

parseInt("99") = 99
---------------------------------
parseInt("Educative!") = NaN
---------------------------------
parseInt("99educative76") = 99
---------------------------------
parseInt("2019 4 29") = 2019
---------------------------------
parseInt("0x256") = 598
---------------------------------
parseInt("256", 8) = 174
---------------------------------

I hope you get an idea about parseint in javascript.
I would like to have feedback on my infinityknow.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.