jquery源码之工具方法
jQuery 作为时下前端的"霸主"。它的强大已毋庸置疑。简洁，效率，优雅，易用等优点让人很容易对它珍爱有加。
作为js的小菜，为了提升自我等级，根据各大神博客精辟的解析，硬啃了jQuery源码。在此，并不是要解析啥源码啥的(也没到那个级别哈)，读书笔记，仅此而已。
所谓磨刀不误砍柴功，jQuery在大展神通之前也做了许多准备工作。比如说他的一些工具方法：
首当其冲的是他的继承扩展方法: jQuery.extend
其实也不是传统意义的继承，说mixin可能更恰当一些。
/*
首先看看它的用法
var a = {name:'zhangsan', age:13}
var b = {name:'wangwu'}
$.extend(a, b)
a; --> {name:'wangwu',age:13}
显而易见，该方法会将后面的参数mixin到前面的参数。
如果不存在后续参数呢
$.extend({hello:function(){alert('hello');}});
$.hello() --> 好吧，糅杂到调用者身上了。
另外第一个参数也可能为 deep 是否深拷贝。
具体看源码吧
*/
jQuery.extend = jQuery.fn.extend = function() {
var options, name, src, copy, copyIsArray, clone,
// 目标源，需要将对象内容糅杂在该目标中
target = arguments[0] || {},
i = 1,
length = arguments.length,
deep = false;
// 处理深拷贝的情况
// Handle a deep copy situation
if ( typeof target === "boolean" ) {
deep = target;
target = arguments[1] || {};
// 跳过参数boolean和已经替换为target的第二个参数
// skip the boolean and the target
i = 2;
}
// 处理目标是一个string或者其他东西（可能出现在深度拷贝的情况中） 则初始化target
// Handle case when target is a string or something (possible in deep copy)
if ( typeof target !== "object" && !jQuery.isFunction(target) ) {
target = {};
}
// 如果i为参数的长度，则将目标指向调用者，
// 即糅杂入调用者本身，通常用来扩展jquery
// extend jQuery itself if only one argument is passed
if ( length === i ) {
target = this;
--i;
}
// 接下来for循环处理相关复制，深度拷贝可能还得递归调用本身，
// 最后返回target
for ( ; i < length; i++ ) {
// Only deal with non-null/undefined values
if ( (options = arguments[ i ]) != null ) {
// Extend the base object
for ( name in options ) {
src = target[ name ];
copy = options[ name ];
// Prevent never-ending loop
if ( target === copy ) {
continue;
}
// Recurse if we're merging plain objects or arrays
if ( deep && copy && ( jQuery.isPlainObject(copy) || (copyIsArray = jQuery.isArray(copy)) ) ) {
if ( copyIsArray ) {
copyIsArray = false;
clone = src && jQuery.isArray(src) ? src : [];
} else {
clone = src && jQuery.isPlainObject(src) ? src : {};
}
// Never move original objects, clone them
target[ name ] = jQuery.extend( deep, clone, copy );
// Don't bring in undefined values
} else if ( copy !== undefined ) {
target[ name ] = copy;
}
}
}
}
// Return the modified object
return target;
};
jquery.each是个便捷的多功能遍历方法
// args is for internal usage only each: function( obj, callback, args ) { var name, i = 0, length = obj.length, isObj = length === undefined || jQuery.isFunction( obj ); // 主要针对 是否有参数 与 是否为对象，
// 如果是有参数，则传递参数，
// 否则如果是数组 则传递 index,val
// isObj 则传递 key, val
// 如果在遍历的过程中有返回false 则终止遍历。
if ( args ) { if ( isObj ) { for ( name in obj ) { if ( callback.apply( obj[ name ], args ) === false ) { break; } } } else { for ( ; i < length; ) { if ( callback.apply( obj[ i++ ], args ) === false ) { break; } } } // A special, fast, case for the most common use of each } else { if ( isObj ) { for ( name in obj ) { if ( callback.call( obj[ name ], name, obj[ name ] ) === false ) { break; } } } else { for ( ; i < length; ) { if ( callback.call( obj[ i ], i, obj[ i++ ] ) === false ) { break; } } } } return obj; },
同样与遍历有关的还有$.map, $.grep
这两个方法很简单，代码都是逻辑代码，根据功能很容易看懂
map 则为遍历数组或对象，返回过滤方法过滤的值并将不为空的值，添加入新数组。
grep 则是遍历数组或对象， 筛选出方法过滤指定值的选项，并添加入新数组。
merge: function( first, second ) {
var l = second.length,
i = first.length,
j = 0;
if ( typeof l === "number" ) {
for ( ; j < l; j++ ) {
first[ i++ ] = second[ j ];
}
} else {
while ( second[j] !== undefined ) {
first[ i++ ] = second[ j++ ];
}
}
first.length = i;
return first;
},
grep: function( elems, callback, inv ) {
var retVal,
ret = [],
i = 0,
length = elems.length;
inv = !!inv;
// Go through the array, only saving the items
// that pass the validator function
for ( ; i < length; i++ ) {
retVal = !!callback( elems[ i ], i );
if ( inv !== retVal ) {
ret.push( elems[ i ] );
}
}
return ret;
},
// arg is for internal usage only
map: function( elems, callback, arg ) {
var value, key,
ret = [],
i = 0,
length = elems.length,
// jquery objects are treated as arrays
isArray = elems instanceof jQuery || length !== undefined && typeof length === "number" && ( ( length > 0 && elems[ 0 ] && elems[ length -1 ] ) || length === 0 || jQuery.isArray( elems ) ) ;
// Go through the array, translating each of the items to their
if ( isArray ) {
for ( ; i < length; i++ ) {
value = callback( elems[ i ], i, arg );
if ( value != null ) {
ret[ ret.length ] = value;
}
}
// Go through every key on the object,
} else {
for ( key in elems ) {
value = callback( elems[ key ], key, arg );
if ( value != null ) {
ret[ ret.length ] = value;
}
}
}
// Flatten any nested arrays
return ret.concat.apply( [], ret );
},
接下是最最私有的一个方法，可能除了jquery作者，谁也不知道能拿他干啥了（当然这只是小菜我的个人观点，可能我目光太浅，看不到作者深刻的主题思想）
access 百度翻译是：入口，出口; 接近，进入;
好吧，他可能是操作dom元素各种重载方法的统一入口了。
// Multifunctional method to get and set values of a collection
// The value/s can optionally be executed if it's a function
access: function( elems, fn, key, value, chainable, emptyGet, pass ) {
var exec,
bulk = key == null,
i = 0,
length = elems.length;
// Sets many values
if ( key && typeof key === "object" ) {
for ( i in key ) {
jQuery.access( elems, fn, i, key[i], 1, emptyGet, value );
}
chainable = 1;
// Sets one value
} else if ( value !== undefined ) {
// Optionally, function values get executed if exec is true
exec = pass === undefined && jQuery.isFunction( value );
if ( bulk ) {
// Bulk operations only iterate when executing function values
if ( exec ) {
exec = fn;
fn = function( elem, key, value ) {
return exec.call( jQuery( elem ), value );
};
// Otherwise they run against the entire set
} else {
fn.call( elems, value );
fn = null;
}
}
if ( fn ) {
for (; i < length; i++ ) {
fn( elems[i], key, exec ? value.call( elems[i], i, fn( elems[i], key ) ) : value, pass );
}
}
chainable = 1;
}
return chainable ?
elems :
// Gets
bulk ?
fn.call( elems ) :
length ? fn( elems[0], key ) : emptyGet;
}
绕了这么远，其实就是想说，$.extend, $.each, $.access在jquery的构建过程中出现频率比较高。
还有一些类别判断，数组操作的比较常见的就没列出来了。
其实说到 $.each 就不得不提传说中的'高阶函数'了。
'高阶函数'只是将函数作为参数或返回值的函数。
这只是描述高阶函数的表现形式。
个人理解，高阶函数是依赖普通函数的一种抽象行为，//高阶函数是提供另类抽象行为的一种接口，
就比如说 $.each(obj, fn);
obj在这表示的是可遍历的对象或队列，
fn则是遍历时的过滤方法，
对于obj，each就是可定制遍历行为（fn）的接口。