Regex Blah

Just my notes on Regex. Nothing exciting, just painful.

Introduction

Regex is used to match patterns (dates, birthdays, alphabets etc) by using symbols, letters and flags. Most prevalent for Regex use cases is form validation.

Basics

To construct a regex expression:

1. Literal form:  var pattern = /hello/; 
2. Constructor form: var pattern = new RegExp('hello');

Patterns

1. Exact matches

var pattern = /Doing regex/;
//matches the words 'Doing'and 'regex' with 1 space in between them

Exact match in some user submitted input?

var userInput = "Doing regex";
var pattern = new RegExp(userInput);

2. Finding a match

1. Use the test method to find a match between a user-input/test string and pattern
2. The test method returns either True/False depending on whether a match was found
3. Example:

    var input= "I like dogs";
    var pattern  = /dogs/;  
    console.log(pattern.test(input));
    // returns true

3. Regex Properties

1. A regex object has many properties which provide information about the scope of the regex expression

2. Some of these properties are:

   • global
   • ignorecase
   • unicode

3. They are depicted by the following flags:
   -g
   -i
   -u

4. Example:
   

    var input = "I like dogs";
    var pattern = /dogs/g;
    console.log(pattern.global);
    // returns true

1. True/False is returned depending on whether OR not a flag is used.

4. Syntax

1. Using flags will change the context in which a regex expression works
2. Regex expressions are case sensitive by default
3. Using the 'i' flag will ensure that casing of the match is ignored. So 'f' and 'F' are both the same

4. By default only the first instance of a pattern will be matched. In order to find all instances the 'g' (global) flag is used

5. Example:
   

      var input = "I like dogs";
      var pattern = /I LIKE DOGS/i; 
      console.log(pattern.test(input));
     //returns true

1. ES2015 allows for testing of unicode characters.
2. Example:

     var character = '😂';
     var pattern = /\u{1F602}/u;
     console.log(pattern.test(character);

5. Special characters

1. Character sets: These allow or matching of characters within a particular character set
2. A character set can be :
   • certain characters example: 'abc'
   • or a range of characters example: A-Z

3. var input  = "I am a dog"; 
   var pattern = /[jkl]/; 
   console.log(pattern.test(input)); 
   //returns false 

Range

These depict any range of characters to be matched against

 var input = "I like dogs"; 
 var pattern = /[a-zA-Z]/;
 console.log(pattern.test(input));
 // returns true 

Testing for a hyphen

 var numbers = "100-200"; 
 var pattern = /[10-20-]/;
 console.log(pattern.test(numbers));
 // returns true 

Negated Character set

To test for characters NOT within a set use the '^' (hat) symbol

var noLetters = "abcdefghijklmnopqrstuvwxzy"
var pattern = /[^a-z]/
console.log(pattern.test(noLetters));
//returns false


var noNumbers = "abcdefghijklmnopqrstuvwxzy"
var pattern = /[^1-100]/
console.log(pattern.test(noNumbers));
//returns true

Test for "OR"

To test for "or" use the '|'character

var dogOrCat = "dog";
var pattern = /[dog|unicat]/
console.log(pattern.test(dogOrCat));
//returns true

6. Quantifiers

A quantifier allows you to look for a pattern 'x' times. For example:

a. * : Matches a character or set 0 OR more times
b. + : Matches a character or set 1 OR more times
c. {n}: Matches a character or set 'n' times
d. {n, m}: Matches the character or set it follows a minimum 'n' times and maximum 'm' times.

7. Boundaries

a. ^ : Matches from the beginning of the input
b. $ : Matches to the end of the input
c. \b : Matches a boundary between a letter and a non word character such as a space
d: \B : Matches a non word boundary i.e the place between 2 characters of the same type (example letters, spaces).

8. Anchors

^ and $ are known as anchors, we use these when we want to ensure that the entire test string contains ONLY the pattern.

9. Assertions

Reminds me of something I'd have learnt in law school. Assertions allow you to look for patterns conditionally. For example we can match token A only if token B follows. Inside parenthesis ( )'?=' precedes the conditional token. To reverse the assertion use '?!'

var input = 'I love dogs',
pattern = /love(?= dogs)/;

console.log(pattern.test(input)); 
// returns true

var input = 'I love dogs',
pattern = /love(?! dogs)/;

console.log(pattern.test(input)); 
// returns false

10 Exec method

This method executes a search for a pattern in a string. If a match is found then an array is returned else 'null' is returned if there is no match found.

The array contains the matched text as the 1st item, and any matched groups (as enclosed by parenthesis) as items in the array.

var sentence = 'I love dogs',
var pattern = /(love)\s(dogs)/;
console.log(pattern.exec(sentence));
//returns ["love dogs", "love", "dogs"]

var sentence = 'I love dogs',
var pattern = /(love)\s(cats)/;
console.log(pattern.exec(sentence));
//returns null

11. Match method

The match method does the same thing as the exec method, except that it is used on strings and not regex expressions.

var sentence= 'I love dogs';
var pattern = /(love) (dogs)/;
console.log(sentence.match(pattern));
// returns ["love dogs", "love", "dogs"]

12. Search method

The search method is used on a regex expression and searches for a sub-string within the string. If found it will return the index of the sub-string else -1 is returned.

var sentence = 'I love dogs';
var pattern = /I/;
console.log(sentence.search(pattern));
//returns 0

13. Split method

The split method will split a string into an array taking a separator as an argument.

var sentence = 'I love dogs';
var pattern = /\s/;
 console.log(sentence.split(pattern));
// returns ["I", "love", "dogs"]

14. Resources:

Envato Tuts+