Regular Expressions Introduction with JavaScript.

Regular Expressions Introduction with JavaScript.

Don Daniel's photo
Don Daniel
·

4 min read

Table of contents

Regular expressions are string patterns used to match a pattern in a string or a sub set off a set of characters in a string.

RegExp Methods

  1. exec(): This method is an instance method for regular expressions. It’s where you pass in the string you want to check against an expression and it returns a results array or null.
  2. test(): This method is an instance method for RegEx that runs a regular expression match test and returns true or false.

String Methods That Work With RegEx

  1. match(): This returns an array of matching results after matching a string against a regular expression.
  2. matchAll(): This returns an array of matching results after matching a string against a regular expression including capturing groups.
  3. replace(): This method returns the result of a string replace against a regex pattern. This method replaces the first occurrence of the pattern.
  4. replaceAll(): This method returns the result of a string replace against a regex pattern. This method replaces all occurrences of the pattern.
  5. search(): This method returns the index of a search result of a string against a regex
  6. slit(): This string method returns an array of string that has been split against an expression’s match.

Create a regular expression

You can create a regular expression using a regular expressions literal 

const expression = /rat/;

Or with the regular expression constructor. 

const expression = new RegExp('rat');

Although using the regular expression literal is best because it provides compilation during the script’s load time while using the constructor provides runtime compilation.

Basic Regex Rules

  1. ^: Represents the start of a string
  2. \d: Represents the presence of a digit
  3. [xyz]: Represents the presence of any set of characters within the square brackets in the exact sequence it is written in the RegEx.
  4. [^xyz]: Represents the presence of any string asides the set of characters within the square brackets in the exact sequence it is written in the RegEx.
  5. [^1-5]: Represents the presence of any digit not within the square brackets
  6. (x|y): Represents the presence of either of the expressions on both sides of the pipe.

RegEx Options

  1. i - Specifies a need for case-insensitive matching
  2. g - Specifies a need for global matching which means to continue searching even after finding first match
  3. m - Specifies a need for multiline searching.

Simple String Checks

Assuming we had the string “the quick brown fox jumped over the lazy dog”, and we wanted to check if it contains the string ‘dog’, a way to do this with regex would be 

let sentence = "The quick brown fox jumped over the lazy dog.";
let exp = /dog/;
console.log(exp.exec(sentence));
/*
this would log
[
  'dog',
  index: 41,
  input: 'The quick brown fox jumped over the lazy dog.',
  groups: undefined
]
*/

Also, just like we said in the beginning of this article, using the .test() function instead would return a boolean, like true or false. 

let sentence = "The quick brown fox jumped over the lazy dog.";
let exp = /dog/;
console.log(exp.test(sentence)); // this would log true

Simple Number Checks

To check if there are any numeric values in a body of string, one can go about it the following way: 

let sentence = "The quick brown fox jumped over the 5 lazy dogs.";
let exp = /\d+/;
console.log(exp.test(sentence)); // this would log true
// Alternatively,
let sentence = "The quick brown fox jumped over the lazy dogs.";
let exp = /\d+/;
console.log(exp.test(sentence)); // this would log false

To check if a body of string contains only numeric values or not, one can go about it like this:

let sentence = "The quick brown fox jumped over the 5 lazy dogs.";
let exp = /^\d+$/;
console.log(exp.test(sentence)); // this would log false

//while

let string = "32423424";
let exp = /^\d+$/;
console.log(exp.test(string)); // this would log true

Simple Alphanumeric Checks

Sometimes, you might need to check if the string only contains numbers and alphabets; no special characters. And the way to go about that is: 

let exp = /[a-zA-Z0-9]/;
let string1 = "asdas";
let string2 = "23123";
let string3 = "asd3";
let string4 = ".";
let string5 = "1234;";
console.log(exp.test(string1)); //logs true
console.log(exp.test(string2)); //logs true
console.log(exp.test(string3)); //logs true
console.log(exp.test(string4)); //logs false
console.log(exp.test(string5)); //logs true

As for string5, if you would want to make sure no special character falls in the string body, you could add the $ sign like below: 

let exp = /[a-zA-Z0-9]$/;
let string5 = "1234;";
console.log(exp.test(string5)); //logs false

There are a lot more types of checks that could be done on strings using regular expressions, you can go as wild as your imagination is willing to carry you, but this would have to be the end of this article. Thanks for reading.

JavaScriptRegexRegular Expressions