In JavaScript, Regular Expressions (RegEx) are patterns used to match character combinations in strings. With the introduction of ECMAScript 6 (ES6), several new features were added to the regular expression syntax, making it more powerful and easier to work with.
Key Features of ES6 Regular Expressions
Named Capturing Groups
ES6 introduced named capturing groups in regular expressions, allowing you to assign names to the capturing groups. This makes it easier to reference the captured values, especially in more complex patterns.
JavaScript
let regex = /(?<fName>\w+) (?<lName>\w+)/;
let s = "Rahul Kumar";
let match = s.match(regex);
console.log(match.groups.fName);
console.log(match.groups.lName);
In the above example, we have a regular expression that captures the first and last name as fName and lName using named groups. We can then access these groups directly via match.groups.fName and match.groups.lName.
The y (Sticky) Modifier
The y modifier makes the regular expression match from the current position in the string. This is useful for matching substrings sequentially without having to reset the search position.
JavaScript
let regex = /hello/y;
let s = "hello world hello";
console.log(regex.exec(s));
console.log(regex.exec(s));
Output[ 'hello', index: 0, input: 'hello world hello', groups: undefined ]
null
The y modifier forces the regular expression to start matching from the exact position in the string where the last match occurred. In the above code, after the first match, the regex’s last index is at the end of “hello”, so the second call to exec() doesn’t match anything.
The u (Unicode) Modifier
The u modifier allows regular expressions to properly handle Unicode characters, including characters outside the basic multilingual plane (BMP), such as emojis or characters from non-Latin alphabets.
JavaScript
let regex = /\u{1F600}/u;
let s = "😀";
console.log(regex.test(s));
The u flag ensures that Unicode characters, like the emoji in this case, are correctly matched. Without it, the regular expression would fail to match characters outside the BMP.
The s (Dotall) Modifier
The s modifier allows the dot (.) in regular expressions to match newlines as well, which is a behavior that was previously unavailable in JavaScript.
JavaScript
let regex = /foo.bar/s;
let s = "foo\nbar";
console.log(regex.test(s));
The s modifier enables the . character to match any character, including newline characters (\n). Without the s flag, . does not match newline characters, and the above test would fail.
The d (Decimal) Modifier (Experimental)
ES6 proposed the d flag to allow matching decimal points more easily. However, it has not yet been widely adopted in JavaScript engines, and as of now, it is not supported in most browsers.
The n (Named Property Access) Modifier
This flag allows you to create named properties inside regular expressions for easier access, making it simpler to extract and manipulate matched groups.
Regular Expression Syntax Enhancements in ES6
Apart from the modifiers, ES6 brought several improvements to the syntax of regular expressions
Unicode Property Escapes
ES6 introduces the \p{Property=Value} syntax for matching characters based on their Unicode properties. This allows for more powerful and specific character matching.
JavaScript
let regex = /\p{Script=Greek}/u;
let s = "αβγ";
console.log(regex.test(s));
The regular expression matches any characters from the Greek script, making it easier to work with characters from specific languages or scripts.
Expanded Character Classes
ES6 allows the use of extended Unicode character classes such as \p{L} for letters, \p{N} for numbers, etc. This gives us more precise control over pattern matching, especially when dealing with international characters.
JavaScript
let regex = /\p{L}+/gu;
let s = "Hello 123";
console.log(s.match(regex));
The \p{L} matches any Unicode letter. Using g for global matching, we extract all letter sequences in the string.
Practical Examples of ES6 Regular Expressions
Validating a Date Format (YYYY-MM-DD)
JavaScript
let regex = /^(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})$/;
let s = "2024-12-31";
let match = s.match(regex);
if (match) {
console.log(match.groups.year);
console.log(match.groups.month);
console.log(match.groups.day);
}
The regular expression validates a date string and extracts the year, month, and day using named groups.
Matching a Valid Email Address
JavaScript
let regex = /^(?<username>[a-zA-Z0-9._%+-]+)@(?<domain>[a-zA-Z0-9.-]+\.[a-zA-Z]{2,})$/;
let mail = "[email protected]";
let match = mail.match(regex);
if (match) {
console.log(match.groups.username);
console.log(match.groups.domain);
}
The regular expression matches a basic email format and extracts the username and domain using named groups.
Extracting Emoji from a String
JavaScript
let regex = /\p{Emoji}/gu;
let s = "Hello 😊, how are you? 😎";
console.log(s.match(regex));
The regex uses the Unicode property escape \p{Emoji} to match emoji characters in the string.
Similar Reads
Explain RegExp in ES6
RegExp (short for Regular Expression) is a pattern used to match character combinations in strings. It's often used for tasks like Searching for specific substrings.Replacing text in strings.Validating formats like email, URLs, or phone numbers.[GFGTABS] JavaScript let pattern = /abc/; // A simple r
3 min read
Perl | Assertions in Regex
Regular Expression (Regex or RE) in Perl is when a special string describing a sequence or the search pattern in the given string. An Assertion in Regular Expression is when a match is possible in some way. The Perl's regex engine evaluates the given string from left to right, searching for the matc
3 min read
What is Regex in Golang?
A Regular Expression (or RegEx) is a special sequence of characters that defines a search pattern that is used for matching specific text. In Golang, there's a built-in package for regular expressions, called the regexp package which contains all list of actions like filtering, replacing, validating
3 min read
JavaScript RegExp Lookaheads
Lookaheads in JavaScript regular expressions allow you to match a pattern only if it is followed (or not followed) by another pattern. Unlike regular matches, lookaheads do not consume characters in the string but simply assert that a certain pattern is present at a specific position. [GFGTABS] Java
3 min read
Metacharacters in Java Regex
Regex stands for Regular Expression, which is used to define a pattern for a string. It is used to find the text or to edit the text. Java Regex classes are present in java.util.regex package, which needs to be imported before using any of the methods of regex classes. java.util.regex package consis
5 min read
Regex Cheat Sheet - Python
Regex or Regular Expressions are an important part of Python Programming or any other Programming Language. It is used for searching and even replacing the specified text pattern. In the regular expression, a set of characters together form the search pattern. It is also known as the reg-ex pattern.
9 min read
Regex Character Cases in Java
Regular expressions (also called "Regex") are special types of pattern-matching strings that describe a pattern in a text. A regex can be matched against another string to see whether the string fits the pattern. In general, regex consists of normal characters, character classes, wildcard characters
6 min read
JavaScript RegExp exec() Method
The RegExp.exec() method in JavaScript allows you to search for a pattern in a string and retrieve detailed information about the match. Unlike simple methods like test(), exec() returns not just a boolean, but an array containing the entire match, capturing groups, the position of the match, and mo
2 min read
Lodash _.escapeRegExp() Method
Lodash _.escapeRegExp() method is used to escape the Regular Expression special characters "^", "$", "", ".", "*", "+", "?", "(", ")", "[", "]", "{", "}", and "|" in string. Syntax:_.escapeRegExp([string='']);Parameters:string: This parameter holds the string to escape.Return Value:This method retur
1 min read
JavaScript RegExp (x|y) Expression
The (x|y) expression in JavaScript regular expressions is used to match either x or y. It acts as an OR operator in regular expressions, allowing you to specify multiple patterns to match. [GFGTABS] JavaScript let regex = /(cat|dog)/g; let str = "I have a cat and a dog."; let matches = str
2 min read