废话

这几天有想看源码的想法,于是就开始了源码的研究,经过几天的摸索发现看源码还是有点技巧在里面的,想着把这些东东写下来作为一个小总结。

在一个多月前我对Vue源码进行了一次研究,那时看源码的方式基本上是从上往下看,结果看着看着就看不下去了,后来找了一个很老的版本看,但看的还是不太懂,于是想着干脆看一些工具类得了,因为工具类一般比较单一不会和上下文有太多的联系,有点基本都能看懂。

不管是什么源码其研究方式基本上都是大同小异的,标题写jQuery是因为这几天正好在研究jQuery源码,这里就拿jQuery作为讲解的对象。

基本步骤

研究源码的第一步找到源码的入口,找源码的入口可以通过打断点的方式找到,比如像下面这样

  1. <script src="dist/jquery.js"></script>
  2. <script>console.log($())</script>

然后我们打开Chrome浏览器给console.log($())这行打个断点,如下图

通过以上方法我们找到了入口,剩下的就是跟着调试器看看这些代码怎么执行的。

对于某个特定的方法我们也可以通过打断点的方式来看这些代码大概是在做什么,比如jQuery中的extend方法

打断点不仅仅是用来调试的,还可以当作学习的工具。通过打断点的方式可以使我们对程序的执行过程以及依赖关系有个粗略的了解。

但不管是方法还是技巧它都只能解决我们的一部分问题,要真正的看懂和理解源码还存在很多其他因素。

闲扯

看源码这件事吧,不要抱着一次就能看懂的心态去学,其实想想我们看源码不就是为了学习嘛,不一定说要全部都看懂,只要比之前进步一点也很不错啊,这样压力会小点吧,有时压力太大就不想学了。

源码可以从不同的角度去看,从架构,从细节、又或是某些工具方法,如果技术不太好我们可以先从工具类方法看起,对一些复杂的方法可以先忽略一些细节先搞清楚它是干什么的,这何尝不是一种方法。

jQuery源码研究——怎么看源码的更多相关文章

  1. 没必要看源码。。把文档学通就已经牛逼了(我们大多还是在应用层,还达不到研究的程度。附class与examples大全链接)

    [学霸]深圳-鑫 2017/7/11 13:54:07只是学习怎么用QT的话,不用看源码.看帮助文档就很好要学习编码风格与思路,就看看源码 [学神]武汉-朝菌 2017/7/11 13:54:39没必 ...

  2. underscore.js源码研究(1)

    概述 很早就想研究underscore源码了,虽然underscore.js这个库有些过时了,但是我还是想学习一下库的架构,函数式编程以及常用方法的编写这些方面的内容,又恰好没什么其它要研究的了,所以 ...

  3. zepto源码研究 - zepto.js - 1

    简要:网上已经有很多人已经将zepto的源码研究得很细致了,但我还是想写下zepto源码系列,将别人的东西和自己的想法写下来以加深印象也是自娱自乐,文章中可能有许多错误,望有人不吝指出,烦请赐教. 首 ...

  4. jdk源码研究1-HashMap

    今天开始,研读下jdk的常用类的一些源码,下面是jdk中HashMap的研究.诚然,网上已经很多这方面的总结了,但是,个人只是想单纯地把自己的理解过程进行记录,大牛们就绕路吧,当然,欢迎扔砖头.下面是 ...

  5. dubbo源码研究(一)

    1. dubbo源码研究(一) 1.1. dubbo启动加载过程 我们知道,现在流行注解方式,用spring管理服务,dubbo最常用的就是@Reference和@Service了,那么我首先找到这两 ...

  6. 从壹开始前后端分离 [ vue + .netcore 补充教程 ] 二八║ Nuxt 基础:面向源码研究Nuxt.js

    前言 哈喽大家周五好,又是一个开开心心的周五了,接下来就是三天小团圆啦,这里先祝大家节日快乐咯,希望都没有加班哈哈,今天公司发了月饼,嗯~时间来不及了,上周应该搞个活动抽中几个粉丝发月饼的,下次吧,这 ...

  7. 从源码的角度看 React JS 中批量更新 State 的策略(下)

    这篇文章我们继续从源码的角度学习 React JS 中的批量更新 State 的策略,供我们继续深入学习研究 React 之用. 前置文章列表 深入理解 React JS 中的 setState 从源 ...

  8. underscore.js源码研究(8)

    概述 很早就想研究underscore源码了,虽然underscore.js这个库有些过时了,但是我还是想学习一下库的架构,函数式编程以及常用方法的编写这些方面的内容,又恰好没什么其它要研究的了,所以 ...

  9. underscore.js源码研究(5)

    概述 很早就想研究underscore源码了,虽然underscore.js这个库有些过时了,但是我还是想学习一下库的架构,函数式编程以及常用方法的编写这些方面的内容,又恰好没什么其它要研究的了,所以 ...

随机推荐

  1. Zigbee Class 直播公告2016-10-10

    周一我们将开始本期课程的首次直播, 详情如下: 场次 第一场 阶段 入门 开始时间 2016-10-10  19:00 结束时间 不定 斗鱼地址 douyu.com/zigbeeclass 内容 本期 ...

  2. 算法-java代码实现快速排序

    快速排序 对于一个int数组,请编写一个快速排序算法,对数组元素排序. 给定一个int数组A及数组的大小n,请返回排序后的数组. 测试样例: [1,2,3,5,2,3],6 [1,2,2,3,3,5] ...

  3. C#编写影院售票系统(A project with a higher amount of gold )(2:相关代码)

    此篇文章为项目代码,,,需要项目需求 ,思路分析与窗体效果请访问:http://www.cnblogs.com/lsy131479/p/8367304.html 项目类图: 影院类: using Sy ...

  4. Block 的使用时机

    Block 一般是用来表示.简化一小段的程式码,它特别适合用来建立一些同步执行的程式片段.封装一些小型的工作或是用来做为某一个工作完成时的回传呼叫(callback) . 在新的iOS API中blo ...

  5. sql子查询

    一.子查询入门: 1.单值子查询: 单值子查询的唯一限制:子查询的返回值必须只有一行记录,而且只能有一列(又被称为标量子查询). 可以使用在select语句的列表.表达式中,以及where语句中等. ...

  6. Selenium滚动条window.scrollTo和window.scrollBy

    Selenium操作滚动条有两种方法,一种就是window.scrollTo,另一种是window.scrollBy,既然两个都可以用来操作滚动条,那这两个方法有什么区别呢? 1.window.scr ...

  7. Xcode 单元测试

    项目创建后自动创建的单元测试文件夹, 文件夹名为项目名+tests, xcode6后貌似没有选择是否添加测试target的选择了. 默认生成的如下图 提供的断言如下 typedefNS_ENUM(NS ...

  8. Vuejs 安装与配置

    1.全局安装 vue-cli $ npm install --global vue-cli 2.创建一个基于 webpack 模板的新项目 $ vue init webpack my-project ...

  9. jQuery给input绑定回车事件

    dataInput为Span元素ID <script type="text/javascript" src="Scripts/jquery-1.6.2.js&quo ...

  10. python_冒泡算法

    什么是冒泡算法? -- 像鱼吐泡泡一样,每次都是向上冒出一个水泡 如何逻辑整理? -- 先拿第一个值和剩下的值,一一比较,必能找到最大的或者最小的 -- 比较过程中,第一个值小于剩下的某个值,交换位置 ...