Page 3 —
Substring
The substring is just like charAt
except it can grab entire substrings
from a word, not just letters. Here's
the format:
var the_substring = the_string.substring(from, to);
"From" refers to
the position of the first character of the substring,
and "to" is,
strangely enough, one greater than the last position
of the substring.
Using this weird method to mark the beginning
and end of the substring
makes it so that "to" minus "from"
gives you the length of the
substring:
var the_string = "monkey";
var clergy = the_string.substring(0,4);
var tool = the_string.substring(3,6);
After this batch
of code runs, "clergy" will equal "monk"; "tool"
will equal
"key."
The substring is often used with indexOf to
break apart strings. For example, you could pull out the domain name of a
given URL:
var the_url = prompt("What's the URL?","");
var lead_slashes = the_url.indexOf("//");
var domain_start = lead_slashes + 2;
var without_resource = the_url.substring(domain_start, the_url.length);
var next_slash = without_resource.indexOf("/");
var domain = without_resource.substring(0, next_slash);
Which means if you enter
"http://www.aleeanne.org.uk/javascript/index.html,"
the domain will equal
"www.aleeanne.org.uk." Try the
domain
grabber to see it work.
If this code seems like kind of a drag to you,
don't worry. After I break it down line by line, I'll show you how to make
things much simpler using the split method. First, however, the
analysis.
The basic tactic we're using here is to isolate
everything between the first
double slash and the next slash. Here's how
we do it:
var the_url = prompt("What's the
URL?","");
This just asks the user for a URL. Let's say they
enter "http://www.aleeanne.org.uk/javascript/index.html."
var lead_slashes = the_url.indexOf("//");
This locates the first two
slashes. In the case of our example URL, lead_slashes equals "5"
because the
two slashes start at position five.
What's that? You
wonder, "if the string is a URL, it always starts with http://, so
why don't we just assume, oh so cleverly, that the two slashes start at
position five instead of messing around with indexOf?"
The thing is,
you never know what people will do at the prompt. They might enter
"the URL I want is http://www.blah.com/."
Or they might accidentally put a
space before the URL. Or maybe they enter a
URL that's on a secure
server, making it something like
"https://www.whatever.com/."
One
of the hardest things about
programming is anticipating all possible cases
and then coming up with a way to handle them. Ask people to drop
information into an open text field, and you never quite know what you'll
get. So we can't just assume that the two
slashes are at positions five and
six. Instead, we need to use the indexOf method to determine exactly
where the two slashes start.
var domain_start = lead_slashes
+ 2;
This calculates the location of the first letter of the
domain.
Because there are two slashes, the first letter of the domain will
be
two positions over from the slashes.
var without_resource = the_url.substring(domain_start, the_string.length);
This grabs everything from the beginning of
the domain
name (which we determined in the previous line of code) and the
end of the string. So, using the current example,
without_resource
is
"www.aleeanne.org.uk/javascript/index.html."
var next_slash
= without_resource.indexOf("/");
This figures out the position of
the next slash in the string.
Everything between the beginning of the
string and this slash is domain name. In this case, the next slash is
in position seventeen.
var domain = without_resource.substring(0,
next_slash);
This final step grabs everything from the beginning
of the string to the position of the next slash. In the current
case,
that makes domain equal to "www.aleeanne.org.uk."
And
there you have it. Yes, it's a pain. If it makes you feel any
better,
string handling is a pain in almost all languages. JavaScript 1.2,
which
was introduced with Netscape 4.0, takes some strides toward making
string
handling easier. But it's still a pain.
The whole process can be
handled quite a bit more easily with the split method.
