jQuery.fn和jQuery.prototype区别介绍

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了jQuery.fn和jQuery.prototype区别介绍，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含2427字，纯文字阅读大概需要4分钟。

内容图文

(function( window, undefined ) { 

var jQuery = (function() { 
// 构建jQuery对象 
var jQuery = function( selector, context ) { 
return new jQuery.fn.init( selector, context, rootjQuery ); 
} 

// jQuery对象原型 
jQuery.fn = jQuery.prototype = { 
constructor: jQuery, 
init: function( selector, context, rootjQuery ) { 
// something to do 
} 
}; 

// Give the init function the jQuery prototype for later instantiation 
jQuery.fn.init.prototype = jQuery.fn; 

// 合并内容到第一个参数中，后续大部分功能都通过该函数扩展 
// 通过jQuery.fn.extend扩展的函数，大部分都会调用通过jQuery.extend扩展的同名函数 
jQuery.extend = jQuery.fn.extend = function() {}; 

// 在jQuery上扩展静态方法 
jQuery.extend({ 
// something to do 
}); 

// 到这里，jQuery对象构造完成，后边的代码都是对jQuery或jQuery对象的扩展 
return jQuery; 

})(); 

window.jQuery = window.$ = jQuery; 
})(window); 
 
这里我们可以看到： 
 代码如下:

var jQuery = function( selector, context ) { 
return new jQuery.fn.init( selector, context, rootjQuery ); 
} 
 
jQuery 其实jQuery.fn.init()返回一个对象。那么jquery.fn.init()返回的又是什么呢？ 
 代码如下:

jQuery.fn = jQuery.prototype = { 
constructor: jQuery, 
init: function( selector, context, rootjQuery ) { 
// something to do 
} 
}; 
 
就是从这里来的，一个javascript对象。 

这里有个问题。 
 代码如下:

jQuery.fn = jQuery.prototype 
 
那么就是 将jQuery 的原型对象赋值给了 jQuery.fn。 

再看下面： 
 代码如下:

jQuery.fn.init.prototype = jQuery.fn; 
 
看到这里我有一个想法。就是 将jQuery.fn 给了 jQuery.fn.init.prototype. 

那么在这之前jQuery.fn.init.prototype.是什么？ 

是不是没有？这个时候它的原型是{}; 

那么为了可以去调用init外面的方法。就做了一个处理。 

将jQuery.fn 赋值给jQuery.fn.init.prototype.这样的话， 

jQuery.fn.init.prototype的原型也就是jQuery的原型对象就是 jQuery.fn ( 注意jQuery = function(return new jQuery.fn.init()))。 

赋值了以后。在调用的时候，当init中没有方法的时候，就会去原型函数中调用。 

那么这样的话。 

你可能会想到这样一个东东： 
 代码如下:

jQuery.extends() 
jQuery.fn.extends() 
 
我想你应该明白它们的区别了吧。 

jQuery.extends()是直接扩展jQuery.而jQuery.fn.extends()，很明显是扩展的原型。 

这就是为什么jQuery.fn.extends()中的大部分方法来自己于jQuery.extends()。 

这里又将 jQuery.fn 赋值给了 jQuery.fn.init.prototype. 

那么就有这样的一个关系： 
 代码如下:

jQuery.prototype = jQuery.fn = jQuery.fn.init.prototype 

            
            


           
                
                                                

内容总结

以上是互联网集市为您收集整理的jQuery.fn和jQuery.prototype区别介绍全部内容，希望文章能够帮你解决jQuery.fn和jQuery.prototype区别介绍所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端