JavaScript & jQuery Tutorials

JS Home Right Arrow JS Intermediate Right Arrow More Maths Functions

More Maths Functions

This lesson follows on from JavaScript Intermediate Tutorials - Lesson 5 - Basic Maths Functions and introduces some maths global functions and variables to the party. We take a look at the parseFloat(), parseInt() and IsNaN() global functions and the NaN global property.

Parsing String To Numbers

JavaScipt offers us two top level functions for parsing strings containing integers and decimals to numbers. To pass an integer we use the parseInt global function and to parse a decimal we use the parseFloat() global function.

The parseInt() Function


The parseInt() function takes two parameters in the form of a string to be passed and an optional radix. For clarity it is always a good idea to specify a radix also known as a number base.

Below are some examples of using the parseInt() function.


// Parsing string to integers.
var parsedValues = new Array(6);
parsedValues[0] = parseInt('17' 10); // Decimal base
parsedValues[1] = parseInt('10001', 2); // binary base
parsedValues[2] = parseInt('11', 16); // hex base
parsedValues[3] = parseInt('  17   ', 10); // within spaces
parsedValues[4] = parseInt('17.2345', 10); // decimal
parsedValues[5] = parseInt('abcdef', 10); // invalid
alert(parsedValues);

Press the button below to action the above code:


The parseFloat() Function


The parseFloat() function takes a string and attempts to pass back a float value for the string.

Below are some examples of using the parseFloat() function.


// Parsing string to floats.
var parsedValues = new Array(6);
parsedValues[0] = parseFloat('17'); // integer
parsedValues[1] = parseFloat('17.2345'); // valid 
parsedValues[2] = parseFloat('-17.2345'); // negative 
parsedValues[3] = parseFloat('  17.2345   '); // within spaces
parsedValues[4] = parseFloat('17.2345ignored'); // ignore non decimal suffix
parsedValues[5] = parseFloat('abcdef'); // invalid
alert(parsedValues);

Press the button below to action the above code:


Numeric Validity

The NaN Property.

If you pressed the buttons to process the code above for the parseInt and parseFloat() functions, you may have noticed the last element of each array held the value NaN. This stands for Not-A-Number and is generally returned from functions when a numerical value can't be derived or is unobtainable. The NaN global property is also unique in JavaScript in the fact that you cannot rely on the equality (==) and strict equality (===) comparison operators to find out whether a value is NaN or not.

Below are some examples showing comparisons of NaN and an unobtainable result.


// NaN.
var nanValues = new Array(4);
nanValues[0] = NaN == NaN; // NaN not equal
nanValues[1] = NaN === NaN; // NaN not strict
nanValues[2] = isNaN(NaN); // check against isNaN
nanValues[3] = Number.POSITIVE_INFINITY * 0; // unobtainable 
alert(nanValues);

Press the button below to action the above code:


The IsNaN() Function.

As mentioned above the NaN global property is unique in JavaScript because you cannot rely on the equality (==) and strict equality (===) comparison operators to find out whether a value is NaN or not. For this reason we have the IsNaN() global function which we use to determine whether a value is NaN or not. Care should be taken when using the IsNaN() function as results can be unexpected. For instance the last value below returns true when you would expect it to return false. The parsing of the string returns NaN and isNaN(NaN) will return true. This double positive effect makes IsNaN() unreliable in this situation.

Below are some examples showing usage of the IsNaN() function.


// isNaN.
var isNaNValues = new Array(5);
isNaNValues[0] = isNaN(17); // number so false
isNaNValues[1] = isNaN('17'); // string number so false
isNaNValues[2] = isNaN(17.2345); // float number so false
isNaNValues[3] = isNaN(NaN); // isNaN is NaN so true
*/
 / The next test shows why isNaN is unrelieable.
 / 1) Parsing 'aaa' as a number fails and so NaN is returned
 / 2) As you can see from the example above isNaN(NaN) returns true
 / 3) Therefore parsing a string that cannot be converted to a numeric
 /    gives a double positive and makes isNaN() unreliable in this
 /    situation.
 /*
isNaNValues[4] = isNaN('aaa'); 
alert(isNaNValues);
   

Press the button below to action the above code:



Reviewing The Code

The above maths functions allow us to parse string to numbers and check the validity of numbers. We have also demonstrated that the IsNaN() function is unreliable.

Lesson 6 Complete

In this lesson we looked at the parseFloat(), parseInt() and IsNaN() global functions and the NaN global property.

Related Tutorials

JavaScript Basic Tutorials - Lesson 5 - Basic Maths Functions
JavaScript Advanced Tutorials - Lesson 3 - Number
JavaScript Advanced Tutorials - Lesson 4 - Math

What's Next?

In the next lesson we take a look some more maths functions.

Reference

JavaScript Reference - parseFloat global function
JavaScript Reference - parseInt global function
JavaScript Reference - isNaN global function
JavaScript Reference - NaN global property



  

go to home page Homepage go to top of page Top