JavaScript Articles: Smart Substring Searching

JavaScript Articles

Smart Substring Searching

I recently broke down and gave the chapter on Regular Expressions in David Flanagan's JavaScript: The Definitive Guide, a thorough read. It was more out of necessity than anything else. JavaScript has horrible string handling features. You need to know Regular Expressions if you're going to do anything substantial with JavaScript. After working with Regular Expressions for a little while, I started to wonder why I — or anyone else was using the God-awful indexOf() method of the String class in order to locate substrings when in many cases there was a more elegant solution.

Below is source code which shows common usage of the indexOf() method.

ie = navigator.appName.indexOf("Microsoft") != -1

If the browser's appName string has the word "Microsoft" in it, the variable ie is assigned a Boolean value of true, otherwise it is assigned false.

What's wrong with indexOf()?

indexOf() is awkward as hell for matching substrings. As in the example above, you're not interested in the actual index of the substring, you just want to know whether or not the substring exists in the string. What you want is a nice clean Boolean result not this jarring != -1 stuff. This kind of stuff makes your code less readable.

Okay, so what should I do instead?

I'd say, use the test() method of the RegExp class if you just need to know whether or not a substring exists in a string. The code below accomplishes the same thing as the code above.

ie = /Microsoft/.test(navigator.appName)

This code may seem strange and awkward at first, but once you get used to it, you will see that it makes your code much clearer as well as smaller.

More fun with Regular Expressions

If you're just interested in knowing whether a substring appeared at the end of a string, instead of using the lastIndexOf() method of the String class, you can include the $ Regular Expression anchor element at the end of your Regular Expression pattern. The $ anchor element causes the Regular Expression pattern to match against the end of the target string.

For example, variable result1 in the following example is assigned the value of true because the word "Ishmael" appears at the end of the string. Variable result2 is assigned a value of false because "Ishmael" doesn't appear at the end of the string.

result1 = /Ishmael$/.test("Call me Ishmael");
result2 = /Ishmael$/.test("Call me Ishmael. Some years ago");

If you want to know if a substring appeared at the beginning a string, you can use the ^ Regular Expression anchor element in the beginning of your Regular Expression pattern. The ^ anchor element causes the Regular Expression pattern to match against the beginning of the target string.

In the following example, variable result1 is assigned the value of true because the word "Birds" appears at the beginning of the string. Variable result2 is assigned the value of false because "Birds" doesn't appear at the beginning of the string.

result1 = /^Birds/.test("Birds fly");
result2 = /^Birds/.test("Big Birds fly");

Summary

In this article I've given you trivial examples of what you can do with Regular Expressions. Regular Expressions are very powerful and can do a lot more. I urge JavaScript programmers that aren't familiar with Regular Expressions to learn about them. In many cases, Regular Expressions take the drudgery out of dealing with JavaScript strings. I recommend that you read Flanagan's chapter about them, which is listed in the References section below.

References

"ECMAScript Language Specification" , Standard ECMA-262, 3rd Edition - December 1999. (Section 15.5.4.10)

"JavaScript: The Definitive Guide, Fourth Edition" by David Flanagan. Published by O'REILLY®. ISBN: 0-596-0048-0 (Chapter 10: Pattern Matching with Regular Expressions)

Written by: Moshe Moskowitz