JavaScript Regular Expressions / lesson 2 of 11

Plain text

Matching plain text with regular expressions is simpler than you think.

Play
Transcript

[00:00] Finding plain text patterns with regular expressions is fairly simple, fairly trivial. So I’ve got a string here, cat set on the mat, period. And I’m gonna set up our regex to be forward slash cat and we’re good. There’s cat set on the mat. We’ve got it. If we wanted to get set, we’ve got it there. So we can just change these as we see fit.

[00:27] Now let’s see, I wanna get all of the ats. I’m getting the first one and that’s great, but I wanna get all of them. I can resolve that by adding the global flag. I’ll save that and boom, you can see we’ve got all of them.

[00:38] Now let’s say I wanna get any pattern where it’s a character followed by at. So I wanna get cat, sat and mat. We can do that with the dot meta character. So I’ll hit save and you can see we’ve got cat, sat and mat. Now the dot character, this is what’s called a meta character. Its use is for identifying any characters that’s gonna be letters, digits and dashes or including dashes, but not line breaks.

[01:07] So what I’m gonna do, let’s just break this out and everything is gonna work fine. We’re looking good. So let’s say I want four characters. Actually, let’s back up. Let’s say I want three characters and this all looks good and makes sense. So I’m getting three characters. That’s one character followed by another character followed by another character. So C A T works, S A T works, space O N works, T H E works, space M A works, and then T period does not match. So we don’t get that. That’s one character. So let’s go back to the four. So this is where it gets interesting. C A T is not highlighted because the character after the T is a line break. Now S A T space works. O N is followed by a line breaks. That doesn’t work. And then these each have four characters.

[02:00] Now we can enable the dot to capture line breaks by using the S flag, and this is referred to as the dot all flag. So if I save that all of a sudden cat matches with the line break, set space on line break to the T. So remember it’s four characters, H E space M, and then the A T period doesn’t match anything. Okay. One more thing. So if you have a list of meta characters up here, the dot is one of them, but let’s say I want to capture the period at the end of this sentence. Anytime you’re using or trying to capture a literal meta character, you just escape it with a backslash right before that character and boom, we’ve got our dot. If that was a question mark, we would do the same thing. So if you’re trying to capture a meta character, one of these guys up here, and we’ll talk more more about these. You just need to escape that meta character and you’re good to go.

Matching plain text with regular expressions is simpler than you think. This lesson covers the building blocks: matching literal text, using the global flag to find all occurrences, and the dot (.) meta character for matching any single character. We also cover the dot-all flag (s flag) that lets the dot match line breaks, and how to escape meta characters when you need to match them literally.

app.js

app.ts
import output from "./output.js";
// . [ ] ( ) { } * + ? ^ $ | \ /
// finding a plain text patters with regexp is fairly trivial
const str = `Cat sat on the mat.`;
// Match literal text
let regex = /Cat/; // easy
// regex = /at/g; // all the at add g
// regex = /.at/g; // all the .at
// metacharacter dot identifies any character letters,
// digits, dashes, but not line breaks
// regex = /./g; // all the .at
// regex = /.../gi; // any set of 3 chars
// regex = /..../gi; // any set of 4 chars, no line breaks
// regex = /..../gis; // include line breaks with dotAll
// regex = /\./; // literal .
output(str, regex);

Share this post on:

Previous
Introduction
Next
Quantifiers