jQuery中的函数汇总1
歡迎訪問(wèn)我的github:huanshen,有我的源碼解析
1、each
跟for循環(huán)很像,但是更有用,如果你理解了就知道了。
// 遍歷一個(gè)數(shù)組或者對(duì)象// obj 是需要遍歷的數(shù)組或者對(duì)象// callback 是處理數(shù)組/對(duì)象的每個(gè)元素的回調(diào)函數(shù),它的返回值實(shí)際會(huì)中斷循環(huán)的過(guò)程// args 是額外的參數(shù)數(shù)組each: function( obj, callback, args ) {var value,i = 0,length = obj.length,isArray = isArraylike( obj );//如果args存在的話,callback中傳入的參數(shù)是grgs,each循環(huán)次數(shù)確是由obj來(lái)確定的if ( args ) {if ( isArray ) {for ( ; i < length; i++ ) {value = callback.apply( obj[ i ], args );if ( value === false ) {break;}}} else {for ( i in obj ) {value = callback.apply( obj[ i ], args );if ( value === false ) {break;}}}// A special, fast, case for the most common use of each//注意下面用的是call,上面是apply//apply 的第二個(gè)參數(shù)以數(shù)組的形式傳入,但是真正運(yùn)行的時(shí)候,//傳入的數(shù)組參數(shù)會(huì)變成一個(gè)個(gè)的形式,而不是一個(gè)數(shù)組參數(shù)} else {if ( isArray ) {for ( ; i < length; i++ ) {value = callback.call( obj[ i ], i, obj[ i ] );if ( value === false ) {break;}}} else {for ( i in obj ) {value = callback.call( obj[ i ], i, obj[ i ] );if ( value === false ) {break;}}}}return obj;},?2.makeArray
將類數(shù)組對(duì)象轉(zhuǎn)化為數(shù)組。中間用到了merge函數(shù),具體可見(jiàn)第三個(gè)函數(shù),有說(shuō)明。類數(shù)組對(duì)象(isArraylike)形如{0:"tt",2:"ccc",length:2};就是屬性是數(shù)字形式,同時(shí)有l(wèi)ength屬性。
// 將類數(shù)組對(duì)象轉(zhuǎn)換為數(shù)組對(duì)象// 此方法為內(nèi)部方法makeArray: function( arr, results ) {var ret = results || [];if ( arr != null ) {// 如果 arr 是一個(gè)類數(shù)組對(duì)象,調(diào)用 merge 合到返回值if ( isArraylike( Object(arr) ) ) {jQuery.merge( ret,typeof arr === "string" ?[ arr ] : arr);} else {// 如果不是數(shù)組,則將其放到返回?cái)?shù)組末尾// 等同于 ret.push(arr); core_push.call( ret, arr );}}return ret;},關(guān)于中間的Object()可以看看下面的結(jié)果(暫時(shí)不是很清楚具體的作用):
var str="tttt",arr1=[1,2,3],obj={1:0},str2=Object(str);console.log( Object(str))//{0: "t", 1: "t", 2: "t", 3: "t", length: 4, [[PrimitiveValue]]: "tttt"}console.log(str2.length)//4console.log(Object(arr1))//[1, 2, 3]console.log(Object(obj))//{1: 0}3、merge?
可以合并兩個(gè)數(shù)組或者類數(shù)組對(duì)象
//把second中的屬性添加到first中//second可以是數(shù)組或者類數(shù)組對(duì)象,又或者包含0,1屬性的東西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;},?4、map
功能跟each差不多,但是也有不一樣的地方,主要是在處理第三個(gè)參數(shù)方面。
map: function( elems, callback, arg ) {var value,i = 0,length = elems.length,isArray = isArraylike( elems ),ret = [];// Go through the array, translating each of the items to their//如果是數(shù)組,isArray=true;//與each傳入?yún)?shù)順序是一致的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,//如果是對(duì)象} else {for ( i in elems ) {value = callback( elems[ i ], i, arg );if ( value != null ) {ret[ ret.length ] = value;}}}// Flatten any nested arraysreturn core_concat.apply( [], ret );},5、proxy
proxy(),接受一個(gè)函數(shù),然后返回一個(gè)新函數(shù),并且這個(gè)新函數(shù)始終保持了特定的上下文(context?)語(yǔ)境。
proxy: function( fn, context ) {var tmp, args, proxy;if ( typeof context === "string" ) {tmp = fn[ context ];context = fn;fn = tmp;}// Quick check to determine if target is callable, in the spec// this throws a TypeError, but we will just return undefined.if ( !jQuery.isFunction( fn ) ) {return undefined;}// Simulated bind//如果傳入的參數(shù)多余2個(gè),把多余的參數(shù)轉(zhuǎn)變?yōu)閿?shù)組。args = core_slice.call( arguments, 2 );proxy = function() {//這里用到了柯里化return fn.apply( context || this, args.concat( core_slice.call( arguments ) ) );};// Set the guid of unique handler to the same of original handler, so it can be removedproxy.guid = fn.guid = fn.guid || jQuery.guid++;return proxy;},柯里化(Currying)是把接受多個(gè)參數(shù)的函數(shù)變換成接受一個(gè)單一參數(shù)(最初函數(shù)的第一個(gè)參數(shù))的函數(shù),并且返回接受余下的參數(shù)且返回結(jié)果的新函數(shù)的技術(shù)。具體可以看下面這個(gè)示例:可以看到前面兩個(gè)參數(shù)并沒(méi)有輸出,最后一個(gè)參數(shù)和新的參數(shù)組成數(shù)組輸出。在上面就是作為參數(shù)傳入proxy中
function t (l,t,y){var args = [].slice.call( arguments, 2 );console.log(args)function t(){console.log(args.concat([].slice.call( arguments )));}return t;}var tt=t(1,2,3);tt("t");//[3,"t"]?
總結(jié)
以上是生活随笔為你收集整理的jQuery中的函数汇总1的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: Heron 数据模型,API和组件介绍
- 下一篇: Stack View的与众不同