zoukankan      html  css  js  c++  java
  • [转] jQuery源码分析-如何做jQuery源码分析

    jQuery源码分析系列(持续更新)

    jQuery的源码有些晦涩难懂,本文分享一些我看源码的方法,每一个模块我基本按照这样的顺序去学习。

    当我读到难度的书或者源码时,会和《如何阅读一本书》结合起来进行学习。推荐读读这本书,你可以从这里这里下载。

    第一部分:检视阅读

    1. 收集参考资料:官方文档、书籍、百度/谷歌,专题/博客等,快速的浏览,对涉及的知识点、范围、深度、是否有参考意义等有大致的了解和判断,知道这些文章的作者想要解释或解决什么问题。

    第二部分:分析阅读

    2. 细读官方文档,官方有非常详细的文档说明,随手打开翻译工具,不懂的单词及时查证,不要一开始就去读中文API,因为很多是机器翻译;读懂官文之后,再与中文API相互印证,加深理解。

    3. 验证官方示例

    打开Firebug或Chrome的调试工具,在控制台中输入命令进行验证;或者打开http://jsfiddle.net/,手动输入HTML、CSS、JavaScript;如果是AJAX,就去搭建自己的服务器和服务端程序。

    到这一步,对API的功能、用法用已经初步掌握,保持这个学习习惯,可以很快成为一名jQuery熟练工。但这还是初级阶段,不过是掌握了一些知识(what)、知道了如何应用(how),还弄不清这些API的背后是如何设计和实现的(why);不过有了前边的基础准备工作,终于可以开始读源码了。

    4. 开始读源码

    首先把模块的结构整理出来,从整体理解,比如总体架构Event源码结构

    接下来是边读边加注释,对每行代码每个函数调用都要字斟句酌吹毛求疵,觉得有趣的、惊艳的、疑问的、坑爹的、猜测、启发、联想等等,详细的把这些思考的过程和结果记录下来(放心吧jQuery值得你花时间这么做,你会体会到其中的乐趣,并很快发现这么做是有价值的);

    边读边注释的过程中,设计一些测试用例,在调试工具(我发现Chrome比Firebug好用多了)中设置断点,通过单步调试来检验纠正我的理解;

    最后,总结出API的实现思路关键代码,这是这一步最重要的2个成果。

    我总结的经验是,自己主动努力分析,不要去看别人的分析。原因吗,比如版本问题、作者的水平和耐心等,最重要的是我发现,在读懂源码之前我经常读不懂这些文章。

    第三部分:主题阅读

    5. 大量阅读相关的网文和书籍(第1步收集的资料),重点阅读相同主题的分析文档,网上常问的问题等,在阅读的过程中不断修正和完善自己的理解。

    同样需要不停的debug。

    6. 写一篇应用教程(优秀的应用教程已经很多了,有时间也会写写,但不多)。

    7. 写一篇源码分析,记录自己的心得,加深理解和记忆。

    分析jQuery源码是成长为中级JSer的一条捷径,希望对大家能有所启发。

    原文:http://www.cnblogs.com/nuysoft/archive/2011/12/08/2280855.html


    作者:狂流
    出处:http://www.cnblogs.com/kuangliu/
    欢迎转载,分享快乐! 如果觉得这篇文章对你有用,请抖抖小手,推荐一下!

  • 相关阅读:
    Android视图动画集合AndoridViewAnimations
    调整窗口大小时进行页面刷新(设定定时器)
    通过拖动来变换元素顺序
    jquery的input:type=file实现文件上传
    ajax请求的data数据格式
    Cookie的新增,设置与清除
    比较两个对象是否一样的代码
    5.3日,7:20开始 阮一峰js的早课学习
    在线代码编辑器使用案例代码
    layui当点击增加的时候,将form中的值获取的添加到table行中代码
  • 原文地址:https://www.cnblogs.com/kuangliu/p/4466241.html
Copyright © 2011-2022 走看看