JavaScript RegExp
A Regular Expression is a sequence of characters that forms a search pattern.
Regular Expressions
A Regular Expression is a sequence of characters that forms a search pattern.
Regex is a common shorthand for a regular expression.
JavaScript RegExp is an Object for handling Regular Expressions.
RegExp are be used for:
- Text searching
- Text replacing
- Text validation
Example
Example Code
javascriptlet text = "Visit EA Academy";
let n = text.search(/EA Academy/i);Example explained:
/EA Academy/i is a regular expression.
EA Academy is a pattern (to be used in a search).
i is a modifier (modifies the search to be case-insensitive).
Regular Expression Syntax
/pattern/modifier flags
Using String Methods
Regular expressions are often used with the string methods:
| Method | Description |
|---|---|
| match(regex) | Returns an Array of results |
| replace(regex) | Returns a new String |
| search(regex) | Returns the index of the first match |
Using String match()
Example
Example Code
javascriptlet text = "Visit EA Academy";
let n = text.match(/EA Academy/);Using String replace()
Example
Example Code
javascriptlet text = "Visit Microsoft!";
let result = text.replace(/Microsoft/i, "EA Academy");Using String search()
Example
Example Code
javascriptlet text = "Visit EA Academy";
let n = text.search(/EA Academy/);RexExp Alternation (OR)
In a regular expression an alternation is denoted with a vertical line character |.
An alternation matches any of the alternatives separated with |.
Example
Example Code
javascriptlet text = "Black, white, red, green, blue, yellow.";
let result = text.match(/red|green|blue/g);JavaScript Regex Flags
Example
Example Code
javascript/pattern/flagsRegular expression flags are parameters that can modify how a pattern is used, such as making it case-insensitive or global.
These are the most common:
| Flag | Description |
|---|---|
| /g | Performs a global match (find all) |
| /i | Performs case-insensitive matching |
| /u | Enables Unicode support (new 2015) |
The /g Flag (Global)
The /g flag matches all occurrences of the pattern, rather than just the first one.
Example
Example Code
javascriptlet text = "Is this all there is?";
const pattern = /is/g;
let result = text.match(pattern);The /i Flag (Insensitive)
The /i flag makes a match case-insensitive: /abc/i matches "abc", "AbC", "ABC".
Example
Example Code
javascriptlet text = "Visit EA Academy";
const pattern = /EA Academy/i;
let result = text.match(pattern);RexExp Metacharacters
Example
Example Code
javascript// Match words
const pattern = /\w/;Metacharacters are characters with a special meaning.
They can be used to match digits, words, spaces, and more.
These are the most common:
| Meta | Description |
|---|---|
| \d | Matches Digits |
| \w | Matches Words |
| \s | Matches Spaces |
RegExp \d (digits) Metacharacter
The \d metacharacter matches digits.
Example
Example Code
javascriptlet text = "Give 100%!";
const pattern = /\d/g;
let result = text.match(pattern);RegExp \w (word) Metacharacter
The \w metacharacter matches word characters.
A word character is a character a-z, A-Z, 0-9, including _ (underscore).
Example
Example Code
javascriptlet text = "Give 100%!";
const pattern = /\w/g;
let result = text.match(pattern);JavaScript RegExp Quantifiers
Quantifiers define the numbers of characters or expressions to match.
Example
Example Code
javascriptconst pattern = /lo+/;The + means "one or more". The pattern matches:
- lo
- loo
- looo
These are the most common quantifiers:
| Quantifier | Description |
|---|---|
| x+ | Matches any string with at least one occurrences of x |
| x* | Matches any string with zero or more occurrences of x |
| x? | Matches any string with zero or one occurrences of x |
The ? Quantifier
x? matches zero or one occurrences of x.
Example
Example Code
javascriptlet text = "1, 100 or 1000?";
const pattern = /10?/g;
let result = text.match(pattern);Regular Expression Assertions
Example
Example Code
javascript// Match beginning of string
const pattern = /^EA Academy/;
// Match end of string
const pattern = /EA Academy$/;Assertions matches Boundaries and Lookarounds:
String Boundaries and Word Boundaries.
Lookarounds: Lookaheads and Lookbehinds.
These are the most common:
| Syntax | Name | Description |
|---|---|---|
| ^ | String boundary | Matches the beginning of a string |
| $ | String boundary | Matches the end of a string |
| \b | Word boundary | Matches the beginning or end of a word |
| (?=...) | Lookahead | Matches the subsequent string |
| (?
RegExp ^ Metacharacter
The ^ metacharacter matches the beginning of a string.
Examples
Example Code
javascriptconst pattern = /^EA Academy/;
let text = "EA Academy Tutorial";
let result = pattern.test(text); // trueRegExp $ Metacharacter
The $ metacharacter matches the end of a string.
Example
Example Code
javascriptconst pattern = /EA Academy$/;
let text = "Hello EA Academy";
let result = pattern.test(text); // trueJavaScript RegExp Character Classes
Example
Example Code
javascript// Match Digits
const pattern = /[0-9]/;Character Classes are characters enclosed in square brackets [].
A character class matches any character from a set within brackets.
These are the most common:
| Class | Description |
|---|---|
| [a] | Matches the character between the brackets |
| [abc] | Matches all characters between the brackets |
| [a-z] | Matches all characters in the range from a to z |
| [0-9] | Matches all characters in the range from 0 to 9 |
Example [0-9]
Example Code
javascriptlet text = "More than 1000 times";
const pattern = /[0-9]/g;
let result = text.match(pattern);Interactive Code Examples
JS Example 1
javascriptlet text = "Visit EA Academy";
let n = text.search(/ea-academy/i);Example 2
javascriptlet text = "Visit EA Academy";
let n = text.match(/EA Academy/);Example 3
javascriptlet text = "Visit Microsoft!";
let result = text.replace(/Microsoft/i, "EA Academy");Example 4
javascriptlet text = "Visit EA Academy";
let n = text.search(/EA Academy/);JS Example 5
javascriptlet text = "Black, white, red, green, blue, yellow.";
let result = text.match(/red|green|blue/g);