Блок предоставляет набор JS-классов, реализующий механизмы работы с событиями.
Класс | Конструктор | Описание |
---|---|---|
Event | Event(type {String} , target {Object} ) |
Служит для создания объекта события, изменения и проверки его состояний. |
Emitter | - | Служит для генерации событий и подписки на них. |
Класс | Имя | Тип или возвращаемое значение | Описание |
---|---|---|---|
Event | type | String |
Тип события. |
result | * |
Результат, возвращенный последним обработчиком события. | |
target | Object |
Объект на котором возникло событие. | |
data | * |
Данные, передаваемые как аргумент обработчику. | |
preventDefault() | - | Позволяет предотвратить выполнение стандартного действия предусмотренного для события. | |
isDefaultPrevented() | Boolean |
Проверяет, было ли предотвращено выполнение стандартного действия, предусмотренного для события. | |
stopPropagation() | - | Позволяет остановить всплывание события. | |
isPropagationStopped() | Boolean |
Проверяет, было ли остановлено всплывание события. | |
Emitter | on(type {String} , [data {Object}] , fn {Function} , [ {Object} ctx] ) |
- | Служит для подписки на событие определенного типа. |
once(type {String} , [data {Object}] , fn {Function} , [ctx {Object}] ) |
- | Служит для подписки на событие определенного типа. Обработчик выполняется единожды. | |
un(type {String} , fn {Function} , [ctx {Object}] ) |
- | Служит для удаления подписки на событие определенного типа. | |
emit(type {String |events:Event} , [data {Object}] ) |
- | Служит для генерации события. |
Элемент | Способы использования | Описание |
---|---|---|
channels | JS |
Предназначен для работы с именованными каналами событий. |
Элемент | Функция | Тип возвращаемого значения | Описание |
---|---|---|---|
channels | channels([id {String}] , [drop {Boolean}] ) |
Object |undefined |
Создает или удаляет именованный канал событий. |
Блок реализован в технологиях:
vanilla.js
С помощью класса можно инстанцировать объект события, указав его тип и источник. Для этого нужно воспользоваться функцией-конструктором Event
.
Принимаемые аргументы:
type {String}
– тип события. Обязательный аргумент.target {Object}
– объект (источник) на котором событие возникло. Обязательный аргумент.
Возвращаемое значение: Event
. Объект события.
Тип: String
.
Тип события.
modules.require(['events'], function(events) {
var myevent = new events.Event('myevent', this);
console.log(myevent.type); // 'myevent'
});
Тип: Object
.
Объект, на котором возникло событие.
Тип: *
.
Содержит данные, возвращаемые последней функцией-обработчиком события.
modules.require(['events'], function(events) {
var myEmitter = new events.Emitter();
myEmitter.on('myevent', function() { return 'hi-hi-hi'; });
var myEvent = new events.Event('myevent');
myEmitter.emit(myEvent)
console.log(myEvent.result); // 'hi-hi-hi'
});
Тип: *
.
Содержит данные, передаваемые функции-обработчику события в качестве аргумента.
modules.require(['events'], function(events) {
var myEmitter = new events.Emitter();
myEmitter.on('myevent', 'my-data', function(e) { console.log(e.data); });
myEmitter.emit('myevent'); // my-data
});
Позволяет предотвратить выполнение стандартного действия предусмотренного для события.
Не принимает аргументов.
Не имеет возвращаемого значения.
Позволяет проверить было ли предотвращено выполнение стандартного действия для события.
Не принимает аргументов.
Возвращаемое значение: Boolean
. В случае, если выполнение стандартного действия было предотвращено – true
.
Позволяет остановить всплывание события.
Не принимает аргументов.
Не имеет возвращаемого значения.
Позволяет проверить, было ли остановлено всплывание события.
Не принимает аргументов.
Возвращаемое значение: Boolean
. В случае, если всплывание события было остановлено – true
.
Класс позволяет инстанцировать объекты, с помощью которых можно генерировать события и осуществлять подписку на них.
modules.require(['events'], function(events) {
var myEmitter = new events.Emitter();
});
Служит для подписки на событие определенного типа.
Принимаемые аргументы:
type {String}
– тип события, на которое производится подписка. Обязательный аргумент.- [
data {Object}
] – дополнительные данные, доступные обработчику как значение поляe.data
объекта события. fn {Function}
– функция-обработчик, вызываемая для события. Обязательный аргумент.- [
ctx {Object}
] – контекст функции-обработчика.
Возвращает объект this
.
modules.require(['events'], function(events) {
var myEmitter = new events.Emitter();
myEmitter.on('myevent', function() { console.log('foo'); });
myEmitter.emit('myevent'); // 'foo'
});
Кроме того, значением аргумента type
могут быть:
- несколько типов событий, перечисленных через пробел – чтобы установить для них общую функцию-обработчик;
modules.require(['events'], function(events) {
var myEmitter = new events.Emitter();
myEmitter.on('myevent1 myevent2', function(e) { console.log(e.type) });
myEmitter.emit('myevent1'); // 'myevent1'
myEmitter.emit('myevent2'); // 'myevent2'
});
- хеш вида
{ 'событие-1' : обработчик-1, ... , 'событие-n' : обработчик-n }
– чтобы установить сразу несколько обработчиков для разных типов событий;
modules.require(['events'], function(events) {
var myEmitter = new events.Emitter();
myEmitter.on({
myevent1 : function(e) { console.log(e.type) },
myevent2 : function(e) { console.log(e.type) }
});
myEmitter.emit('myevent1'); // 'myevent1'
myEmitter.emit('myevent2'); // 'myevent2'
});
Сказанное выше верно и для методов once
и un
.
Идентичен методу on
, но выполняется единожды – после первого события подписка удаляется.
Принимаемые аргументы:
type {String}
– тип события, на которое производится подписка. Обязательный аргумент.- [
data {Object}
] – дополнительные данные, доступные как значение поляe.data
объекта события. fn {Function}
– функция-обработчик, вызываемая для события. Обязательный аргумент.- [
ctx {Object}
] – контекст функции-обработчика.
Возвращает объект this
.
modules.require(['events'], function(events) {
var myEmitter = new events.Emitter();
myEmitter.on('myevent', function() { console.log('foo') });
myEmitter.emit('myevent'); // 'foo'
myEmitter.emit('myevent'); // обработчик не вызывается
});
Служит для удаления установленной ранее подписки на событие определенного типа.
Принимаемые аргументы:
type {String}
– тип события, подписка на которое удаляется. Обязательный аргумент.- [
fn {Function}
] – удаляемый обработчик. - [
ctx {Object}
] – контекст обработчика.
Метод возвращает ссылку на объект this
.
modules.require(['events'], function(events) {
var myEmitter = new events.Emitter(),
shout = function() { console.log('foo') };
myEmitter.on('myevent', shout);
myEmitter.emit('myevent'); // 'foo'
myEmitter.un('myevent', shout);
myEmitter.emit('myevent'); // обработчик не вызывается
});
Служит для генерации события.
Метод вызывает все функции-обработчики, заданные для события.
Принимаемые аргументы:
type {String|events:Event}
– генерируемое событие в виде строки или готового объекта события. Обязательный аргумент.- [
data {Object}
] – дополнительные данные, доступные как второй аргумент функции-обработчика.
Возвращает объект this
.
modules.require(['events'], function(events) {
var myEmitter = new events.Emitter();
myEmitter.on('myevent', function(e, data) { console.log(data) });
myEmitter.emit('myevent', 'ololo'); // 'ololo'
});
Набор и сигнатуры статических методов идентичны набору и сигнатурам методов объекта, инстанцируемого классом.