You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: 1-js/09-classes/07-mixins/article.md
+16-16Lines changed: 16 additions & 16 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,14 +1,14 @@
1
-
# Примесь
1
+
# Примеси
2
2
3
3
В JavaScript мы можем использовать наследование только от одного объекта. Объект имеет единственный `[[Prototype]]`. И класс может расширить только один другой класс.
4
4
5
5
Иногда это может ограничивать нас. Например, у нас есть класс `StreetSweeper` и класс `Bicycle`, и хотим создать `StreetSweepingBicycle`.
6
6
7
7
Или, поговорим о программировании, у нас есть класс `Renderer`, который реализует шаблон и класс `EventEmitter` реализующий событие. И мы хотим объединить их функционалы вместе в классе `Page`. Создадим страницу, которая будет использовать шаблон, и использовать событие.
8
8
9
-
Для таких случаев существует "примесь".
9
+
Для таких случаев существует "примеси".
10
10
11
-
Как говориться в Википедии [примесь](https://ru.wikipedia.org/wiki/Mixin) является классом, который имеет методы и мы можем их использовать в других классов, без необходимости быть родителем этих классов.
11
+
Как говориться в Википедии [примесь](https://ru.wikipedia.org/wiki/%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%81%D1%8C_(%D0%BF%D1%80%D0%BE%D0%B3%D1%80%D0%B0%D0%BC%D0%BC%D0%B8%D1%80%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5)) является классом, который имеет методы и мы можем их использовать в других классов, без необходимости быть родителем этих классов.
12
12
13
13
Другими словами *примесь* определяет методы, которые реализуют определенное поведение. Мы не используем его в одиночку, а используем его, чтобы добавить другим классам больше функционала.
Примеси могут использовать наследование между собой.
61
61
62
-
В примере ниже `sayHiMixin` наследуется от `sayMixin`:
62
+
В примере ниже `sayHiMixin` наследуется от `sayMixin`:
63
63
64
64
```js run
65
65
let sayMixin = {
@@ -111,7 +111,7 @@ new User("Dude").sayHi(); // Hello Dude!
111
111
112
112
Событие может иметь имя, необязательно, и связь между некоторыми дополнительными данными.
113
113
114
-
Например объект `user` может генерировать события `"login"`, когда посетитель входит. А другой объект `calendar` может захотеть получать его события, чтобы загрузить календарь для вошедшего человека.
114
+
Например, объект `user` может генерировать события `"login"`, когда посетитель входит. А другой объект `calendar` может захотеть получать его события, чтобы загрузить календарь для вошедшего человека.
115
115
116
116
Или `menu` может генерировать событие `"select"`, когда меню элемент выбран, или другие объекты могут захотеть получить эту информацию и отреагировать на это событие.
117
117
@@ -120,9 +120,9 @@ new User("Dude").sayHi(); // Hello Dude!
120
120
```js run
121
121
let eventMixin = {
122
122
/**
123
-
* Опишем события, используя:
124
-
* menu.on('select', function(item) { ... }
125
-
*/
123
+
* Опишем события, используя:
124
+
* menu.on('select', function(item) { ... }
125
+
*/
126
126
on(eventName, handler) {
127
127
if (!this._eventHandlers) this._eventHandlers= {};
128
128
if (!this._eventHandlers[eventName]) {
@@ -132,13 +132,13 @@ let eventMixin = {
132
132
},
133
133
134
134
/**
135
-
* Закроем событие, используя:
136
-
* menu.off('select', handler)
137
-
*/
135
+
* Закроем событие, используя:
136
+
* menu.off('select', handler)
137
+
*/
138
138
off(eventName, handler) {
139
139
let handlers =this._eventHandlers&&this._eventHandlers[eventName];
140
140
if (!handlers) return;
141
-
for (let i =0; i<handlers.length; i++) {
141
+
for (let i =0; i<handlers.length; i++) {
142
142
if (handlers[i] === handler) {
143
143
handlers.splice(i--, 1);
144
144
}
@@ -162,9 +162,9 @@ let eventMixin = {
162
162
163
163
И так у нас 3 метода:
164
164
165
-
1.`.on(eventName, handler)` -- назначили функцию `handler`, чтобы запустить событие с этим именем. И храним обработчиков в `_eventHandlers` свойстве.
166
-
167
-
2.`.off(eventName, handler)` -- удаляем функцию из списка обработчиков
165
+
1.`.on(eventName, handler)` -- назначили функцию `handler`, чтобы запустить событие с этим именем. И храним обработчиков в свойстве `_eventHandlers`.
166
+
167
+
2.`.off(eventName, handler)` -- удаляем функцию из списка обработчиков.
168
168
169
169
3.`.trigger(eventName, ...args)` -- генерируем событие: все назначенные обработчики вызываются и в `args` передаются в качестве аргументов.
0 commit comments