如何读jquery源码

2024-11-05

jQuery源码研究——怎么看源码

废话这几天有想看源码的想法,于是就开始了源码的研究,经过几天的摸索发现看源码还是有点技巧在里面的,想着把这些东东写下来作为一个小总结. 在一个多月前我对Vue源码进行了一次研究,那时看源码的方式基本上是从上往下看,结果看着看着就看不下去了,后来找了一个很老的版本看,但看的还是不太懂,于是想着干脆看一些工具类得了,因为工具类一般比较单一不会和上下文有太多的联系,有点基本都能看懂. 不管是什么源码其研究方式基本上都是大同小异的,标题写jQuery是因为这几天正好在研究jQuery源码,这里就拿jQ

读jQuery源码 - Deferred

Deferred首次出现在jQuery 1.5中,在jQuery 1.8之后被改写,它的出现抹平了javascript中的大量回调产生的金字塔,提供了异步编程的能力,它主要服役于jQuery.ajax. Deferred就是让一组函数在合适的时机执行,在成功时候执行成功的函数系列,在失败的时候执行失败的函数系列,这就是Deferred的本质.简单的说,模型上可以规划为两个数组来承接不同状态的函数——数组resolve里的函数列表在成功状态下触发,reject中的函数在失败状态下触发. 本文原创于

读jQuery源码之整体框架分析

