What is Regex?
Regex is a shortened term for Regular Expression. Regex patterns are used to find, replace or search for text. These patterns may be difficult to read sometimes because they are composed of simple characters such as /code/
or a combination of simple and special characters, such as /code*s/
or /Number (\d+)\.\d*/
.
Creating a regular expression in Javascript
You can create it with the RegExp
object
const regexp = new RegExp('pattern', 'flag(s)');
or using the literal method
const regexp = /pattern/flag(s);
When can you use Regex?
Regex can be used to perform the following actions:
- user input validation, e.g. password checker, email validation
- finding a specific text from a large glob of text
- searching for things that match a given pattern
- transforming a text from one format to another
Regex Methods in Javascript
- regexp.test(str)
method:
The test method allows you to search for a match between a regex and a string. It returns a boolean, true
or false
const str = 'Hello World';
const regexp = /World/;
console.log(regexp.test(str)); // true
- regexp.exec(str)
method:
While the test()
method allows you to search if a pattern exists within a string, the exec()
method will enable you to retrieve the actual match from the string.
const str = 'Hello World';
const regexp = /l/;
console.log(regexp.exec(str));
This would only return the first match.
[ 'l', index: 2, input: 'Hello World', groups: undefined ]
Searching with flags
Flags | Description |
---|---|
i | this flag allows all the search to be case-insensitive. |
g | this performs a global search for all matches; only the first match would be retrieved if not used. |
m | this allows multi-line search |
s | this allows a . to match a newline character \n . |
u | this allows you to use Unicode-related features. |
y | this performs a "sticky" search that matches starting at the current position in the target string |
An example:
Using the previous example, 'Hello World'
would return true
, but 'Hello world'
would return false
because of the case sensitivity of Regex. You can fix this with the i
flag so that /World/i would return true for both strings.
const str = 'Hello World';
const str2 = 'Hello world';
const regexp = /World/i;
console.log(regexp.test(str)); // true
console.log(regexp.test(str2)); // true
Special characters
^ : matches the starting position within the string
const regexp = /^hi/;
console.log(regexp.test('hi')); // true
console.log(regexp.test('hello')); // false
$: matches the end position within the string
const regexp = /bye$/;
console.log(regexp.test('goodbye'));// true
console.log(regexp.test('welcome'));// false
| :or
operator. matches previous character or
next character
const regexp = /(hi|hello) world/;
console.log(regexp.test('hi world'));// true
console.log(regexp.test('hello world'));// true
console.log(regexp.test('bye world'));// false
+ : matches the previous element one or more times
const regexp = /groo+t/;
console.log(regexp.test('groot'));// true
console.log(regexp.test('grooooot'));// true
console.log(regexp.test('grot'));// false
* : matches the previous element zero, one or more times
const regexp = /groo*t/;
console.log(regexp.test('groot'));// true
console.log(regexp.test('grooooot'));// true
console.log(regexp.test('grot'));// true
?: matches the previous element zero or one time
const regexp = /groo?t/;
console.log(regexp.test('groot'));// true
console.log(regexp.test('grooooot'));// false
console.log(regexp.test('grot'));// true
. : matches any single character
const regexp = /gr.t/;
console.log(regexp.test('grit'));// true
console.log(regexp.test('grot'));// true
[]: matches a range of characters
const regexp = /[cb]at/;
console.log(regexp.test('cat'));// true
console.log(regexp.test('bat'));// true
console.log(regexp.test('sat'));// false
{ x,y }: matches a specified number of occurrences of x up to y
const regexp = /gro{2,4}t/;
console.log(regexp.test('groooot'));// true
console.log(regexp.test('grot'));// false
console.log(regexp.test('groot'));// true
\ : used to escape a special character
(): groups characters
Resources:
Top comments (0)