Simple, beginner steps: RegEx and strings.
Tags: regex, javascript, beginners, webdev
Published: 2022-04-29 15:43:48

I've been working on learning Regex the past couple days. Regular expressions (RegEx) are used in programming languages to match parts of strings. You create patterns to help you do that matching. Here's my beginner crash course:

## Define your Regex

Regex is annotated like: `/someRegExHere/`

So let's say we wanted to find if 'Hello' existed in a string.

```
const someString = "Hello, World!"
let ourRegex = /Hello/
```
We've got our string, and we've defined our Regex. There are multiple ways to use regex, but for now I've been using the Javascript `.test()` method. The test method is going to take our regex and apply it to a string that we pass as an argument. It will return true or false if our defined pattern finds a match, or not.

```
const someString = "Hello, World!"
let ourRegex = /Hello/
let result = ourRegex.text(someString)
```
_Test returns true!_

I've also used `.match()`, which actually extracts the matches found. The syntax is the opposite of `.test()`-- you call .match on the string and pass the regex as the argument.

## Writing regex patterns:

There is A LOT to learn with Regex. Here's a cheatsheet of some I've learned (so far):

- **OR** Looking for multiple possible matches.
`let ourRegex = /Hello|Goodbye/`

- **Ignoring case** Matching different cases (i.e. A, a) The 'i' flag goes outside the //
`let ourRegex = /Hello|Goodbye/i`

- **Finding multiple matches** Matching repeats of your regex. The 'g' (global) flag goes outside the //
`let ourRegex = /Hello/ig`

- **Wildcard** Matches anything. Essentially a 'wildcard' character. This could match things like her, hen, etc
`let ourRegex = /He./i`

- **Character sets** Allow you to define a group of characters we're trying to match, placing them inside square brackets.
`let ourRegex = /b[ae]g/i`
This would match bag and beg, but not big, bug or bog.

- **Character sets with range** You can also define ranges, for letters or numbers.
`let ourRegex = /[a-g]at/i`
`let ourRegex = /[0-9]/g`
Combine them, too as needed:
`let ourRegex = /[0-9a-g]/gi`

- **NON match - negated character sets** Use a carrot to define what you DON'T want to match. This would match everything NOT a number or vowel:
`let ourRegex = /[^0-9aeiou]/gi`

- **Repeating characters** Use a + to match ONE or more repeating instances (consecutively).
`let ourRegex = /s+/gi`

- **Repeating characters** Use a * to match ZERO or more repeating instances (consecutively).
`let ourRegex = /Aa*/gi`

- **Quantity specifiers** Instead of + or * you can specify your own range with {}
`let ourRegex = /Hell\syeah{3,10}/g`
This would match only strings of "Hell yeahhh" with 3-10 h's on the end

Quantity can also only have a lower limit:
`let ourRegex = /Hell\syeah{3,}/g`

- **Start of string** Match something only in the beginning of string. Carrot goes outside of brackets, etc
`let ourRegex = /^April/`
Would match April at the beginning of a string. (aka 'starts with')

- **End of string** Match something only at the end of string. $ at the end
`let ourRegex = /end$/`
Would match if the string ends in 'end'. (aka ends with)

- **Alphabet, number and _ shorthand**  `\w` is equal to `[A-Za-z0-9_]`
`let ourRegex = /\w/`

- **OPPOSITE Alphabet, number and _ shorthand**  `\W` is equal to everything BUT `[A-Za-z0-9_]`
`let ourRegex = /\W/g`

- **Digits** \d is the shorthand equal to [0-9] 
`let ourRegex = /\d/`

- **OPPOSITE Digits** \d is the shorthand equal to everything BUT [0-9] 
`let ourRegex = /\D/g`

- **Whitespace** \s matches whitespace, as well as form feed, new line characters and tab
`let ourRegex = /\s/g`

- **OPPOSITE Whitespace** \s matches everything but whitespace
`let ourRegex = /\S/g`

- **All or none** Check for the possible existence of an element
`let ourRegex = /colou?r/`
This would match 'color' and 'colour'

---

I'll definitely be adding more so keep checking back for the cheatsheet and tips to grow!