读一个开源框架,大家最想学到的就是设计的思想和实现的技巧.最近读jQuery源码,记下我对大师作品的理解和心得,跟大家分享,权当抛砖引玉. 先附上jQuery的代码结构. (function(){ //jQuery变量定义 var jQuery = function(){...}; //jQuery原型定义(包含核心方法) jQuery.fn = jQuery.prototype = {...}; //看上去很奇怪吧? 非常巧妙的设计,后面详细介绍 jQuery.fn.init.prototy

读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=

读jQuery源码 - Callbacks

代码的本质突出顺序.有序这一概念,尤其在javascript——毕竟javascript是单线程引擎. javascript拥有函数式编程的特性,而又因为javascript单线程引擎,我们的函数总是需要有序的执行.优秀代码常常把函数切割成各自的模块,然后在某一特定条件下执行,既然这些函数是有序的执行,那么我们为什么不编写一个统一管理的对象,来帮助我们管理这些函数——于是,Callbacks(回调函数)诞生. 本文原创于linkFly,原文地址,遵循MIT协议. 这篇文章主要分为以下知识什么

读jQuery源码有感2

那么就来读读jQuery源码的Callbacks部分. 一上来看原版源码 jQuery.Callbacks = function( options ) { // Convert options from String-formatted to Object-formatted if needed // (we check in cache first) options = typeof options === "string" ? ( optionsCache[ options ] |

读jQuery源码释疑笔记2

本释疑笔记是针对自己在看源码的过程中遇到的一些问题的解答,对大众可能不具有参考性,不过可以看看有没有你也不懂得地方,相互学习,相互进步. 1.函数init <div id="one"></div> str = "hello, <b>my name is</b> jQuery.", html = $.parseHTML( str ); console.log(html); var context={class:"

读jQuery源码释疑笔记

本释疑笔记是针对自己在看源码的过程中遇到的一些问题的解答,对大众可能不具有参考性,不过可以看看有没有你也不懂得地方,相互学习,相互进步. 1.each的用法之前对each的用法一直迷迷糊糊,这次终于懂了. 源码: each: function( obj, callback, args ) { var value, i = 0, length = obj.length, isArray = isArraylike( obj ); if ( args ) { if ( isArray ) { f

读jQuery源码有感3

这次的主题是,具体的库和抽象的思路. 当看到Deferred这个区块时,觉得jQuery代码设计挺复杂,得用许多脑力才能看明白. 可是把这个峰回路转十八回的代码看懂又如何,是为了使用过程中出现bug后,容易调试吗?还是重新造个轮子? 我觉得需求撑大的库,当你不知道它撑大的历史,而贸然阅读,容易一头雾水. 所以从简单的具体开始, 1.没有参数传递,只有第一个函数有定时器的情况 <!DOCTYPE html> <html> <head> <meta charset=&

读jQuery源码 jQuery.data

var rbrace = /(?:\{[\s\S]*\}|\[[\s\S]*\])$/, rmultiDash = /([A-Z])/g; function internalData( elem, name, data, pvt /* Internal Use Only */ ){ //如果elem元素不能附加值,退出 if ( !jQuery.acceptData( elem ) ) { return; } // ## form core.js // Unique for each copy

读jQuery源码释疑笔记3

1.在jQuery.fn=jQuery.prototype中定义了方法:init, map, each , toArray, get, pushStack, ready, slice,first, last, eq, map,end; 属性:jquery, constructor, selector, length, push, sort, splice(后三者仅供内部使用). 2.通过jQuery.fn.init.prototype = jQuery.fn;避免了this的混乱.这样看

【读jQuery源码有感系列一】callee

jQuery源码解读 --- 整体架构

最近学习比较忙,感觉想要提高还是要读源码,所以准备考试这个考试结束就开始读jquery源码啦,加油~

读艾伦的jQuery的无new构建，疑惑分析——jquery源码学习一

背景: 有心学习jquery源码,苦于自己水平有限,若自己研究,耗时耗力,且读懂之日无期. 所以,网上寻找高手的源码分析.再经过自己思考,整理,验证.以求有所收获. 此篇为读高手艾伦<jQuery 2.0.3 源码分析core - 整体架构>后所作,万分感谢作者. 材料: 1.原文地址 2.jquery版本: jquery2.0.3(我用的是jquery1.8.3,好像出入不大) 困惑一: 图一

jQuery源码学习感想

还记得去年(2015)九月份的时候,作为一个大四的学生去参加美团霸面,结果被美团技术总监教育了一番,那次问了我很多jQuery源码的知识点,以前虽然喜欢研究框架,但水平还不足够来研究jQuery源码,那时我不明白他们为何要求那么高,现在才知道,原来没那么高,他问的都是jQuery最基本的框架架构,不过对于不知道的来说,再简单我也是不知道,那时写了一篇博文去吐槽了一下,那时候也是我自己真正激发自己的时候,那时候我说我一定要搞好自己的jQuery基础,没想到那么快就实现了,一个月的源码学习时间就结束

[转] jQuery源码分析-如何做jQuery源码分析

jQuery源码分析系列(持续更新) jQuery的源码有些晦涩难懂,本文分享一些我看源码的方法,每一个模块我基本按照这样的顺序去学习. 当我读到难度的书或者源码时,会和<如何阅读一本书>结合起来进行学习.推荐读读这本书,你可以从这里和这里下载. 第一部分:检视阅读 1. 收集参考资料:官方文档.书籍.百度/谷歌,专题/博客等,快速的浏览,对涉及的知识点.范围.深度.是否有参考意义等有大致的了解和判断,知道这些文章的作者想要解释或解决什么问题. 第二部分:分析阅读 2. 细读官方文档,官方有非

读Zepto源码之Event模块

Event 模块是 Zepto 必备的模块之一,由于对 Event Api 不太熟,Event 对象也比较复杂,所以乍一看 Event 模块的源码,有点懵,细看下去,其实也不太复杂. 读Zepto源码系列文章已经放到了github上,欢迎star: reading-zepto 源码版本本文阅读的源码为 zepto1.2.0 准备知识 focus/blur 的事件模拟为什么要对 focus 和 blur 事件进行模拟呢?从 MDN 中可以看到, focus 事件和 blur 事件并不支持事件冒

读Zepto源码之Callbacks模块

Callbacks 模块并不是必备的模块,其作用是管理回调函数,为 Defferred 模块提供支持,Defferred 模块又为 Ajax 模块的 promise 风格提供支持,接下来很快就会分析到 Ajax模块,在此之前,先看 Callbacks 模块和 Defferred 模块的实现. 源码版本本文阅读的源码为 zepto1.2.0 整体结构将 Callbacks 模块的代码精简后,得到的结构如下: ;(function($){ $.Callbacks = function(optio

读Zepto源码之Deferred模块

Deferred 模块也不是必备的模块,但是 ajax 模块中,要用到 promise 风格,必需引入 Deferred 模块.Deferred 也用到了上一篇文章<读Zepto源码之Callbacks模块>介绍的 Callbacks 模块. 读 Zepto 源码系列文章已经放到了github上,欢迎star: reading-zepto 源码版本本文阅读的源码为 zepto1.2.0 Promise/A+ 规范规范的具体内容可以参考<Promises/A+> 和对应的中文翻译

读懂源码：一步一步实现一个 Vue

源码阅读:究竟怎样才算是读懂了? 市面上有很多源码分析的文章,就我看到的而言,基本的套路就是梳理流程,讲一讲每个模块的功能,整篇文章有一大半都是直接挂源码.我不禁怀疑,作者真的看懂了吗?为什么我看完后还是什么都不懂呢? 事实上一个经过无数次版本迭代的框架源码并不适合初学者直接阅读,因为里面有太多细节,太多噪点,太多枝枝蔓蔓.要想真正理解框架的核心逻辑,必须剥茧抽丝,还原出一个纯净的雏形.如同 jQuery 最早的版本只有六百多行,我相信 Vue 的核心功能也只需要几百行就能实现.所以,读懂源码的

jquery源码解读

最近一直在研读 jQuery 源码,初看源码一头雾水毫无头绪,真正静下心来细看写的真是精妙,其结构明晰,高内聚.低耦合,兼具优秀的性能与便利的扩展性,在浏览器的兼容性(功能缺陷.渐进增强)优雅的处理能力以及 Ajax 等方面周到而强大的定制功能无不令人惊叹. jQuery 的整体结构是这样的: jQuery 整体架构不同于 jQuery 代码各个模块细节实现的晦涩难懂,jQuery 整体框架的结构十分清晰,按代码行文大致分为如上图所示的模块. 初看 jQuery 源码可能很容易一头雾水,因为

如何读jquery源码

热门专题