Welcome to Bucaro TecHelp!

Bucaro TecHelp
HTTPS Encryption not required because no account numbers or
personal information is ever requested or accepted by this site

About Bucaro TecHelp About BTH User Agreement User Agreement Privacy Policy Privacy Site Map Site Map Contact Bucaro TecHelp Contact RSS News Feeds News Feeds

Debugging JavaScript : Coercions

JavaScript is not a tightly typed language, meaning that you can give it a value without telling it the data type, and it will give it a type to the best of its ability. Sometimes this comes in handy, but other times it can cause problems. One example is when a user enters numerical data in a form. JavaScript returns form entries as strings.

What happens if a user enters the number 3 into a form, and you immediately add 2 to that value, as shown below.

var x = 2 + "3";

You would expect a result of 5, but instead you would get a result of "23". This is because the + operator is overloaded to do string concatenation or addition, depending on its argument types, and it chooses concatenation over addition.

var x = 2 + "3";
alert(typeof x);

The JavaScript typeof operator returns the data type of its operand. In the code shown above, typeof would return "string", which might be a surprise if you were expecting a numerical result. Shown below is a list of possible values returned by the typeof operator.

Argument TypeReturn Value
not defined"undefined"

What happens if you multiply the string by the integer 3, as shown below?

var x ="17" * 3;

You would get a result of 51, which is what you would expect from a purely mathematical calculation. So it seems coercion is not consistent. One solution is to always pass the variable to a Number object before using it in a mathematical operation.

var x = Number(2) + Number("3");

However, the Number object always returns a double-precision floating point number and such a number may have an error based upon the word size of the computer's processor. for example, the following operation should return the value 5.3, but instead returns 5.300000000000001. You can solve that problem using the Number object's toFixed method, as shown below.

var x = Number(2.1) + Number("3.2");

The toFixed method keeps the specified number of digits to the right of the decimal point. However, be aware that it returns a string value.

Generally it would be a good idea, especially if a number is entered from user input, to first check if its a legitimate number. For this you can use the JavaScript isNaN function, which returns true if the value is "not a number". However, isNaN is unreliable because its true operation is to test whether a value cannot be coerced to a number. If a non-numeric value can be coerced to a number, it returns false indicating it is a valid number.

Values returned by isNaN by various argument types:

Argument TypeReturn Value

Note that last one isNaN("") which is confusing because the empty string is converted to 0 which is not NaN. In case you need a refresher, below is a chart of the JavaScript primitive data types.

NullA variable has not been assigned a value, not even zero
UndefinedThe absence of the object or variable itself
NumberAll numbers, such as 0 and 3.14 and infinity
BooleanThe values true and false
StringAll strings, such as "foo" and ""

More Java Script Code:
• Display a Value in Currency Format
• JavaScript Code for Binary to Decimal - Decimal to Binary Conversion
• Create Your Own Database Using Only Notepad : CDV
• Basic State Machines
• Play Music on Your HTML5 Web Page
• Using the Java Script Array Object
• Regular Expression Basics : How many Matches?
• Java Script to Get Selected Item from Drop-down Select List
• Regular Expression Position Matching
• JavaScript Code to Add or Remove Specific Elements of an Array

RSS Feed RSS Feed

Follow Stephen Bucaro Follow @Stephen Bucaro

Fire HD
[Site User Agreement] [Privacy Policy] [Site map] [Search This Site] [Contact Form]
Copyright©2001-2021 Bucaro TecHelp 13771 N Fountain Hills Blvd Suite 114-248 Fountain Hills, AZ 85268