十年网站开发经验 + 多家企业客户 + 靠谱的建站团队
量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决
这篇文章给大家分享的是有关jquery中什么被誉为工厂函数的内容。小编觉得挺实用的,因此分享给大家做个参考。一起跟随小编过来看看吧。
创新互联公司专注于企业全网整合营销推广、网站重做改版、济水街道网站定制设计、自适应品牌网站建设、HTML5建站、成都商城网站开发、集团公司官网建设、成都外贸网站建设、高端网站制作、响应式网页设计等建站业务,价格优惠性价比高,为济水街道等各大城市提供网站开发制作服务。
jquery中被誉为工厂函数的是“$()”,它本质上就是一个DOM对象,但是它所使用的方法都封装在了jQuery上,所以我们不能通过“$()”来使用JavaScript的方法,同样DOM对象也不能使用jQuery上的方法。
jquery中被誉为工厂函数的是“$()”。在jQuery中,无论我们使用哪种类型的选择符都需要从一个“$”符号和一对“()”开始。
“$”是jQuery“类”的一个别称,$()构造了一个jQuery对象;所以,“$()”可以叫做jQuery的构造函数。
工厂函数“$()”本质上就是一个DOM对象,但是它所使用的方法都封装在了jQuery上,所以我们不能通过“$()”来使用JavaScript的方法,同样DOM对象也不能使用jQuery上的方法。
我们以$为开始,引出整个jQuery的架构
以jQuery的1.11.3版本举例,$作为一个函数名出现的地方是在源码的最后:
window.jQuery = window.$ = jQuery;
其中的jQuery是前面定义的一个函数,在源码第70行中出现
jQuery = function( selector, context ) { // The jQuery object is actually just the init constructor 'enhanced' // Need init if jQuery is called (just allow error to be thrown if not included) return new jQuery.fn.init( selector, context ); }
这个函数相当于一个工厂函数,它内部返回了一个对象,这样就可以不用new的方式创建jQuery对象了
所以new $().xxx 和 $().xxx 就没有区别了,这也符合jQuery的设计理念“write less, do more”
在源码第2882行中:
// Give the init function the jQuery prototype for later instantiation init.prototype = jQuery.fn;
init的原型对象替换为jQuery.fn,其实就是替换成了jQuery这个函数自己的原型对象jQuery.prototype
在源码89行中:
jQuery.fn = jQuery.prototype
这样做我们可以很方便的写jQuery的扩展方法
举个例子:
jQuery.fn.alertMsg = function(msg){ alert('msg'); }
使用:
$().alertMsg('Hello World!');
jQuery的整体架构到这里就差不多了
下面是一个简化版的jQuery架构,便于理解
(function () { function jQuery(selector) { return new jQuery.prototype.init(selector); } // jQuery对象的构造函数 jQuery.prototype.init = function (selector) { } // jQuery原型上的css方法 jQuery.prototype.css = function (config) { } // 将jQuery原型上的方法都放到init的原型链上 jQuery.prototype.init.prototype = jQuery.prototype; window.$ = window.jQuery = jQuery; })();
关系图解:
感谢各位的阅读!关于jquery中什么被誉为工厂函数就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到吧!