Merge pull request #1590 from wgolledge/patch-1

Update 01-regexp-introduction
This commit is contained in:
Ilya Kantor 2019-11-06 20:32:56 +03:00 committed by GitHub
commit 978a3a2911
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -1,14 +1,14 @@
# Patterns and flags # Patterns and flags
Regular expressions is a powerful way to search and replace in text. Regular expressions are patterns that provide a powerful way to search and replace in text.
In JavaScript, they are available as [RegExp](mdn:js/RegExp) object, and also integrated in methods of strings. In JavaScript, they are available via the [RegExp](mdn:js/RegExp) object, as well as being integrated in methods of strings.
## Regular Expressions ## Regular Expressions
A regular expression (also "regexp", or just "reg") consists of a *pattern* and optional *flags*. A regular expression (also "regexp", or just "reg") consists of a *pattern* and optional *flags*.
There are two syntaxes to create a regular expression object. There are two syntaxes that can be used to create a regular expression object.
The "long" syntax: The "long" syntax:
@ -16,7 +16,7 @@ The "long" syntax:
regexp = new RegExp("pattern", "flags"); regexp = new RegExp("pattern", "flags");
``` ```
...And the short one, using slashes `"/"`: And the "short" one, using slashes `"/"`:
```js ```js
regexp = /pattern/; // no flags regexp = /pattern/; // no flags
@ -25,11 +25,11 @@ regexp = /pattern/gmi; // with flags g,m and i (to be covered soon)
Slashes `pattern:/.../` tell JavaScript that we are creating a regular expression. They play the same role as quotes for strings. Slashes `pattern:/.../` tell JavaScript that we are creating a regular expression. They play the same role as quotes for strings.
In both cases `regexp` becomes an object of the built-in `RegExp` class. In both cases `regexp` becomes an instance of the built-in `RegExp` class.
The main difference between these two syntaxes is that slashes `pattern:/.../` do not allow to insert expressions (like strings with `${...}`). They are fully static. The main difference between these two syntaxes is that pattern using slashes `/.../` does not allow for expressions to be inserted (like string template literals with `${...}`). They are fully static.
Slashes are used when we know the regular expression at the code writing time -- and that's the most common situation. While `new RegExp` is used when we need to create a regexp "on the fly", from a dynamically generated string, for instance: Slashes are used when we know the regular expression at the code writing time -- and that's the most common situation. While `new RegExp`, is more often used when we need to create a regexp "on the fly" from a dynamically generated string. For instance:
```js ```js
let tag = prompt("What tag do you want to find?", "h2"); let tag = prompt("What tag do you want to find?", "h2");
@ -47,7 +47,7 @@ There are only 6 of them in JavaScript:
: With this flag the search is case-insensitive: no difference between `A` and `a` (see the example below). : With this flag the search is case-insensitive: no difference between `A` and `a` (see the example below).
`pattern:g` `pattern:g`
: With this flag the search looks for all matches, without it -- only the first one. : With this flag the search looks for all matches, without it -- only the first match is returned.
`pattern:m` `pattern:m`
: Multiline mode (covered in the chapter <info:regexp-multiline-mode>). : Multiline mode (covered in the chapter <info:regexp-multiline-mode>).
@ -71,7 +71,7 @@ From here on the color scheme is:
## Searching: str.match ## Searching: str.match
As it was said previously, regular expressions are integrated with string methods. As mentioned previously, regular expressions are integrated with string methods.
The method `str.match(regexp)` finds all matches of `regexp` in the string `str`. The method `str.match(regexp)` finds all matches of `regexp` in the string `str`.
@ -102,7 +102,7 @@ It has 3 working modes:
3. And, finally, if there are no matches, `null` is returned (doesn't matter if there's flag `pattern:g` or not). 3. And, finally, if there are no matches, `null` is returned (doesn't matter if there's flag `pattern:g` or not).
That's a very important nuance. If there are no matches, we get not an empty array, but `null`. Forgetting about that may lead to errors, e.g.: This a very important nuance. If there are no matches, we don't receive an empty array, but instead receive `null`. Forgetting about that may lead to errors, e.g.:
```js run ```js run
let matches = "JavaScript".match(/HTML/); // = null let matches = "JavaScript".match(/HTML/); // = null
@ -112,7 +112,7 @@ It has 3 working modes:
} }
``` ```
If we'd like the result to be always an array, we can write it this way: If we'd like the result to always be an array, we can write it this way:
```js run ```js run
let matches = "JavaScript".match(/HTML/)*!* || []*/!*; let matches = "JavaScript".match(/HTML/)*!* || []*/!*;
@ -124,7 +124,7 @@ It has 3 working modes:
## Replacing: str.replace ## Replacing: str.replace
The method `str.replace(regexp, replacement)` replaces matches with `regexp` in string `str` with `replacement` (all matches, if there's flag `pattern:g`, otherwise only the first one). The method `str.replace(regexp, replacement)` replaces matches found using `regexp` in string `str` with `replacement` (all matches if there's flag `pattern:g`, otherwise, only the first one).
For instance: For instance:
@ -164,14 +164,14 @@ let regexp = /LOVE/i;
alert( regexp.test(str) ); // true alert( regexp.test(str) ); // true
``` ```
Further in this chapter we'll study more regular expressions, come across many other examples and also meet other methods. Later in this chapter we'll study more regular expressions, walk through more examples, and also meet other methods.
Full information about the methods is given in the article <info:regexp-methods>. Full information about the methods is given in the article <info:regexp-methods>.
## Summary ## Summary
- A regular expression consists of a pattern and optional flags: `pattern:g`, `pattern:i`, `pattern:m`, `pattern:u`, `pattern:s`, `pattern:y`. - A regular expression consists of a pattern and optional flags: `pattern:g`, `pattern:i`, `pattern:m`, `pattern:u`, `pattern:s`, `pattern:y`.
- Without flags and special symbols that we'll study later, the search by a regexp is the same as a substring search. - Without flags and special symbols (that we'll study later), the search by a regexp is the same as a substring search.
- The method `str.match(regexp)` looks for matches: all of them if there's `pattern:g` flag, otherwise only the first one. - The method `str.match(regexp)` looks for matches: all of them if there's `pattern:g` flag, otherwise, only the first one.
- The method `str.replace(regexp, replacement)` replaces matches with `regexp` by `replacement`: all of them if there's `pattern:g` flag, otherwise only the first one. - The method `str.replace(regexp, replacement)` replaces matches found using `regexp` with `replacement`: all of them if there's `pattern:g` flag, otherwise only the first one.
- The method `regexp.test(str)` returns `true` if there's at least one match, otherwise `false`. - The method `regexp.test(str)` returns `true` if there's at least one match, otherwise, it returns `false`.