fixes
This commit is contained in:
parent
d67c04c22f
commit
b6c7a71d0c
3 changed files with 11 additions and 13 deletions
|
@ -517,7 +517,7 @@ Here we get a sum of array in one line:
|
||||||
```js run
|
```js run
|
||||||
let arr = [1, 2, 3, 4, 5]
|
let arr = [1, 2, 3, 4, 5]
|
||||||
|
|
||||||
let result = arr.reduce((sum, current) => sum + current), 0);
|
let result = arr.reduce((sum, current) => sum + current, 0);
|
||||||
|
|
||||||
alert(result); // 15
|
alert(result); // 15
|
||||||
```
|
```
|
||||||
|
|
|
@ -388,7 +388,7 @@ For instance:
|
||||||
</script>
|
</script>
|
||||||
```
|
```
|
||||||
|
|
||||||
In other words, when `addEventListener` receives and object as the handler, it calls `object.handleEvent(event)` in case of an event.
|
In other words, when `addEventListener` receives an object as the handler, it calls `object.handleEvent(event)` in case of an event.
|
||||||
|
|
||||||
We could also use a class for that:
|
We could also use a class for that:
|
||||||
|
|
||||||
|
@ -418,9 +418,9 @@ We could also use a class for that:
|
||||||
</script>
|
</script>
|
||||||
```
|
```
|
||||||
|
|
||||||
Here the same object handles both events. Please note that we need to explicitly setup the listeners. The `menu` object only gets `mousedown` and `mouseup` here, not any other types of events.
|
Here the same object handles both events. Please note that we need to explicitly setup the events to listen using `addEventListener`. The `menu` object only gets `mousedown` and `mouseup` here, not any other types of events.
|
||||||
|
|
||||||
The method `handleEvent` does not have to handle everything by itself. It can call the corresponding event-specific instead, like this:
|
The method `handleEvent` does not have to do all the job by itself. It can call other event-specific methods instead, like this:
|
||||||
|
|
||||||
```html run
|
```html run
|
||||||
<button id="elem">Click me</button>
|
<button id="elem">Click me</button>
|
||||||
|
@ -456,16 +456,14 @@ There are 3 ways to assign event handlers:
|
||||||
|
|
||||||
1. HTML attribute: `onclick="..."`.
|
1. HTML attribute: `onclick="..."`.
|
||||||
2. DOM property: `elem.onclick = function`.
|
2. DOM property: `elem.onclick = function`.
|
||||||
3. Methods `elem.addEventListener(event, handler[, phase])`, to remove: `removeEventListener`.
|
3. Methods: `elem.addEventListener(event, handler[, phase])` to add, `removeEventListener` to remove.
|
||||||
|
|
||||||
HTML attributes are used sparingly, because JavaScript in the middle of an HTML tag looks a little bit odd and alien. Also can't write lots of code in there.
|
HTML attributes are used sparingly, because JavaScript in the middle of an HTML tag looks a little bit odd and alien. Also can't write lots of code in there.
|
||||||
|
|
||||||
DOM properties are ok to use, but we can't assign more than one handler of the particular event. In many cases that limitation is not pressing.
|
DOM properties are ok to use, but we can't assign more than one handler of the particular event. In many cases that limitation is not pressing.
|
||||||
|
|
||||||
The last way is the most flexible, but it is also the longest to write. There are few events that only work with it, for instance `transtionend` and `DOMContentLoaded` (to be covered).
|
The last way is the most flexible, but it is also the longest to write. There are few events that only work with it, for instance `transtionend` and `DOMContentLoaded` (to be covered). Also `addEventListener` supports objects as event handlers. In that case the method `handleEvent` is called in case of the event.
|
||||||
|
|
||||||
Also `addEventListener` supports objects as event handlers. In that case the method `handleEvent` is called in case of the event.
|
No matter how you assign the handler -- it gets an event object as the first argument. That object contains the details about what's happened.
|
||||||
|
|
||||||
When a handler is called, it gets an event object as the first argument that contains the details about what's happened.
|
|
||||||
|
|
||||||
We'll learn more about events in general and about different types of events in the next chapters.
|
We'll learn more about events in general and about different types of events in the next chapters.
|
||||||
|
|
|
@ -39,20 +39,20 @@ That can be described as "greediness is the cause of all evil".
|
||||||
To find a match, the regular expression engine uses the following algorithm:
|
To find a match, the regular expression engine uses the following algorithm:
|
||||||
|
|
||||||
- For every position in the string
|
- For every position in the string
|
||||||
- Match the pattern symbol-by-symbol using classes and quantifiers.
|
- Match the pattern at that position.
|
||||||
- If there's no match, go to the next position.
|
- If there's no match, go to the next position.
|
||||||
|
|
||||||
These common words do not make it obvious why the regexp fails, so let's elaborate how the search works for the pattern `pattern:".+"`.
|
These common words do not make it obvious why the regexp fails, so let's elaborate how the search works for the pattern `pattern:".+"`.
|
||||||
|
|
||||||
1. The first pattern character is a quote `pattern:"`.
|
1. The first pattern character is a quote `pattern:"`.
|
||||||
|
|
||||||
The regular expression engine tries to find it on 0-th position of the source string, but there's `subject:a` there, so no match.
|
The regular expression engine tries to find it at the zero position of the source string `subject:a "witch" and her "broom" is one`, but there's `subject:a` there, so there's immediately no match.
|
||||||
|
|
||||||
Then it advances: goes to the 1st, 2nd positions in the source string and tries to find the pattern there, and finally finds the quote at the 3rd position:
|
Then it advances: goes to the next positions in the source string and tries to find the first character of the pattern there, and finally finds the quote at the 3rd position:
|
||||||
|
|
||||||

|

|
||||||
|
|
||||||
2. The quote is detected, and then the engine tries to find a match for the rest of the pattern.
|
2. The quote is detected, and then the engine tries to find a match for the rest of the pattern. It tries to see if the rest of the subject string conforms to `pattern:.+"`.
|
||||||
|
|
||||||
In our case the next pattern character is `pattern:.` (a dot). It denotes "any character except a newline", so the next string letter `match:'w'` fits:
|
In our case the next pattern character is `pattern:.` (a dot). It denotes "any character except a newline", so the next string letter `match:'w'` fits:
|
||||||
|
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue