escape & unescape

JavaScript provides us with some built-in functions that deal with strings, such as escape and unescape. Before we can present these functions, we must discuss the ISO Latin-1 character set. The ISO Latin-1 (8859-1) is the standard set of characters used over the Internet. This standard also serves as the basis for the ANSI character set of MS-Windows, but, naturally, Microsoft extended and improved the set. However, only the ISO Latin-1 characters are guaranteed to be supported on a Web site. You already know the standard coding scheme of the ISO Latin-1 character set through HTML, which enables you to display a character by its number or name, as an entity. For example, the character © can be displayed on a page via two different expressions:

• ©
• ©

The first expression is based on the character code in the ISO Latin-1 character set. The second method is based on the name given to the character. With only a few exceptions, almost all platforms are compatible with the glyphs of ISO Latin-1 (ISO-8859-1). If you are interested in character sets, or ISO-8859-1, search the Web for more information. The ISO-8859-1 character table can be found at the end of the book.

Now back to JavaScript. The escape function returns the ASCII encoding of an argument in the ISO Latin-1 character set. The general syntax is:

escape(string)

Like all methods, you can pass it a variable, a property of an existing object, or a plain string literal. The escape() function is not a method associated with any object, but is a part of the language itself. The value returned by the escape function is the string argument, where all nonalphanumeric characters are replaced by a string in the form of “%xx”, xx being the ASCII encoding of a character in the argument.

The unescape() function is responsible for the opposite conversion. That is, it converts the string from nonalphanumeric ASCII encoding to ISO Latin-1 characters. Its syntax is similar:

unescape(string)

The following example demonstrates the conversion in both directions:

var str1 = "My phone # is 123-456-7890"
var str2 = escape(str1)
var str3 = unescape(str2)
document.write("After escape: " + str2 + "<BR>")
document.write("After unescape: " + str3)

The script’s output is self-explanatory:

After escape: My%20phone%20%23%20is%20123-456-7890

After unescape: My phone # is 123-456-7890

Number-to-String Conversion

Occasionally, you need to convert a number to a string. For example, if you want to compute the number of digits in a number, you can convert it to a string and use the length property, which applies to strings only. In this section we shall take a look at a few ways to convert a number into a string.

Empty String Concatenation

The most obvious way to convert a number to a string is by concatenating an empty string to the number. Here is an example of such conversion:

var num = 987
num += ""

You can also make sure that the value of the variable is a string using the typeof operator in the following way:

var num = 987
document.write("num is a " + typeof num + "<BR>")
num += ""
document.write("num is a " + typeof num)

The expected output of this script segment is:

num is a number

num is a string

You can also convert the number to a string and assign the numeric string to another variable, or, even better, do both operations in one statement:

var num = 987
var numericString = num + ""

This script results in two different variables; the first holds a pure numeric value whereas the second one, numericString, holds a string type. The side of the variable to which the empty string is concatenated has no importance:

var num = 987
var numericString = "" + num

If you concatenate several different literals, where some are numbers and other are strings, the expression evaluates to a string. Here is an example:

var str = 99 + " bottles of beer on the wall"

However, scripts become tricky when you concatenate more than two values or literals, especially when the first few are numbers. Here is a tricky expression:

var str = 50 + 49 + " bottles of beer on the wall"

JavaScript evaluates from left to right. The accumulated value is converted to a string only when a string value or literal is encountered in the expression. In the preceding example, JavaScript adds 49 to 50 in the regular mathematical way, so 50 + 49 evaluates to 99, which is then concatenated to the following string. So the value of str in this case is “99 bottles of beer on the wall.” The following statement demonstrates a slightly different situation:

var str = "bottles of beer on the wall -- " + 50 + 49

Like always, evaluation is done from left to right. The string, bottles of beer on the wall -- , is concatenated with 50 and evaluates to bottles of beer on the wall -- 50. This value in turn is concatenated with the number 49, and evaluates to bottles of beer on the wall -- 5049, which is certainly not the value we want. A simple workaround is to enclose the numeric operation in parentheses in the following form:

var str = "bottles of beer on the wall -- " + (50 + 49)

The parentheses instruct JavaScript to evaluate the enclosed expression first, so the value of str in this case is bottles of beer on the wall -- 99.

String Instance Construction

Another way to convert a number to a string is by providing the number to the String() constructor function, which returns a regular String object. Here is a simple example to demonstrate this:

var num = 987
num = new String(num)

The data type of the variable num in this case is not a string, but an object. As mentioned earlier, strings created via the String() constructor are regular objects. However, you can still use any property or method associated with strings on such objects.

A more obvious way to convert a number to a string via the constructor function is to assign the new string, or object, to a new variable in the following form:

var num = 987
var numericString = new String(num)

The toString() Method

The toString() method belongs to all objects. Its general syntax is:

objectName.toString([radix])