前两个月项目组特别忙了,买了一本《Juqery技术内幕,深入解析Jquery架构设计与实现原理》一直放着睡大觉;进入八月份项目终于过了TR5点,算是可一个喘口气;这本书终于有时间拜读一下。下面的一两个月我将每天坚持看几页,并陆陆续续写几篇不伦不类的技术博客,谈谈自己的心得体会等等。
成都创新互联是一家集网站建设,五常企业网站建设,五常品牌网站建设,网站定制,五常网站建设报价,网络营销,网络优化,五常网站推广为一体的创新建站企业,帮助传统企业提升企业形象加强企业竞争力。可充分满足这一群体相比中小企业更为丰富、高端、多元的互联网需求。同时我们时刻保持专业、时尚、前沿,时刻以成就客户成长自我,坚持不断学习、思考、沉淀、净化自己,让我们为更多的企业打造出实用型网站。首先评价一下这本书吧,我本来想买《锋利的Jquery》,但是电子版翻了一下,感觉还是有点基础了;就在网上找找呀,终于看到了这本---《Juqery技术内幕,深入解析Jquery架构设计与实现原理》,一看作者是阿里大牛,出版时间是14年1月,感觉,应该狠不错,最起码作者比较牛,讲得东西比较新。呵呵呵。不扯淡了,开始进入正题。
第一篇Jquery整体架构。
众所周知,Jquery是业界最流行的Js库(注,有人说是框架,本人不敢苟同,只是觉得Jquery还没有到达支撑前端设计和架构的高度;别和我吵,你要非说是框架,我也认了)。有人装文艺说,Jquery的API非常精致和优雅;这个评价我想说,敢不敢从技术角度讲一讲;不要这么晦涩,弄这么高雅文艺的词汇来形容。你就说设计巧妙,架构合理,上手容易,不就结了。好了,我不喷了,接着说。整体模块可以分为三部分,入口模块,底层支持模块以及功能模块。我画了一张图,如下。
图上就整个构架做了一个概括。源码架构如下:
(function( window, undefined ) { // 构造jQuery对象 var jQuery = function( selector, context ) { return new jQuery.fn.init( selector, context, rootjQuery ); } // 工具函数 Utilities // 异步队列 Deferred // 浏览器测试 Support // 数据缓存 Data // 队列 queue // 属性操作 Attribute // 事件处理 Event // 选择器 Sizzle // DOM遍历 // DOM操作 // CSS操作 // 异步请求 Ajax // 动画 // 坐标,尺寸,大小 window.jQuery = window.$ = jQuery; })(window);
由于设计比较复杂,这里不一一介绍,待具体源码实现时,在介绍原理及使用技巧等等之类的。
打开源码库,所有代码被包裹在一个立即执行的匿名函数表达式中;
function(window,undefined){ var jQuery=...;//1 //.... ...... window.jQuery=window.$=jQuery;//2 })(window);
这样做的好处有以下几点:
1,创建了一个特殊的函数作用域(不了解的赶紧去看看作用域链,执行环境,活动对象相关的知识,这里不解释);这样在自己的执行环境中,就不会和已有的函数,方法,变量(主要指同名)以及第三方库冲突;在保证自己的代码不收其他干扰外,同时不会破坏和污染全局环境和其他执行环境的变量等。
2,window.jQuery=window.$=jQuery; 变量jQuery添加到window对象上,将JQuery添加到最顶层的全局执行环境window对象的作用域中,成为全局变量,添加到其他值执行环境的作用域链的最后端,保证其他执行环境可以访问和使用jQuery.
3,传入window对象,把window对象充当参数传入自调用匿名函数的内部,也就进入该执行环境,保证可以迅速访问到window对象(不需要沿着作用域链会退到顶层作用域);另外就是在压缩代码时进行优化。
4,传入参数undefined,一方面和传入window对象一样,能够缩短查找undefined时的作用域,并且在压缩代码时进行优化。更重要的是,确保参数undefined的值是undefined,防止被重写。、
结尾
第一篇,就这样吧,整体构架有点复杂,自己也是一边看一边写博客,大家发现不对的地方,多多提建议,共同进步。下一篇,我将介绍一下jQuery构造函数的源码,以及实现原理和里面的一些比较晦涩难懂的逻辑。
另外有需要云服务器可以了解下创新互联scvps.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。
网站题目:Jquery源码分析系列(1)--Jquery整体架构-创新互联
标题网址:http://lswzjz.com/article/dcpcjp.html