Всем привет!
У многих (в том числе и у меня) возникает ситуация, когда нужно своим классам назначить какие-либо обработчики событий, а через свойство (например: onEventName) вешать их очень не удобно, особенно когда нужно повесить несколько действий на одно и то же событие.
В последнее время частенько пишу на ActionScript 3.0 и там есть класс
EventDispatcher, но всё никак не понимаю, почему до сих в JS нет такого нативного класса? Поэтому, я решил написать свою реализацию такого класса.
Подключение:
Подключение не составит особого труда, особенно если Вы не новичок в веб-разработке.
<script src="/myFolder/scripts/EventDispatcher.js"></script>
Настоятельно рекомендую подключать скрипты в head.
Документация:
Основная функция для инициализации методов в Ваш класс:
EventDispather(
self:
Object,
dontUseProto:
boolean = false):
void- self — Ссылка на Ваш не инициализированный объект класса (см. пример ниже)
- dontUseProto — Если true, то методы будут присвоены не через __proto__, - это полезно, если Вы уже наследуете что-либо другое через __proto__.
Методы (будут доступны в Вашем классе после инициализации):
addEventListener(
type:
String,
listener:
Function):
void
Регистрирует объект прослушивателя события на объекте.
- type — Тип события.
- listener — Функция прослушивателя, обрабатывающая событие. Эта функция должна принимать объект Event в качестве единственного параметра и не должна что-либо возвращать.
dispatchEvent(
event:
*,
dontUseProp:
Boolean = true):
void
Посылает событие в поток событий. Целью события является объект, для которого вызывается данный метод.
- event — Объект Event или строка, передаваемые в поток событий.
- dontUseProp — Если true, то будут срабатывать события-свойства вида oneventname. По умолчанию true.
hasEventListener(
type:
String):
Boolean
Проверяет, имеет ли объект прослушиватели, зарегистрированные для определенного типа события.
removeEventListener(
type:
String,
listener:
Function):
void
Удаляет прослушиватель из объекта. При отсутствии прослушивателя, зарегистрированного с объектом, вызов этого метода не оказывает эффекта.
- type — Тип события.
- listener — Удаляемый объект прослушивателя.
Пример:
//Создаем тестовый класс
function MyClass() {
this.bar = 'Hello world!';
}
MyClass.prototype.foo = function() {
this.dispatchEvent('foo'); //Вызываем событие "foo"
//this.dispatchEvent(new Event('foo')); //Способ вызова с объектом Event
}
/*Используйте один из ниже перечисленных способов инициализации*/
//1-й способ
EventDispatcher(MyClass);
//2-й способ
EventDispatcher(MyClass, true); //__proto__ не будет использоваться
//3-й способ
MyClass.prototype.__proto__ = EventDispatcher.prototype;
//Инициализируем класс и вешаем обработчики
var test = new MyClass();
test.addEventListener('foo', function(event) {
console.log(this.bar);
});
test.addEventListener('foo', function(event) {
console.log(this.bar);
});
test.onfoo = function(event) {
console.log(this.bar);
};
test.foo(); //Результат "Hello world!", "Hello world!", "Hello world!"
Ещё стоит отметить, что в IE9 нельзя использовать __proto__ - поэтому, 3-й способ работать не будет, а первый будет эквивалентен второму.
Сам JS-файл качайте в прикреплении.