Conversions - Java Script

One of the most important features of any programming language is the capability to convert between types, and ECMAScript provides developers with a number of easy conversion routines. Most types contain methods that provide for simple conversion, and several global methods are available for more complex conversion. In either case, type conversion is a short,one-step process in ECMAScript.

Converting to a string

The interesting thing about ECMAScript primitive values for Booleans, numbers,and strings is that they are pseudo-objects, meaning that they actually have properties and methods. For example, to get the length of a string,you can do the following:

Even though the value “blue” is a primitive string,it still has a length property holding the size of the string. To that end, the three main primitive values,Booleans, numbers, and strings, all have a toString() method to convert their value to a string.

The Boolean toString() method simply outputs the string “true” or “false”,depending on the value of the variable:

The Number toString() method is unique in that it has two modes: default and radix mode. In default mode,the toString() method simply outputs the numeric value in an appropriate string (whether that is integer, floating point, or e-notation),like this:

When you use the Number’s toString() method in radix mode, it is possible to output the number using a different base, such as 2 for binary, 8 for octal, or 16 for hexadecimal. The radix is just a fancy name for the base to convert to, and it is specified as an argument to the toString() method:

In the previous example, the number 10 is output in three different ways: binary, octal, and hexadecimal.This functionality can be very useful for dealing with numbers in HTML,which use hexadecimal representations for each color.

Converting to a number

ECMAScript provides two methods for converting non-number primitives into numbers: parseInt() and parseFloat().As you may have guessed, the former converts a value into an integer whereas the latter converts a value into a floating-point number.These methods only work properly when called on strings; all other types return NaN.

Both parseInt() and parseFloat() look at a string carefully before deciding what its numeric value should be. The parseInt() method starts with the character in position 0 and determines if this is a valid number; if it isn’t, the method returns NaN and doesn’t continue. If, however, the number is valid, the method goes on to the character in position 1 and does the same test. This process continues until a character isn’t a valid number, at which point parseInt() takes the string (up to that point) and converts it into a number. For example, if you want to convert the string “1234blue” to an integer, parseInt() would return a value of 1234 because it stops processing one it reaches the character b. Any number literal contained in a string is also converted correctly, so the string “0xA” is properly converted into the number 10. However, the string “22.5” will be converted to 22, because the decimal point is an invalid character for an integer. Some examples:

The parseInt() method also has a radix mode,allowing you to convert strings in binary, octal,hexadecimal, or any other base into an integer. The radix is specified as a second argument to parseInt(),so a call to parse a hexadecimal value looks like this: var iNum1 = parseInt(“AF”, 16); //returns 175

Of course, this can also be done for binary, octal, and even decimal (which is the default mode):

If decimal numbers contain a leading zero,it’s always best to specify the radix as 10 so that you won’t accidentally end up with an octal value.For example:

In this code, both lines are parsing the string “010” into a number.The first line thinks that the string is an octal value and parses it the same way as the second line (which specifies the radix as 8).The last line specifies a radix of 10, so iNum3 ends up equal to 10.

The parseFloat() method works in a similar way to parseInt(),looking at each character starting in position 0.It also continues until the first invalid character and then converts the string it has seen up to that point. For this method, however, the decimal point is a valid character the first time it appears. If two decimal points are present, the second is considered invalid and the parseFloat() method converts the string up until that position. This means that the string “22.34.5” will be parsed into 22.34.

Another difference when using parseFloat() is that the string must represent a floating-point number in decimal form, not octal or hexadecimal.This method ignores leading zeros, so the octal number 0908 will be parsed into 908, and the hexadecimal number 0xA will return NaN because x isn’t a valid character for a floating-point number.There is also no radix mode for parseFloat().

Some examples of using parseFloat():

Type Casting

It’s also possible to convert values using a process called type casting. Type casting allows you to access a specific value as if it were of a different type. Three type casts are available in ECMAScript:

  • Boolean(value) – casts the given value as a Boolean
  • Number(value) – casts the given value as a number (either integer or floating-point)
  • String(value) – casts the given value a string

Casting a value using one of these three functions creates a new value that is a direct conversion of the original. This can lead to some unexpected results.

The Boolean() type cast returns true when the value is a string with at least one character, a number other than 0, or an object (discussed in the next section); it returns false when the value is an empty string, the number 0, undefined, or null. The following code snippet can be used to test type casting as a Boolean:

The Number() type cast works in a manner similar to parseInt() and parseFloat(),except that it converts the entire value, not just part of it.Remember that parseInt() and parseFloat() only convert up to the first invalid character (in strings), so “4.5.6” becomes “4.5”.Using the Number() type cast, “4.5.6” becomes NaN because the entire string value cannot be converted into a number. If a string value can be converted entirely, Number() decides whether to use parseInt() or parseFloat(). The following table illustrates what happens when Number() is used on various values:

what happens when Number() is used on various values

The last type cast, String(),is the simplest because it can accurately convert any value to a string value.To execute the type cast, it simply calls the toString() method of the value that was passed in, which converts 1 to “1”, true to “true”, false to “false”, and so on. The only difference between type casting as a string and using toString() is that the type cast can produce a string for a null or undefined value without error:

Type casting is very helpful when dealing with the loosely typed nature of ECMAScript, although you should ensure that only proper values are used.

All rights reserved © 2020 Wisdom IT Services India Pvt. Ltd Protection Status

Java Script Topics