Программирование на основе событий - node.js, Java

Question

Я прихожу из Java, но в последнее время я делаю некоторые Node.js и смотрю на модуль EventEmitter в узле.

То, что я не понимаю, является фундаментальной разницей между программированием, управляемым событиями, и «регулярным» программированием.

Вот несколько psuedo-кода, чтобы продемонстрировать мою идею программирования, управляемого событиями.

EventEmitter ee = new EventEmitter(); 
Function f = new SpecialFunction(); 

ee.on('grovel',f); 

ee.emit('grovel'); //calls function 'f' 

единственная работа объект EventEmitter, кажется, делает это создание хэш-связь между строковым представлением события (в данном случае «пресмыкаться») и функцию реагировать с. Похоже на это, не так много волшебства.

Однако мой вопрос: как программирование, управляемое событиями, действительно работает за кулисами с событиями низкого уровня, такими как щелчки мыши и ввод текста? Другими словами, как сделать клик и превратить его в строку (например, «grovel») в нашей программе?

Answer 1

Хорошо. Я займусь этим.

Существует несколько основных причин использования излучателей событий.

Одна из основных причин заключается в том, что браузер, в котором родился JavaScript, иногда заставляет вас. Независимо от того, подключаете ли вы свои события прямо в свой HTML, используя jQuery или какую-либо другую инфраструктуру/библиотеку или что-то еще, базовый код по-прежнему в основном тот же (erm, в основном ...)

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

<div onclick="myFunc(this)">Click me</div> 

... или вы могли бы сделать то же самое в JS с помощью DOM ссылка:

document.getElementById('my_element').onclick = function (evt) { 
    alert('You clicked me'); 
}; 

Это был основной способ, которым мы подключили u p кликов. Одним из смертельных недостатков этого шаблона является то, что вы можете присоединить только один обратный вызов к каждому событию DOM. Если вы хотите иметь второй обратный вызов, который реагировал на одно и то же событие, вам нужно либо объединить его в существующий обработчик кликов, либо создать функцию делегата для обработки задания вызова двух функций. Кроме того, ваш эмитент событий в конечном итоге тесно связан с прослушивателем событий, и это, как правило, плохо.

Поскольку приложения стали более сложными, имеет смысл использовать прослушиватели событий. производители браузеров (в конечном счете) поселились на одном пути, чтобы сделать это:

// Build the handler 
var myHandler = function (evt) { 
    alert('You clicked me too'); 
    window.myHandlerRef = this; // Watch out! See below. 
}; 

// Bind the handler to the DOM event 
document.getElementById('my_element').addEventListener('click', myHandler); 

Преимущество этой модели в том, что вы можете прикрепить несколько обработчиков для одного события DOM, или вызвать один единственный обработчик события из нескольких различных событий DOM , Недостаток заключается в том, что вы должны быть осторожны, чтобы не просачиваться: в зависимости от того, как вы их пишете, закрытие событий (например, myHandler выше) может продолжаться и после того, как элемент DOM, к которому они были прикреплены, был уничтожен и GCed. Это означает, что всегда полезно делать removeEventListener('click', myHandler). (В некоторых библиотеках есть метод off(), который делает то же самое).

Эта модель хорошо работает для событий клавиатуры, а также:

var giveUserAHeadache = function (evt) { 
    alert('Annoying, isn\'t it?'); 
}; 

document.addEventListener('keypress', giveUserAHeadache); 

Хорошо.Так вы обычно обрабатываете собственные события браузера. Но разработчикам также нравится использовать этот шаблон делегирования событий в своем собственном коде. Причина, по которой вы захотите сделать это, - это максимально возможное разделение кода.

Например, в пользовательском интерфейсе вы можете запускать событие каждый раз, когда браузер пользователя переходит в автономный режим (например, вы можете посмотреть navigator.onLine). Возможно, у вас может быть зеленая/красная лампа на заголовке вашей страницы, чтобы показать онлайн-состояние, и, возможно, вы можете отключить все кнопки отправки в автономном режиме и, возможно, также показывать предупреждающее сообщение в нижнем колонтитуле страницы. С помощью прослушивателей/излучателей событий вы можете записать все эти файлы как полностью развязанные модули, и они все равно могут работать в режиме блокировки. И если вам нужно реорганизовать свой пользовательский интерфейс, вы можете удалить один компонент (например, лампу), заменить его чем-то другим, не беспокоясь о том, чтобы вставить логику в какой-то другой модуль.

В качестве другого примера, в приложении Node вы можете захотеть, чтобы ваш код базы данных выдавал условие ошибки конкретному контроллеру, а также регистрировал ошибку - и, возможно, отправил электронное письмо. Вы можете видеть, как эти вещи могут быть добавлены итеративно. С прослушивателями событий это легко сделать.

Вы можете написать свой собственный или использовать любой шаблон, доступный в вашей конкретной среде. У jQuery, Angular, Ember и Node есть свои особые методы, но вы также можете создавать свои собственные, что я и хотел бы предложить вам попробовать.

Это все варианты одной и той же базовой идеи, и есть много размытия над точным определением или самой правильной реализацией (на самом деле, некоторые могут задаться вопросом, если они вообще разные). Но вот основные виновники:

1. Observer
2. Pub-Sub
3. Mediator