Определение и использование собственных событий в JavaScript

Метки: javascript

Визначення і використання власних подій в Javascript Визначення і використання власних подій в Javascript
JavaScript defining and using custom events JavaScript defining and using custom events

Что еще за собственные события?
По простому, собственные события это события, которые вы считаете настолько важными, что хотите выполнять определенное действие по возникновению этого события. Ничего не понятно? Да, мне кажется, что я даже самого себя запутал. Собственное событие, это как родные события (onclick, onload и т.д.) за исключением того, что вы сами определяете, при каких условиях они должны срабатывать.
Некоторые уже существующие решения прибегают к использованию библиотеки Yahoo User Interface (YUI). Я не использую YUI. Я написал простой класс, он независим от библиотеки и позволяет вам реализовывать собственные события.

Класс
Вот простой класс JavaScript, который будет базой для создания наших собственных событий.
Убрать подсветку кода
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
var CustomEvent = function() {
    //имя события
    this.eventName = arguments[0];
    var mEventName = this.eventName;
 
    //функция, которая вызывается при событии
    var eventAction = null;
 
    //привязываем функцию к событию
    this.subscribe = function(fn) {
        eventAction = fn;
    };
 
    //выполнение события
    this.fire = function(sender, eventArgs) {
        this.eventName = eventName2;
        if(eventAction != null) {
            eventAction(sender, eventArgs);
        }
        else {
            alert('К событию ' + mEventName + ' не была привязана ни одна функция!');
        }
    };
};

Итак, у нас есть класс, который определяет названия событий, привязывает выполняемые функции к событиям, и метод для выполнения события. Все довольно просто.

Простой пример
Вот простой пример установки собственного события.
Убрать подсветку кода
1
2
3
4
var myEvent = new CustomEvent("my event");
myEvent.subscribe(function(sender, eventArgs) {
    alert(eventArgs.message);
});

Этот код создаст сущность CustomEvent и присвоит ей имя “my event”, весьма креативное название :). Затем, с помощью метода он привязывает функцию к событию. Функция, которую назначили к событию, выдаст окно alert со значением аргумента события. Отправитель и eventArgs смогут пройти когда будет вызвано событие. Мы посмотрим на это далее.

Вызов события
Напоследок, мы вызовем событие. Это может быть сделано в любом месте вашего приложения.
Убрать подсветку кода
1
2
3
myEvent.fire(null, {
    message: 'вы только что вызвали собственное событие под названием ' + this.eventName + '!'
});

Мы присвоили значение null для аргумента в котором указывается отправитель, так как у нас нет инициатора события в этом случае. Например, если вы создали это событие в приложении фото галереи и вызываете каждый раз при увеличении фотографии (onEnlarge?), вы, наверное, сделаете отправителем объект фотографии, которая была увеличена. Это позволило бы вам пропускать фото в ваш метод для увеличения изнутри события.

Возможности безграничны
И, наконец, мы присваиваем значение к сообщению. Заметьте, что eventArgs это объект JavaScript ({} или new Object()). Это важно для понимания того как правильно использовать eventArgs.
Успешного Вам создания событий.

Оригинал: JavaScript defining and using custom events

Рейтинг: 12345   << Вы можете поставить оценку этой статье


Подобные статьи:
   Понимание области видимости в объектно-ориентированном JavaScript
   Продвинутая отладка в JavaScript
   Анимация фонового изображения с помощью jQuery


Обсуждение статьи:

 
vl [2013-04-26]
Скрипт не работает. Ошибка в строке 16: eventName2 - не определено


asPrgkjc1o [2016-04-16]
<a href=http://buytrazodone.racing/>trazodone</ a>


Serg [2016-07-30]
А можно создать соьственный инициатор события? например вызывать функфию при изменении iframe.src


npavelDymn [2017-02-06]
Наш сервис предоставляет настоящие лайки на фотографии заказчиков, которые готовы платить за качество.

Именно для этого мы и набираем удалённых сотрудников, которые будут выполнять работу, то есть ставить лайки и зарабатывать за это деньги.

Чтобы стать нашим удалённым сотрудником и начать ставить лайки, зарабатывая при этом 45 рублей за 1 поставленный лайк,

достаточно просто зарегистрироваться на нашем сервисе. > like.zarplatt.ru <

Вывод заработанных средств ежедневно в течении нескольких минут.


lpavelDymn [2017-02-13]
Наш сервис предоставляет настоящие лайки на фотографии заказчиков, которые готовы платить за качество.

Именно для этого мы и набираем удалённых сотрудников, которые будут выполнять работу, то есть ставить лайки и получить за это деньги.

Чтобы стать нашим удалённым сотрудником и начать ставить лайки, зарабатывая при этом 45 рублей за 1 поставленный лайк,

Вам достаточно просто пройти регистрацию на нашем сервисе. > like.zarplatt.ru <

Вывод заработанных средств ежедневно в течении нескольких минут.


rnikaDymn [2017-02-15]
Пройдите 1 регистрацию, сделайте 2 действия
и получайте от 8950 рублей каждые сутки в автоматическом режиме.

Мы гарантируем:
- Первый заработок в течении 60 минут.
- Стабильный доход 24 часа в сутки.
- Поступление денег без задержек.
- Для России, стран СНГ и Европы.
- Без вложений и установки ПО.
- Специально для новичков и людей без опыта.

Более подробная информация на нашем сайте. ( http://prosto.zarplatt.ru/ )


lpavelDymn [2017-02-20]
Наш сервис предоставляет настоящие лайки на фото заказчиков, которые готовы платить за качество.

Именно для этого мы и набираем удалённых сотрудников, которые будут выполнять работу, то есть ставить лайки и зарабатывать за это деньги.

Чтобы стать нашим удалённым сотрудником и начать ставить лайки, зарабатывая при этом 45 рублей за 1 поставленный лайк,

достаточно просто зарегистрироваться на нашем сервисе. > www.like.zarplatt.ru <

Вывод заработанных средств ежедневно в течении нескольких минут.


 

Оставить комментарий:

Имя


E-mail


Сообщение