diff --git a/curriculum/challenges/english/blocks/lecture-working-with-regular-expressions/6733aad43b3ebff588a26fb5.md b/curriculum/challenges/english/blocks/lecture-working-with-regular-expressions/6733aad43b3ebff588a26fb5.md index 637f22dc9d9..7509b3c36c7 100644 --- a/curriculum/challenges/english/blocks/lecture-working-with-regular-expressions/6733aad43b3ebff588a26fb5.md +++ b/curriculum/challenges/english/blocks/lecture-working-with-regular-expressions/6733aad43b3ebff588a26fb5.md @@ -5,7 +5,7 @@ challengeType: 19 dashedName: what-are-regular-expressions-and-what-are-some-common-methods --- -# --description-- +# --interactive-- Regular expressions, or regex, are a feature supported by many different programming languages. @@ -25,22 +25,24 @@ That brings us to our first method – the `test()` method. The `test()` method The `test()` method accepts a string, which is the string to test for matches against the regular expression. For example, let's try testing the string `e`: +:::interactive_editor + ```js const regex = /freeCodeCamp/; const test = regex.test("e"); console.log(test); ``` -You can see we've called the `test()` method on our new regex, and passed the string `e` as the argument. We've also logged the result: +::: -```js -console.log(test); // false -``` +You can see we've called the `test()` method on our new regex, and passed the string `e` as the argument. The `test()` method returned `false` because the string `e` does not match the pattern `freeCodeCamp`. Even though the pattern `freeCodeCamp` includes the letter `e`, that's the opposite direction of how regular expressions work. Let's take a look at a few more examples. Take a moment to consider these: +:::interactive_editor + ```js const regex = /freeCodeCamp/; console.log(regex.test("freeCodeCamp")); @@ -53,21 +55,9 @@ console.log(regex.test("code")); console.log(regex.test("camp")); ``` -What do you think each line will print? Well, here's the result: +::: -```js -const regex = /freeCodeCamp/; -console.log(regex.test("freeCodeCamp")); // true -console.log(regex.test("freeCodeCamp is great")); // true -console.log(regex.test("I love freeCodeCamp")); // true -console.log(regex.test("freecodecamp")); // false -console.log(regex.test("FREECODECAMP")); // false -console.log(regex.test("free")); // false -console.log(regex.test("code")); // false -console.log(regex.test("camp")); // false -``` - -Did that surprise you? Notice how the first three strings returned `true`. These strings all contain the text, `freeCodeCamp`, exactly, somewhere in the string. +Notice how the first three strings returned `true`. These strings all contain the text, `freeCodeCamp`, exactly, somewhere in the string. Lines 5 and 6 return `false`. While they contain the text `freecodecamp`, the case does not match. Regular expressions are case-sensitive by default. @@ -88,7 +78,6 @@ console.log(match); If we run this, we get an array back! But it's a strange looking array. It's got some extra properties: ```js -console.log(match); // [ // 'freeCodeCamp', // index: 0, @@ -140,6 +129,8 @@ Now, strings have a `replace()` method which accepts two arguments: the regular So if we wanted to replace our `freecodecamp` with the proper casing: +:::interactive_editor + ```js const regex = /freecodecamp/; const str = "freecodecamp is rly kewl"; @@ -147,11 +138,7 @@ const replaced = str.replace(regex, "freeCodeCamp"); console.log(replaced); ``` -And we'll peek at the result: - -```js -console.log(replaced); // freeCodeCamp is rly kewl -``` +::: You can see that `replace()` returns the updated string with the matching pattern `replaced`.