Understanding Dean Edwards' addevent JavaScript
I need help understanding this piece of code. What is the point of handler.guid
? Why is there a need for a hash table?
What is the point of:
if ( element["on" + type])
{
handlers[0] = element["on" + type];
}
What does the "this" refer to in handleEvent
, the element or the the addEvent function?
function addEvent(element, type, handler)
{
// assign each event handler a unique ID
if (!handler.$$guid) handler.$$guid = addEvent.guid++;
// create a hash table of event types for the element
if (!element.events) element.events = {};
// create a hash table of event handlers for each element/event pair
var handlers = element.events[type];
if (!handlers)
{
handlers = element.events[type] = {};
// store the existing event handler (if there is one)
if (element["on" + type])
{
handlers[0] = element["on" + type];
}
}
// store the event handler in the hash table
handlers[handler.$$guid] = handler;
// assign a global event handler to do all the work
element["on" + type] = handleEvent;
}
// a counter used to create unique IDs
addEvent.guid = 1;
function removeEvent(element, type, handler)
{
// delete the event handler from the hash table
if (element.events && element.events[type])
{
delete element.events[type][handler.$$guid];
}
}
function handleEvent(event)
{
// grab the event object (IE uses a global event object)
event = event || window.event;
// get a reference to the hash table of event handlers
var handlers = this.events[event.type];
// e开发者_高级运维xecute each event handler
for (var i in handlers)
{
this.$$handleEvent = handlers[i];
this.$$handleEvent(event);
}
}
The guid
is used to give each event a unique index, while the hash table is used to implement a dynamic dispatch table. this.$$handleEvent
refers to the element in the handler mapping table.
A callback system works by storing event handlers in an array. When the underlying event is detected the dispatch system loops through the array calling the callback functions in turn.
The jQuery Event object uses a similar structure.
References
- A Few Words on GUIDs
- When Should I Use a Dispatch Table
- Delegating All of the Things With Ruby Forwardable - Words and Code
- The Gang of Four is wrong and you don't understand delegation — Saturn Flyer
- GUIDs and UUIDs
- RFC 4122: A Universally Unique IDentifier (UUID) URN Namespace
精彩评论