Regular Expression In JavaScript

Regex basics and most important concepts.

Regular Expression In JavaScript

Hello There, Lets explore Regex in JavaScript.

Introduction

Regex, short for Regular Expression, is a string of text that allows you to create patterns that help match, locate and manage texts.

What is Regex in JavaScript?

Regex or Regular Expression is very useful for finding a pattern in a string or replacing a string with matched pattern. At first, they may seem weird but they are extremely helpful and makes you a better developer.

Regex Syntax

RegExp constructor can be used to define Regex in JavaScript.

var regex = new RegExp("hello");

Or

We can enclose a pattern in forward slash.

var regex = /hello/;

Important Regular Expressions Methods

There are some Regular Expressions Methods that developers always get their hands with, those are

  1. test()
  2. exec()
  3. search()
  4. match()

We will look into each one by one with example.

Let's dive into an example.

test() method.

RegEx object provides many in-built method and one of them is test() method. Suppose, if we want to check whether a specified pattern matches with a given string.

var pattern = /hi/;

var result = pattern.test("hi there");

console.log(result); // true

exec() method.

It return an array of value such as Index, Input and Groups if the pattern successfully matches with the string or its part otherwise it return null.

var pattern = /fun/;

var result = pattern.exec("JavaScript is fun");

console.log(result); // Array

search() method.

It returns the first match index value, if no match is found returns -1.

var pattern = /fun/;

var string  = "JavaScript is fun"

var result = string.search(pattern);

console.log(result); // 14

match() method

It returns an array if matches otherwise returns null.

var pattern = /fun/;

var string = "JavaScript is fun";

var result = string.match(pattern);

console.log(result); // Array

Pattern Flags

Flags changes the searching behaviour of the RegEx and flags are optional.

Let's look at ignore flag

var pattern = /hi/i;

var result = pattern.test("Hi there");

console.log(result); // true

The above code snippet returns true even though the pattern has hi and the test method string has Hi (Capital H).

Regex is basically case sensitive and we used ignore flag denoted by i, when searching for a pattern.

Let's look at global flag

var pattern = /You/g;

var string = "You, You complete me";

var result = string.match(pattern);

console.log(result); // [You, You]

The above code snippet returns an array of two values [You, You], since we used global flag which actually looks for pattern in the entire string.

To know more about Patterns and Flags

Real World Applications

Suppose, you build a app where you have to verify users email address or phone number or something else like this, that's where regex comes in handy. You can't go back once you get used to this.

Conclusion

In this article, we have seen Regex in JavaScript and some of its common methods. Atlast, we have seen two flags that are global and ignore flags. These are the regex concepts that are often widely used by the developers.

Thank you for reading. Have a great day!