在jquery $({})中包装普通的javascript对象

Question

我从一本书中读到了这段代码.并且想要了解$({})它的用途和用途.

我尝试在几个搜索引擎上搜索,甚至在SO上搜索.$({})不是一个搜索友好的术语.

    var Events = {
       bind: function(){
          if ( !this.o ) this.o = $({});
          this.o.bind.apply(this.o, arguments);
       },

       trigger: function(){
          if ( !this.o ) this.o = $({});
          this.o.trigger.apply(this.o, arguments);
       }
    };

我确实找到了类似的问题,$([])但我不认为这是完全相同的.

Answer 1

您只是将一个基本的javascript对象包装为jQuery对象.

从jquery文档:

使用普通对象

目前,jQuery包装的普通JavaScript对象支持的唯一操作是:.data(),. prop(),. bind(),. unbind(),. turigger()和.triggerHandler().一个普通的对象上的使用.数据的()(或任何需要的方法.数据())将导致所谓的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('eventName'),它将在对象上搜索'eventName'属性,并在执行任何附加的jQuery处理程序后尝试执行它.它不会检查属性是否为函数.为避免此行为,应改为使用.triggerHandler('eventName').

$foo.triggerHandler('eventName'); // also logs 'eventName was called'

这是一个(不是很有用)的例子:

?var a =$({});
a.data('b', 3);
console.log(a.data('b')); // this prints 3

如果你跟上创建了对象$({}),你可以使用它作为被叫为data,bind,等等.这可能是您可以制作的最小的非DOM可保持jquery对象.