logo头像

求知若渴,虚心若愚

jQuery - jQuery源码学习 - jQuery.ready.promise、jQuery.each和isArraylike

jQuery.ready.promise

  • 页面初始化中,用的较多的就是$(document).ready(function(){//代码});
  • ready是在DOM的结构加载完后就触发,ready的内部是如何判断DOM的结构加载完的,就是当前的方法
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

jQuery.ready.promise = function( obj ) {
// readyList为预先申明的变量,未赋值
if ( !readyList ) {
// 函数执行后申明为jQuery.Deferred()
// 最后把延迟对象返回出去,满足条件后触发fn函数
readyList = jQuery.Deferred();
// if()else(),监听dom加载,最终调用的都是jQuery.ready方法(静态方法)
if ( document.readyState === "complete" ) {
setTimeout( jQuery.ready );

} else {
// 当浏览器是基于标准浏览器时,会在加载完DOM结构后触发“DOMContentLoaded”事件,jquery内部就用此事件作为ready的触发源
// 当浏览器是IE浏览器时,因为IE浏览器(蛋疼并强大着)不支持“DOMContentLoaded”事件,所以只能另谋它法,这里没有判断,估计是ie678不支持的原因之一
document.addEventListener( "DOMContentLoaded", completed, false );

window.addEventListener( "load", completed, false );
}
}
return readyList.promise( obj );
};

jQuery.each

  • 填充class2type映射表
  • 生成一个class2type对象
  • type方法中用到的
1
2
3
4
5
6
7
8
9
10
11
12

class2type = {
    "Boolean": "boolean",
    "Number": "number",
    "String": "string",
    "Function": "function",
    "Array": "array",
    "Date": "date",
    "RegExp": "regexp",
    "Object": "object",
    "Error": "error",
}

isArraylike

  • 判断是否是数组,类数组,带length的json,是的话就返回真
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

function isArraylike( obj ) {
var length = obj.length,
type = jQuery.type( obj );

// 担心window对象有length属性
if ( jQuery.isWindow( obj ) ) {
return false;
}
// 如果有nodeType的话并且还有长度,那么就是类数组的形式,返回true。
if ( obj.nodeType === 1 && length ) {
return true;
}
// 如果还不满足则判断是否为数组
// 不能是函数,因为函数也可能有length属性
// typeof length === "number" && length > 0 && ( length - 1 ) in obj )处理{0:"a",1:"b",length:2}这种情况。
// length === 0处理arguments为空的时候,就是不传入函数任何数据,这时函数中的arguments的length为0,但是是类数组。
// document.getElementsByTagName("div")和body.childNodes也是类数组。
return type === "array" || type !== "function" &&
( length === 0 ||
typeof length === "number" && length > 0 && ( length - 1 ) in obj );
}
支付宝打赏 微信打赏

赞赏是对我们的肯定!