В дополнение к последовательному объектно-ориентированному проектированию Ext JS обеспечивает простое и хорошо продуманное событийно-ориентированное проектирование. Основа всех событий в Ext JS — базовый абстрактный класс Ext.util.Observable, который предоставляет все, что нужно для работы с событиями.

Ext.util.Observable.addEvents

addEvents( Object object ) : void

Обычно вызывается в конструкторе класса, производного от Observable, метод addEvents определяет коллекцию всех событий, которые данный класс может генерировать. Однако, если разработчик попытается вызвать addListener или fireEvent для неопределенного события, то оно будет автоматически добавлено в коллекцию. Из-за этого метод в настоящее время используется только для документации.

MyClass = Ext.extend(Ext.util.Observable, {
	constructor: function() {
		this.addEvents({
			click: true,
			keyUp: true,
			keyDown: true
		});
	}
});

Ext.util.Observable.addListener / .on

addListener( String eventName, Function handler, [Object scope],
	[Object options] ): void
on( String eventName, Function handler, [Object scope],
	[Object options] ) : void

Это типичный метод addListener, он принимает параметры eventName и handler. Ленивые программисты, как я, могут сократить название метода до on. При необходимости можно передать объект scope. Есть несколько вариантов четвертого параметра:

• delay — Number — Количество миллисекунд, через которое вызовется обработчик после события.
• single — Boolean — true для обработки первого вызова, после чего прослушивание приостанавливается.
• buffer — Number — Похоже на задержку, но если событие вызывается более одного раза в течение указанного числа миллисекунд, обработчик выполняется только один раз.

Вот простейшая форма метода:

var instance = new MyClass();
instance.on(“click”, onClick);

Также можно добавить несколько обработчиков одновременно:

instance.on({
	click: onClick,
	keyUp: onKeyUp
});

Если вы фанатик, то можете добавить несколько обработчиков с параметрами:

instance.on({
	// handle the click event once
	click: {fn: onClick, single: true},
	// handle the keyUp event after a second of
	keyUp: {fn: onKeyUp, buffer: 1000}
	// no other keyUp events
});

Ext.util.Observable.removeListener / .un

removeListener( String eventName, Function handler,
	[Object scope] ) : void
un( String eventName, Function handler, [Object scope] ) : void

Этот метод приостанавливает прослушивание события eventName обработчиком handler. Если обработчик был добавлен для определенной области, вы должны указать scope, удаляя его.

Ext.util.Observable.fireEvent

fireEvent( String eventName, Object... args ) : Boolean

Этот метод вызывает событие eventName и передает указанные параметры каждому обработчику. Обработчики вызываются в том порядке, в котором они были добавлены.Если обработчик возвращает false, оставшиеся обработчики не вызываются и fireEvent возвращает false. Следующий пример вызывает передает событие click с двумя параметрами:

>if (!instance.fireEvent(“click”, 1, 2)) {
	alert(“a handler returned false”);
}

Ext.util.Observable.hasListener

hasListener( String eventName ) : Boolean

Этот метод проверяет, прослушивает ли событие обработчик eventName.

Ext.util.Observable.purgeListeners

purgeListeners() : void

Этот метод удалает всех слушателей:)

Ext.util.Observable.relayEvents

relayEvents( Observable o, Array events ) : void

Этот метод вызывает указанные события для других объектов Observable.

В следующем примере каждый раз, когда anotherInstance передает событие click или keyUp, instance тоже вызывает эти события.

instance.relayEvents(anotherInstance, [“click”, “keyUp”]);

Два объекта instance, переданные в relayEvents не могут быть одного типа.

Ext.util.Observable.suspendEvents / .resumeEvents

suspendEvents() : void
resumeEvents() : void

Метод suspendEvents предотвращает передачу событий, а resumeEvents восстанавливает нормальную работу:)

Ext.util.Observable.capture / .releaseCapture

capture( Observable o, Function fn, [Object scope] ) : void
releaseCapture( Observable o ) : void

Метод capture назначает один обработчик для всех событий указанного объекта Observable. Этот обработчик будет вызываться раньше всех остальных. Можно указать необязательный параметр scope. По сути, метод capture создает перехватчик функции fireEvent для указанного объекта.