抽丝剥茧, 7000+ 行的 jQuery 源码基本可以概括为以下的伪代码

(function (window, undefined) {
//将 document 封装成 jQuery 对象并缓存
var rootjQuery, //dom ready 事件的委托队列
readyList, //快速地识别 html 标记 如 <div> 或者 #id
rquickExpr = /^(?:\s*(<[\w\W]+>)[^>]*|#([\w-]*))$/, jQuery = function (selector, context) {
return new jQuery.fn.init(selector, context, rootjQuery);
}; jQuery.fn = jQuery.prototype = {
constructor: jQuery,
init: function (selector, context, rootjQuery) { // $(""), $(null), $(undefined), $(false)
if (!selector) {
return this;
} var match = rquickExpr.exec(selector); // $('<div></div>')
jQuery.parseHTML(match[1])
return this; // $(#id)
return document.getElementById(selector); // $('.class'), $('.class', context), $('#class', context)
// 其中 context 是jQuery元素
return (context || rootjQuery).find(selector); // $('.class', domElm)
return this.constructor(context).find(selector); // selector is function
return rootjQuery.ready(selector); return jQuery.makeArray(selector, this);
},
ready: function (fn) {
// Add the callback
jQuery.ready.promise().done(fn); return this;
}
} jQuery.init.prototype = jQuery.fn; jQuery.extend = jQuery.fn.extend = function () {
}; rootjQuery = jQuery(document); // Sizzle 代码
(function (window, undefined) { function Sizzle(selector, context, results, seed) {
if (support.qsa) {
return querySelectorAll(selector)
} return select(selector.replace(rtrim, "$1"), context, results, seed);
} function select(selector, context, results, seed) {
var match = tokenize(selector);
} function tokenize(selector, parseOnly) { } jQuery.find = Sizzle;
})(window); // 对 jQuery 对象的扩展
jQuery.extend({}); // 对 jQuery.fn 对象的扩展
jQuery.fn.extend({}); window.$ = window.jQuery = jquery; })(window);

jQuery 源码基本框架的更多相关文章

  1. jQuery源码整体结构(源码2.0.3)

    拨开jQuery的面纱,最近了解了下jQuery源码整体框架.主要包括: (1)  jQuery 核心模块 (2)  sizzle 选择器引擎 (3)  Deferred 异步队列 (4)  Supp ...

  2. jQuery源码分析之整体框架

    之前只是知道jQuery怎么使用,但是我觉得有必要认真的阅读一下这个库,在分析jQuery源码之前,很有必要对整个jQuery有个整体的框架概念,才能方便后面对jQuery源码的分析和学习,以下是我总 ...

  3. 三.jQuery源码解析之jQuery的框架图

    这张图片是对jQuery源码截图,一点一点拼出来的. 现在根据这张图片来对jQuery框架做一些说明. 一.16~9404行可以发现,最外层是一个自调用函数.当jQuery初始化时,这个自调用函数包含 ...

  4. 读jQuery源码之整体框架分析

    读一个开源框架,大家最想学到的就是设计的思想和实现的技巧.最近读jQuery源码,记下我对大师作品的理解和心得,跟大家分享,权当抛砖引玉. 先附上jQuery的代码结构. (function(){ / ...

  5. jQuery源码学习感想

    还记得去年(2015)九月份的时候,作为一个大四的学生去参加美团霸面,结果被美团技术总监教育了一番,那次问了我很多jQuery源码的知识点,以前虽然喜欢研究框架,但水平还不足够来研究jQuery源码, ...

  6. jQuery源码:从原理到实战

    jQuery源码:从原理到实战 jQuery选择器对象 $(".my-class"); document.querySelectorAll*".my-class" ...

  7. JQuery源码解析(一)

    写在前面:本<JQuery源码解析>系列是基于一些前辈们的文章进行进一步的分析.细化.修改而写出来的,在这边感谢那些慷慨提供科普文档的技术大拿们. 要查阅JQ的源文件请下载开发版的JQ.j ...

  8. jQuery源码笔记(一):jQuery的整体结构

    jQuery 是一个非常优秀的 JS 库,与 Prototype,YUI,Mootools 等众多的 Js 类库相比,它剑走偏锋,从 web 开发的实用角度出发,抛除了其它 Lib 中一些中看但不实用 ...

  9. jquery 源码解析

    静态与实力方法共享设计 遍历方法 $(".a").each() //作为实例方法存在 $.each() //作为静态方法存在 Jquery源码 jQuery.prototype = ...

随机推荐

  1. 【Javascript&Jquery基础归纳】- 加载相关

    1.window.onload 必须等到Dom所有元素.包括图片加载完毕后加载,只能编写一个. 2.$(document).ready()      DOM结构加载完毕后马上执行,并且可以编写多个. ...

  2. TCP 的那些事儿(上)

    TCP是一个巨复杂的协议,因为他要解决很多问题,而这些问题又带出了很多子问题和阴暗面.所以学习TCP本身是个比较痛苦的过程,但对于学习的过程却能让人有很多收获.关于TCP这个协议的细节,我还是推荐你去 ...

  3. Pick-up sticks - POJ 2653 (线段相交)

    题目大意:有一个木棒,按照顺序摆放,求出去上面没有被别的木棍压着的木棍.....   分析:可以维护一个队列,如果木棍没有被压着就入队列,如果判断被压着,就让那个压着的出队列,最后把这个木棍放进队列, ...

  4. python 开发简单的聊天工具

    python 太强大了,以至于它什么都可以做,哈哈,开个玩笑.但是今天要讲的真的是一个非常神奇的应用. 使用python写一个聊天工具 其实大家平时用的QQ类似的聊天工具,也是使用socket进行聊天 ...

  5. c#委托和事件(下) 分类: C# 2015-03-09 08:42 211人阅读 评论(0) 收藏

    C#中的委托和事件(下) 引言 如果你看过了 C#中的委托和事件 一文,我想你对委托和事件已经有了一个基本的认识.但那些远不是委托和事件的全部内容,还有很多的地方没有涉及.本文将讨论委托和事件一些更为 ...

  6. Python程序的执行原理(转载)

    Python程序的执行原理 2013-09-17 10:35 佚名 tech.uc  1. 过程概述 Python先把代码(.py文件)编译成字节码,交给字节码虚拟机,然后虚拟机一条一条执行字节码指令 ...

  7. 数据库中存储日期的字段类型究竟应该用varchar还是datetime ?

    背景: 前段时间在百度经验看到一篇文章<如何在电脑右下角显示你(爱人)的名字>,之前也听过这个小技巧,但没真正动手设置过.所以出于好奇就实践了一下. 设置完成后的效果例如以下.右下角的时间 ...

  8. Swift --- 面向对象中类和对象的属性

    Swift中类和对象的属性分为三种:储存属性,计算属性和类属性. import Foundation class Person { // 储存属性必须赋初值 var score1: Int = 20 ...

  9. Node.js异步处理CPU密集型任务

    Node.js异步处理CPU密集型任务 Node.js擅长数据密集型实时(data-intensive real-time)交互的应用场景.然而数据密集型实时应用程序并非仅仅有I/O密集型任务,当碰到 ...

  10. linux的文件系统及节点表

    linux的文件系统及节点表 一  linux的文件系统1 我们都知道当我们安装linux时会首先给系统分区,然后我们会把分区格式化成EXT3格式的文件系统.那么在linux系统中还有没有其他的文件系 ...