在 jQuery 中，$.myFunction 和 $.fn.myFunction 有什么区别? [英] in jQuery what is the difference between $.myFunction and $.fn.myFunction?

问题描述

我正在钻研为 jQuery 编写插件，并试图了解 $.f 和 $.fn.f 之间的区别

I'm delving into writing plugins for jQuery and I'm trying to understand the distinction between $.f and $.fn.f

我见过插件作者同时使用两者，或者有时分配 $.f = $.fn.f

I've seen pluggin authors use both, or sometimes assign $.f = $.fn.f

有人可以向我解释一下这个，推理，好处等吗?

Can someone explain this to me, reasoning, benefits, etc?

推荐答案

看一下jQuery源码就明白了.顺便说一句，jQuery 和 $ 指的是同一个对象，这就是 jQuery 对象的定义方式:

Looking at the jQuery source code will clear things up. By the way, jQuery and $ refer to the same object, and this is how the jQuery object is defined:

var jQuery = function( selector, context ) {
    return new jQuery.fn.init( selector, context );
}

jQuery 是一个函数，在 Javascript 中，函数也是 Function 类型的对象.所以 jQuery.f 或 $.f 将 f 附加到 jQuery Function 对象上，或者称它为 jQuery 类如果你愿意的话.

jQuery is a function and in Javascript, a function is also an object of the type Function. So jQuery.f or $.f attaches f to the jQuery Function object, or call it the jQuery class if you will.

如果你查看 jQuery 的源代码，你会发现 jQuery.prototype 已被分配给 jQuery.fn

if you look at jQuery's source, you'll see that jQuery.prototype has been assigned to jQuery.fn

jQuery.fn = jQuery.prototype

因此，每当您将方法(或属性)附加到 jQuery.fn 时，如 jQuery.fn.f = .. 或 $.fn.f = ..，或 jQuery.prototype.f = ..，或 $.prototype.f = ..，该方法将可用到这个 jQuery 类的所有实例(同样，Javascript 中没有类，但它可能有助于理解).

So, whenever you attach a method (or property) to jQuery.fn, as in jQuery.fn.f = .., or $.fn.f = .., or jQuery.prototype.f = .., or $.prototype.f = .., that method will be available to all instances of this jQuery class (again, there are no classes in Javascript, but it may help in understanding).

每当您调用 jQuery() 函数时，如在 jQuery("#someID") 中，都会在此行创建一个新的 jQuery 实例:

Whenever you invoke the jQuery() function, as in jQuery("#someID"), a new jQuery instance is created on this line:

return new jQuery.fn.init( selector, context );

这个实例有我们附加到原型的所有方法，但没有直接附加到 Function 对象的方法.

and this instance has all the methods we attached to the prototype, but not the methods that were attached directly to the Function object.

如果您尝试调用未在正确位置定义的函数，您将收到异常.

You will get an exception if you try calling a function that wasn't defined at the right place.

$.doNothing = function() {
    // oh noez, i do nuttin
}

// does exactly as advertised, nothing    
$.doNothing();

var jQueryEnhancedObjectOnSteroids = $("body");
// Uncaught TypeError: Object #<an Object> has no method 'doNothing'
jQueryEnhancedObjectOnSteroids.doNothing();

---

哦，最后把长线剪短并回答您的问题 - 执行 $.f = $.fn.f 允许您将该函数用作插件或实用方法(用 jquery 术语).

---

Oh, and finally to cut a long thread short and to answer your question - doing $.f = $.fn.f allows you to use the function as a plugin or a utility method (in jquery lingo).

这篇关于在 jQuery 中，$.myFunction 和 $.fn.myFunction 有什么区别?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！