读jQuery源码有感
读之前的预备工作:
1.基础的js知识,以及html和css知识,和正则表达式知识。可以参考妙味课堂的基础js,html和css大纲。
2.JavaScript核心指南的知识http://www.cnblogs.com/cnwebdeveloper/archive/2012/03/28/2421461.html
3.JavaScript设计模式的知识http://www.oschina.net/translate/learning-javascript-design-patterns?lang=chs
4.使用过jQuery
有了预备工作,阅读源码你会比较顺利。
我阅读的是2.0.3无法压缩版本,源代码有注释。
代码先从整体开始阅读,
1.搞清楚的就是它的封装方式和继承方式,
var $ =jQuery = function(){
return new jQuery.fn.init();
}
jQuery.fn = jQuery.prototype = {
init : function(){
this.length = 0;
this.test = function(){
return this.length;
}
return this;
},
jquery: "2.0.3",
length: 1,
size: function() {
return this.length;
}
}
jQuery.fn.init.prototype = jQuery.fn; //使用jQuery的原型对象覆盖init的原型对象
alert( $().jquery ); //返回"2.0.3"
alert( $().test() ); //返回0
alert( $().size() ); //返回0
jQuery有其自身的静态方法和动态添加方法。所谓静态方法,就是jQuery各个模块都会调用到的公共方法。所谓动态添加方法,就是通过jQuery自己实现的extend函数来扩展的方法,这些方法一般jQuery内部不会使用到。
2.列出它的各个模块
Sizzle选择器,DOM操作,事件操作,样式操作,ajax操作,元素运动操作,回调函数队列操作(一次性调用多个函数,或设定某个函数只能调用一次),延迟函数操作(原先ajax回调函数形式是树状,现在是线状$.ajax("test.html").done(function(){ alert("哈哈,成功了!"); }).fail(function(){ alert("出错啦!"); });),数据缓存操作
3.一行一行阅读源代码
实际阅读过程中,你会遇到的困难大都是,
- 这个正则表达式什么意思
- 这么多if else嵌套究竟想表达什么个意思,而且为什么这么写
- js语言特有的语法所表达的意思,比如双感叹号!!在js里的作用,对null与undefined用!操作符时都会产生true的结果,所以用两个感叹号的作用就在于,如果明确设置了(非null/undefined/0""/等值),自然一样的值;如果没有设置,test就会默认为false,而不是null或undefined或0。还有>>>和~这些操作符,在js里都是特殊用法。
针对这些困难,你能做的就是
- 看注释
- 自己写个小Demo,设源码断点,一步步调试来观察代码流程。(对于源码里的各种情况判断,这里要考验你的Demo完整性,间接考研你的思维缜密性)
- 看第三方人怎么解读源代码,比如http://www.cnblogs.com/aaronjs/p/3279314.html
最后,发现,读这个源代码,不需要你知道什么算法知识,甚至数据结构也可以不知道,设计模式其实也可以不去知道。
耐下心来,静下心来,有着一般的逻辑,就能看懂jQuery源码。
平凡的逻辑,也能读懂不平凡的jQuery库。
读jQuery源码有感的更多相关文章
- 读jQuery源码有感2
那么就来读读jQuery源码的Callbacks部分. 一上来看原版源码 jQuery.Callbacks = function( options ) { // Convert options fro ...
- 读jQuery源码有感3
这次的主题是,具体的库和抽象的思路. 当看到Deferred这个区块时,觉得jQuery代码设计挺复杂,得用许多脑力才能看明白. 可是把这个峰回路转十八回的代码看懂又如何,是为了使用过程中出现bug后 ...
- 【读jQuery源码有感系列一】callee
<script type="text/javascript"> /*调用自身*/ function calleeDemo() { try{ } catch (error ...
- 读jQuery源码 - Deferred
Deferred首次出现在jQuery 1.5中,在jQuery 1.8之后被改写,它的出现抹平了javascript中的大量回调产生的金字塔,提供了异步编程的能力,它主要服役于jQuery.ajax ...
- 读jQuery源码之整体框架分析
读一个开源框架,大家最想学到的就是设计的思想和实现的技巧.最近读jQuery源码,记下我对大师作品的理解和心得,跟大家分享,权当抛砖引玉. 先附上jQuery的代码结构. (function(){ / ...
- 【读fastclick源码有感】彻底解决tap“点透”,提升移动端点击响应速度
申明!!!最后发现判断有误,各位读读就好,正在研究中.....尼玛水太深了 前言 近期使用tap事件为老夫带来了这样那样的问题,其中一个问题是解决了点透还需要将原来一个个click变为tap,这样的话 ...
- 读jQuery源码 - Callbacks
代码的本质突出顺序.有序这一概念,尤其在javascript——毕竟javascript是单线程引擎. javascript拥有函数式编程的特性,而又因为javascript单线程引擎,我们的函数总是 ...
- 读jQuery源码释疑笔记2
本释疑笔记是针对自己在看源码的过程中遇到的一些问题的解答,对大众可能不具有参考性,不过可以看看有没有你也不懂得地方,相互学习,相互进步. 1.函数init <div id="one&q ...
- 读jQuery源码释疑笔记
本释疑笔记是针对自己在看源码的过程中遇到的一些问题的解答,对大众可能不具有参考性,不过可以看看有没有你也不懂得地方,相互学习,相互进步. 1.each的用法 之前对each的用法一直迷迷糊糊,这次终 ...
随机推荐
- 使用block的好处
1 使用block 可以轻松地绑定各处代码块,使用delete 结构是分散的,不利于变量之间传值,不像block可以随意地获取变量值. 2.使用block可以方便执行异步代码,作为异步处理回调. In ...
- How to enable TLS 1.2 on Windows Server 2008 R2
Problem How to enable TLS 1.2 on Windows Server 2008 R2? Resolution QuoVadis recommends enabling and ...
- C#调用VP 包含素材
VS2012 +VP9.0 ***************** 自己运行的时只要修改VP里面素材的路径即可 链接: https://pan.baidu.com/s/1J6Bc5FcBYLZLgqe30 ...
- Git 全局设置
Git 全局设置: git config --global user.name "ASxx" git config --global user.email "123456 ...
- jms应用
构建jms http://blog.csdn.net/haoxingfeng/article/details/9167895
- Data Center Drama 欧拉回路的应用
这题说的是给了n个点 和m条边, 这m条边是无向的,任务是将这些边变成有向的,并且添加最少的有向边使得这个图中每个点的入度为偶数, 出度为偶数. 我们可以考虑使用欧拉回路来解决这个问题,这样说,假如一 ...
- cf428c 模拟题
这题说的是给了 n个数然后又 k次 的交换任意位置的 数字的机会 计算最长的连续子序列的和 这要撸 模拟整个 过程 并不能就是算最长的递增序列 如果只是 找最长的 和序列的 话 会存在 很多问题 ...
- Visual Studio 2013旗舰版KEY
Visual Studio 2013旗舰版KEY:BWG7X-J98B3-W34RT-33B3R-JVYW9
- android实操--练习2
练习2是实现一个计算器的功能:可以加减乘除:可以倒退,可以清空文本. 下面是效果展示: -----------------------布局------------------------------- ...
- 持续集成之三:Maven私服Nexus使用
环境 Red Hat Enterprise Linux Server release 7.3 (Maipo) jdk1.7.0_80 apache-tomcat-7.0.90 mysql-5.7.23 ...