Programming Examples

Are you a Programmer or Application Developer or a DBA? Take a cup of coffee, sit back and spend few minutes here :)

JavaScript 004 – parseInt & NaN

1. Number Conversion in JavaScript

In JavaScript, a variable can hold any data type. Sometimes, we need to convert the string representation of a number to an integer or float. For example, data submitted by web form comes in string format, even user entered the data in number format. We can say an age submitted by the user comes as a string. JavaScript, need to convert this as a number. Once data is converted to a number, it can involve in mathematical expressions.

2. Need for Conversion

Now, look at the code snippet below. Here, we ask the user to provide two numbers and collected those in the variables N1 and N2. The values returned by the prompt function is a string and hance we have strings in the variable N1 and N2. For example, let us say the user responded to the first prompt with a value of 10 and for the second prompt with the value of 12. Even though the user responded with numbers, the variables hold these numbers in string format like “10” and “12”.

JavaScript Try to Add Numbers
JavaScript Try to Add Numbers

Next, we added the content of the variables N1 and N2 via the expression N1 + N2. JavaScript thinks it as a String Join and stores the outcome as “1012” in the variable Result.

3. Number Conversion – JavaScript parseInt

To make the above example work the expected way, we need to convert the string representation of number to a number so that we can use it in the arithmetic operation. JavaScript’s parseInt method will perform the conversion. If you want to convert the number into a float, you can use parseFloat. Below picture shows the parseInt syntax:

JavaScript parseInt
JavaScript parseInt

In the above picture you can see N1 passed in is a string form of the number. Second param tells, the converted number should be in base 10 form. If you specify 2 here, the converted number will be in the binary form. Note how the variable N1 is used to store a string and a number. When it is passed as a param, it has number in string format. After the parseInt, the return value, which is a number, is stored in the same variable, N1.

Now look at the below code:

JavaScript Number Conversion Eample
JavaScript Number Conversion via parseInt Eample

Here, we used parseInt method to convert the numbers N1 and N2. Note, the converted numbers stored back in the same variables. Now, the arithmetic operation is performed on two numbers and hence we will get the result 10 + 12 = 22.

4. NaN & parseInt

In JavaScript NaN stands for “Not a Number”. Say, for example, the string “127” is a number. But the string “Hi” is Not A Number (NaN). You can easily check this with a function call isNaN(strParam). The function returns false when the string strParam is a number. Now look at the below code:

JavaScript NaN Example
JavaScript NaN Example

Explanation

  1. We pass the string form of number to the function isNaN. This function returns false when the string is a number.
  2. In the else portion we try the conversion via parseInt, and it will be safe as N1 is really a number. When we pass a string which is not a number, the parseInt function will return NaN.

5. Code Reference

Output of running the code is below:

Browser Output
Browser Output

Categories: JavaScript

Tags: , , ,

Do you like this Example? Please comment about it for others!!

This site uses Akismet to reduce spam. Learn how your comment data is processed.