Regular Expressions
Tags: javascript, beginners
Published: 2020-08-24 02:06:22

Working with strings is one of those things that seems really simple, until you encounter a problem that isn't. Regular expressions are another tool that you can use along with string methods that allow you to be much more specific in your queries! Lets learn how to use regular expressions!

# Regular expressions
A regular expression, also known as a regex or regexp, is simply a pattern that you can use to match a distinct and often specific combination of characters. We can use these patterns to inspect and process strings. For example, the regular expression of /cat/ is equivalent to the exact sequence of "cat" in a string. I know what you're thinking. "How is that useful? Why not just use a string?" We'll get there! Lets talk a bit about how to build a regular expression first. A regular expression is an object that we create using either regular expression literals (//) or invoking the RegExp constructor function using the new keyword. Creating and assigning a regular expression might look something like this:
```javascript
let rat;
rat = /rat/;
rat = new RegExp("rat");
```
Both of the above examples are equivalent ways to create the same regexp. So we've made some regular expressions. What can we do with them? Regular expressions have their own methods available to them, and they can also be used in certain string methods. For example, .test is a method that is available to regular expressions. It returns a boolean of whether the regexp was found in the string or not:
```javascript
let rat = /rat/;
rat.test('I saw a rat!');  // returns true
/rat/.test('I saw a rat!');  // returns true
```
Both of the above patterns of calling .test are equivalent: that is, it can be called with a variable assigned to a regexp, or using the regexp directly. This is true for any use of regular expressions. Its important to note that regular expression matches must be EXACT, including any line breaks, capitalization, and white space. For example:
```javascript
/rat/.test('I saw some rats!');  // returns true
/rat/.test('Meet at the bar at 9');  // returns false
/rat/.test('Rats and cats are not friends');  // returns false
```
But that still doesn't explain why you would use a regular expression. You could accomplish the same thing with existing string methods and regular strings, right? That's where special characters come in!

# Special characters
Special characters are characters that modify or specify the character combination of a regexp. These are where regular expressions get their super powers from! One of the most useful special characters are brackets. Brackets allow you to denote that a character in your target string can be any number of characters! Lets see them in action:
```javascript
const bt = /b[aeiou]t/;
bt.test('bat');  // returns true
bt.test('bet');  // returns true
bt.test('bit');  // returns true
bt.test('bot');  // returns true
bt.test('but');  // returns true
bt.test('bpt');  // returns false
```
Think of everything in the brackets corresponding to a single character in the string you're searching. On top of this useful ability, we can designate a specific range of characters using the "-" character! 
```javascript
const nums = /[0-5]/;
nums.test('0');  //  returns true
nums.test('3');  //  returns true
nums.test('7');  //  returns false
```
This method uses a characters Unicode number, so be careful when using this approach with alphabetical characters, as there is a small gap between lowercase and uppercase characters that contains several characters you might not be interested in. To designate all letters, you would do something like:
```javascript
const letters = /[A-Za-z]/;
letters.test('M');  // returns true
letters.test('y');  // returns true
letters.test('5');  // returns false
```
Another special character to keep in mind is the '+' character. This indicates that a specific element may be repeated any number of times. Lets see it in action:
```javascript
const bomb = /boo+m/;  
bomb.test('boom!');  // returns true
bomb.test('Boom!');  // returns false
bomb.test('boooooooooooom!');  // returns true
```
Now lets combine the above code with an option. Options follow your regular expression and allow you to further tweak your search pattern. We'll throw an "i" after our last regexp literal to denote that we're not worried about case.
```javascript
const bomb = /boo+m/i;  
bomb.test('boom!');  // returns true
bomb.test('Boom!');  // returns true
bomb.test('boooooooooooom!');  // returns true
bomb.test('BOOOOOOOOOOOOM!');  // returns true
```
The "?" character is also a useful special character. This character denotes that the preceding character may or may not be included. 
```javascript
const color = /colou?r/; 
color.test('color');  // returns true
color.test('colour');  // returns true
```
The last special character I want to talk about is the "." character. This is the wildcard character. A "." can mean any other character, excluding newline. 
```javascript
const anything = /./; 
anything.test('a');  // returns true
anything.test('1');  // returns true
anything.test('[');  // returns true
```
# Shortcuts
There are also several build-in shortcuts that can be used to similarly to the "[-]" combination. The "\d" shortcut can be used to denote any digit. Similarly, the "\D" shortcut refers to any character that is NOT a digit.
```javascript
const digit = /\d/;  
digit.test('a');  // returns false
digit.test('1');  // returns true
digit.test('&');  // returns false

const notDigit = /\D/;  
notDigit.test('a');  // returns true
notDigit.test('1');  // returns false
notDigit.test('&');  // returns true
```
The "\w" character refers to any alphanumeric character. Its opposite, "\W", refers to any nonalphanumeric character.
```javascript
const alphaNumber = /\w/;  
alphaNumber.test('a');  // returns true
alphaNumber.test('1');  // returns true
alphaNumber.test('&');  // returns false

const notAlphaNumber = /\W/; 
notAlphaNumber.test('a');  // returns false
notAlphaNumber.test('1');  // returns false
notAlphaNumber.test('&');  // returns true
```
Similarly, the "\s" character refers to any whitespace character, while the "\S" character refers to any nonwhitespace character.
```javascript
const whitespace = /\s/;  
whitespace.test('a');  // returns false
whitespace.test('1');  // returns false
whitespace.test('&');  // returns false
whitespace.test(' ');  // returns true
whitespace.test('\n');  // returns true

const notWhitespace = /\S/; 
notWhitespace.test('a');  // returns true
notWhitespace.test('1');  // returns true
notWhitespace.test('&');  // returns true
notWhitespace.test(' ');  // returns false
notWhitespace.test('\n');  // returns false
```
# Conclusion
By no means has this been a complete discussion of regular expressions. But I have hopefully conveyed how they can be more useful than using a string and string methods. You can use special characters and containers, such as brackets, to make your searches much more specific. Next time, I'll go over how to use these regular expressions with string methods to supercharge your code!