Now you’ve learned how to divide a string into many substrings by using the split() method and a string called a delimiter. This is useful when you are sepa-rating a string containing data elements into individual data elements. However, the split() method isn’t of much use to you if you need to copy one substring. For this, you’ll need to use one of two other methods: substring() and substr().
Let’s say, for example, that you built a client contact application that is used by sales representatives to track activities with their corporate clients. This application prompts the sales representative to enter the client’s e-mail address and corporate web site URL. However, the application guesses the corporate web site URL based on the e-mail address and uses it as the default value for the prompt to enter the corporate web site.
Here’s the string that the sales representative entered that contains the e-mail address:
EmailAddress = 'bsmith@xyz.com '
There is a good chance that the www.xyz.com is the corporate web site for this cli-ent. Your job is to copy the substring 'xyz.com' from the e-mail address and then concatenate the substring with 'www.' to form the new string 'www.xyz.com'.
Figure 6-6 Names are copied into elements of an array using the split() method.
ch06.indd 125
ch06.indd 125 5/2/2005 3:51:08 PM5/2/2005 3:51:08 PM
First, we’ll see how this is done using the substring() method. The substring()is a method of a string object that copies a substring from a string based on a beginning and an end position that is passed as an argument to the sub-string() method.
The starting position specifi es the fi rst character that is returned by the sub-string() method—that is, the fi rst character in the substring. The end position specifi es the character that follows the last character that is returned by the sub-string() method—that is, the position of the character that comes after the last character that you want to include in the substring.
This is a little tricky to understand, so take a look at the e-mail address string again:
'bsmith@xyz.com '
The last character in the string is a space. This is the fi fteenth character in the string.
We want the substring 'xyz.com'. (Notice this is without the space.) The end position that we need to pass to the substring() method is 14 (zero-based) because the fi fteenth character is the character that comes after the m—the space.
The m is the last character we want to include in our substring. Here’s how to write the substring() method:
var NewSubstring =
StringName.substring (StartingPosition, EndPosition) The following example illustrates how to create a substring using the sub-string() method. The e-mail address is assigned to a variable. The substring() method then copies the substring 'xyz.com' to the NewSub-string variable, which is concatenated to 'www.' and assigned to the GuessWebSite variable. The GuessWebSite is then used as the default value for the prompt() function, which asks the sales representative to enter the client’s web site URL into the application (Figure 6-7).
Figure 6-7 The substring 'xyz.com' is concatenated to 'www.' to form the client’s web site.
ch06.indd 126
ch06.indd 126 5/2/2005 3:51:08 PM5/2/2005 3:51:08 PM
<!DOCTYPE html PUBLIC
<script language="Javascript" type="text/javascript">
var EmailAddress = 'bsmith@xyz.com '
var NewSubstring = EmailAddress.substring(7,14) var GuessWebSite = 'www.' + NewSubstring
In the real world, you probably won’t know the starting position and end position of characters for your substring, because a user can enter any length string into your application. You can overcome this problem by using the substr() method along with other string object methods that you already learned how to use in this chapter.
The substr() method returns a substring. You must tell it the starting position of the fi rst character that you want to include in the substring and how many characters you want copied into the substring from the starting position. Both positions are passed as arguments to the substr() method.
Here’s how you write the substr() method:
Var NewSubstring = StringName.substr
StartingPosition, NumberOfCharactersToCopy
Again, we’ll take a look at the e-mail address to understand how the substr() method works:
EmailAddress = 'bsmith@xyz.com '
The starting position is 7 since the fi rst character of the substring is x (the eighth character in the string, zero-based index). We want the substr() method to copy seven characters into the substring beginning with character number 7. This results in the substring 'xyz.com'.
ch06.indd 127
ch06.indd 127 5/2/2005 3:51:09 PM5/2/2005 3:51:09 PM
The following examples show how to use substr() to create the client’s web site URL using the e-mail address that is entered into the application. This is similar to the other example; however, we’ll prompt the user to enter the e-mail address rather than hard code the e-mail address into the JavaScript (Figure 6-8). The web site URL is then used as the default value for the prompt() function that retrieves the client’s web site from the sales representative.
<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Using substr()</title>
</head>
<body>
<script language="Javascript" type="text/javascript">
var EmailAddress =
prompt('Enter your clients email address.', ' ') var StartPosition = EmailAddress.indexOf('@') + 1
var NumCharactersToCopy =
EmailAddress.length - StartPosition var NewSubstring =
EmailAddress.substr(StartPosition, NumCharactersToCopy) var GuessWebSite = 'www.' + NewSubstring
var WebSite =
prompt('Enter the client web site.', GuessWebSite ) -->
</script>
</body>
</html>
NOTE
Figure 6-8 Any client e-mail address can be entered and the application will guess the client’s web site URL.
ch06.indd 128
ch06.indd 128 5/2/2005 3:51:09 PM5/2/2005 3:51:09 PM
Take a close look at how we determine the starting position and the end position.
Since we don’t know the e-mail address, we have to calculate the starting position and the end position without it. First, let’s calculate the starting position.
We know that the fi rst character of the substring is the character that follows the @ in the e-mail address. If we know the position of the @ in the e-mail address, we can easily determine the position of the next character. Recall from earlier in this chapter that the indexOf() method of the string object returns the index of the character that is passed as an argument to the indexOf() method.
NOTE
NOTE Remember that a string is an array of characters, and each character is an array element that is identifi ed by an index. Also remember that the fi rst character in the string has an index of 0—not 1. This is an important factor when calculating the starting position of a substring.
We pass the indexOf() method the @ character, as shown here:
EmailAddress.indexOf('@')
This returns the index of the @ character in the e-mail address that the sales representative entered into the application. The indexOf() function returns the zero-based index, which is the character position. Notice in the application script that we added 1 to the index returned by the indexOf() method. This is the posi-tion of the character that will become the fi rst character in the substring—in other words, the character right after the @ character.
Next, we need to tell the substr() method how many characters to copy from the starting position. We must calculate this value by subtracting the starting posi-tion from the length of the string. The length of the string is contained in the length value of the string object:
var NumCharactersToCopy = EmailAddress.length - StartPosition