读jq之四（实用方法）

这篇看了jQuery.map，jQuery().map，jQuery.grep，jQuery.merge。

 

1，jQuery.map

该方法是挂在functoin jQuery上静态方法，通过jQuery.extend({...})方式扩展的。作用是数组(伪数组)每个元素上运行一个函数，返回新修改的数组。

见：http://api.jquery.com/jQuery.map/

 

2，jQuery().map

该方法是jquery对象的一个方法，和jQuery().each一样挂在jQuery.prototype上的。其调用静态的jQuery.map，第一个参数是tihs，该this即为jquery对象自身。它只能对jQuery对象进行修改。

见：http://api.jquery.com/map/

 

3，jQuery.grep

该方法是挂在function jQuery上的静态方法，通过jQuery.extend({...})方式扩展的。作用是过滤数组。

见：http://api.jquery.com/jQuery.grep/

 

4，jQuery.merge

该方法是挂在function jQuery上的静态方法，通过jQuery.extend({...})方式扩展的。作用是合并两个数组，第一个参数数组会被修改。

见：http://api.jquery.com/jQuery.merge/

 

简化如下：

function $(selector){
	return new $.prototype.init(selector);
}
$.fn=$.prototype={	 
	//简化的选择器，为测试$().each方法。这里只需返回一个element集合即可
	init:function(selector){
		var els = document.getElementsByTagName(selector);
		for(var i=0;i<els.length;i++){
			this[i]=els[i];
		}		
        this.length=els.length;
	},
	//$().each,调用静态的$.each
	each:function(callback){
		return $.each( this, callback );
	},
	//$("p").map,调用静态的$.map
	map: function( callback ) {
		return $.map(this, function( elem, i ) {
			return callback.call( elem, i, elem );
		});
	}
}
$.fn.init.prototype=$.fn;

//简化的extend			
$.extend = function(obj){
	for(var a in obj)
		this[a] = obj[a];
};

//给$上添加一些静态方法
$.extend({
	//简化的$.each，可以迭代数组和对象
	each : function(object,callback){
		var name, i = 0,
		length = object.length,
		isObj = length === undefined;
				
		if ( isObj ) {//对对象进行迭代
			for ( name in object ) {		
				if ( callback.call( object[ name ], name, object[ name ] ) === false ) {
					break;
				}
			}		
		} else {//对数组进行迭代
			for ( var value = object[0];
				i < length && callback.call( value, i, value ) !== false; value = object[++i] ) {}
		}		
	},
	//合并两个数组，会改变first
	merge: function( first, second ) {
		var i = first.length, j = 0;

		if ( typeof second.length === "number" ) {
			for ( var l = second.length; j < l; j++ ) {
				first[ i++ ] = second[ j ];
			}
		} else {
			while ( second[j] !== undefined ) {
				first[ i++ ] = second[ j++ ];
			}
		}
		first.length = i;
		return first;
	},
	//数组每个元素上运行一个函数，返回新修改的数组
	map: function( elems, callback ) {
		var ret = [], value;

		for ( var i = 0, length = elems.length; i < length; i++ ) {
			value = callback( elems[ i ], i );
			if ( value != null ) {
				ret[ ret.length ] = value;
			}
		}
		return ret.concat.apply( [], ret );
	},
	//过滤数组
	grep: function( elems, callback, inv ) {
		var ret = [];
		
		for ( var i = 0, length = elems.length; i < length; i++ ) {
			if ( !inv !== !callback( elems[ i ], i ) ) {
				ret.push( elems[ i ] );
			}
		}
		return ret;
	}
});