将空对象传递给jQuery函数

在阅读Ben Alman的Pub / Sub库时,我对第一行将一个空对象传递给jQuery函数感到困惑。 此外,他使用绑定函数对象只是将它应用于几乎“空”的对象(我使用firebug来检查该对象,它只返回一个jQuery对象包含空对象)。 有人可以为我解释这个逻辑吗? 非常感谢! P / S:我理解非框架上下文中Pub / Sub模式背后的用法和想法,只是不了解它在jQuery中的实现。

这是我读过的图书馆代码:

(function($){ var o = $({}); $.subscribe = function() { o.bind.apply( o, arguments ); }; $.unsubscribe = function() { o.unbind.apply( o, arguments ); }; $.publish = function() { o.trigger.apply( o, arguments ); }; })(jQuery); 

当您创建元素的jQuery对象时…最终对象包括所有jQuery方法

简化示例:

 { element: 'div' jQuery:{ hide:function(){}, animate:function(){} on:function(){} } } 

演示代码中的空对象用于执行相同的操作。 一旦它被包装在$()就可以将jQuery事件处理程序绑定到它,因为该对象包含许多jQuery方法(不是全部)作为属性

你可以写:

 o.on('myCustomeEvent',doSomething); 

在代码的另一部分

 o.trigger('myCustomeEvent'); 

它只是一种创建某种空容器来存储事件处理程序的方法。

一些jQuery方法也可用于DOM元素以外的对象,如jQuery文档[docs]中所述

使用普通对象

目前,jQuery包装的普通JavaScript对象支持的唯一操作是: .data() .prop() .unbind() .trigger() .triggerHandler() .trigger().triggerHandler() 。 在普通对象上使用.data() (或任何需要.data()方法)将在对象上生成一个名为jQuery{randomNumber}的新属性(例如jQuery123456789 )。

 // define a plain object var foo = {foo:'bar', hello:'world'}; // wrap this with jQuery var $foo = $(foo); // test accessing property values var test1 = $foo.prop('foo'); // bar // test setting property values $foo.prop('foo', 'foobar'); var test2 = $foo.prop('foo'); // foobar // test using .data() as summarized above $foo.data('keyName', 'someValue'); console.log($foo); // will now contain a jQuery{randomNumber} property // test binding an event name and triggering $foo.bind('eventName', function (){ console.log('eventName was called'); }); $foo.trigger('eventName'); // logs 'eventName was called' 

[…]

.trigger文档[docs]

.trigger()方法可用于jQuery集合,它们包含类似于pub / sub机制的纯JavaScript对象; 触发事件时,将调用绑定到对象的任何事件处理程序。

这正是代码中发生的事情:

  • var o = $({}); 从空的普通对象创建一个jQuery对象。
  • o.bind.apply( o, arguments ); 将事件处理程序绑定到该对象。
  • o.trigger.apply( o, arguments ); 触发绑定到该对象的事件处理程序。