jQuery 源码分析笔记(4) Ready函数


Posted in Javascript onJune 02, 2011

这个功能在 jQuery的文档中提到了三种等价的形式:

// 定义在jQuery.fn.ready 
$(document).ready(handler); 
// 和上一个是同一个,不推荐 
$().ready(handler); 
// 单独在jQuery对象中处理 
$(handler); 
// 以上这个形式的定义: 
if(jQuery.isFunction(selector) { 
return rootjQuery.ready(selector); 
}

因此实际上都归结与一个形式:jQuery.fn.ready(fn)。定义如下:
ready: function(fn) { 
// 绑定事件到DOM上 
jQuery.bindReady(); 
// 触发回调函数 
readyList.done(fn); 
// 返回jQuery对象 
return this; 
}

实际上jQuery内部并不仅仅只有一个对fn的引用。这里用到了 Deferred功能。在75行,为jQuery对象定义了readyList成员。而在442行在bindReady函数中初始化了这个变量:
if(readyList) { 
return; 
} 
readyList = jQuery._Deferred();

bindReady函数除了初始化readyList之外,主要处理了浏览器对于绑定事件的区别。IE使用attachEvent而其他浏览器使用addEventHandler。这两个步骤完成后,ready函数使用readyList.resolveWith 触发回调函数。除了这个工作外,ready还处理了holdReady。这个API 的作用是延迟ready事件的回调,主要目的是在ready事件前做点事情。holdReady设置了一个标志位readyWait。当这个标志位被设置之后,ready在调用readyList.resolveWith之前不停地调用setTimeout(jQuery.ready, 1)。即每隔固定时间就递归调用自己(不知道hold时间久了,js引擎会不会栈溢出),这样最后被holdReady释放的时候, setTimeout会沿着调用栈回来的。为了在这个栈完成之前不触发ready回调函数。在每次调用setTimeout的时候,会递增readyWait变量。用来指示被holdReady函数延误了几次调用。

###几个基础辅助函数
在543行开始,定义了几个值得注意的辅助函数:parseJSON,parseXML和globalEval。parseJSON把一个字符串变成JSON对象。我们一般使用的是eval。parseJSON封装了这个操作,但是eval被当作了最后手段。因为最新JavaScript标准中加入了JSON序列化和反序列化的API。如果浏览器支持这个标准,则这两个API是在JS引擎中用Native Code实现的,效率肯定比eval高很多。目前来看,Chrome和Firefox4都支持这个API。parseJSON使用如下:

// 原生JSON API。反序列化是JSON.stringify(object) 
if(window.JSON && window.JSON.parse) { 
return window.JSON.parse(data); 
} 
// ... 大致地检查一下字符串合法性 
return (new Function("return " + data))();

parseXML函数也主要是标准API和IE的封装。标准API是DOMParser对象。而IE使用的是Microsoft.XMLDOM的 ActiveXObject对象。定义:
if(window.DOMParser) { 
tmp = new DOMParser(); 
xml = tmp.parseFromString(data, "text/xml"); 
} else { 
xml = new ActiveXObject("Microsoft.XMLDOM"); 
xml.async = "false"; 
xml.loadXML(data); 
}

globalEval函数把一段脚本加载到全局context中。IE中可以使用window.execScript。其他浏览器需要使用eval。因为整个jQuery代码都是一整个匿名函数,所以当前context是jQuery。主要代码:
(window.execScript || function(data) { 
window["eval"].call(window, data); // 在window context下运行 
})(data);
Javascript 相关文章推荐
IE6-IE9不支持table.innerHTML的解决方法分享
Sep 14 Javascript
javascript中call,apply,bind的用法对比分析
Feb 12 Javascript
javascript数据结构与算法之检索算法
Apr 04 Javascript
JQuery使用$.ajax和checkbox实现下次不在通知功能
Apr 16 Javascript
JQuery实现图片轮播效果
Sep 15 Javascript
解决vue组件中使用v-for出现告警问题及v for指令介绍
Nov 11 Javascript
JavaScript 日期时间选择器一些小结
Apr 02 Javascript
vue中post请求以a=a&b=b 的格式写遇到的问题
Apr 27 Javascript
layui实现数据分页功能
Jul 27 Javascript
解决layer 动态加载select 失效的问题
Sep 18 Javascript
js中!和!!的区别与用法
May 09 Javascript
微信小程序实现单个或多个倒计时功能
Nov 01 Javascript
在IE 浏览器中使用 jquery的fadeIn() 效果 英文字符字体加粗
Jun 02 #Javascript
JqGrid web打印实现代码
May 31 #Javascript
16个最流行的JavaScript框架[推荐]
May 29 #Javascript
js 静态动态成员 and 信息的封装和隐藏
May 29 #Javascript
在JavaScript中监听IME键盘输入事件
May 29 #Javascript
解读JavaScript代码 var ie = !-[1,] 最短的IE判定代码
May 28 #Javascript
Jquery css函数用法(判断标签是否拥有某属性)
May 28 #Javascript
You might like
php将gd生成的图片缓存到memcache的小例子
2013/06/05 PHP
PHP Session 变量的使用方法详解与实例代码
2013/09/11 PHP
YII中assets的使用示例
2014/07/31 PHP
PHP设计模式之装饰器模式实例详解
2018/02/07 PHP
JavaScript Event学习第四章 传统的事件注册模型
2010/02/07 Javascript
用jquery和json从后台获得数据集的代码
2011/11/07 Javascript
一个支付页面DEMO附截图
2014/07/22 Javascript
jQuery中width()方法用法实例
2014/12/24 Javascript
js生成随机数的过程解析
2015/11/24 Javascript
原生javascript实现自动更新的时间日期
2016/02/12 Javascript
设置jQueryUI DatePicker默认语言为中文
2016/06/04 Javascript
jQuery动态生成Bootstrap表格
2016/11/01 Javascript
详解webpack分包及异步加载套路
2017/06/29 Javascript
element-ui上传一张图片后隐藏上传按钮功能
2019/05/22 Javascript
详解vue页面首次加载缓慢原因及解决方案
2019/11/06 Javascript
JavaScript enum枚举类型定义及使用方法
2020/05/15 Javascript
[59:08]Ti4 冒泡赛第二天 NEWBEE vs Titan 2
2014/07/15 DOTA
Python实现的HTTP并发测试完整示例
2020/04/23 Python
python使用xlrd和xlwt读写Excel文件的实例代码
2018/09/05 Python
Python 网络编程之UDP发送接收数据功能示例【基于socket套接字】
2019/10/11 Python
美国首屈一指的礼品篮供应商:GiftTree
2018/01/06 全球购物
与世界上最好的跑步专业品牌合作:Fleet Feet
2019/03/22 全球购物
铭宣海淘转运:美国、日本、英国转运等全球转运公司
2019/09/10 全球购物
德国家具折扣店:POCO
2020/02/28 全球购物
运动会800米加油稿
2014/02/22 职场文书
有创意的广告词
2014/03/18 职场文书
个人授权委托书格式
2014/08/30 职场文书
暑假学习心得体会
2014/09/02 职场文书
幼儿园教师节演讲稿
2014/09/03 职场文书
归元寺导游词
2015/02/06 职场文书
学年个人总结范文
2015/03/05 职场文书
2015年幼儿园中班工作总结
2015/04/25 职场文书
小学生安全教育心得体会
2016/01/15 职场文书
班级元旦晚会开幕词
2016/03/04 职场文书
2016年全国助残日活动总结
2016/04/01 职场文书
MySQL基础(一)
2021/04/05 MySQL