通過jQuery源碼學習javascript(三)

更新時間：2012年12月27日 16:13:22 作者：

承接上兩篇繼續(xù)寫下去。我盡量把我明白的地方給大家說清楚。有些大家的提問我也有點搞不明白，如果有人能解答，再好不過了

疑問

　　第一篇中有位博友提出了以下的問題，我也不太明白，如果有明白的，能否告知一、二。

 
var str = "test"; 
for(var a in str){ 
console.log(a + ":" + str[ a ]); 
} 

輸出結果
這是一個字符串對象，在使用for的時候，會出現(xiàn)上面的情況。

自調用匿名函數(shù)(function(){})(window)

復制代碼代碼如下:

 
(function(window, undefined){ 
// jquery code 
})(window); 

代碼解析：

　　第一個括號：創(chuàng)建一個匿名函數(shù)。
　　第二個括號：立即執(zhí)行。

傳入window變量原因：
　　使window變量由全局變量變?yōu)榫植孔兞?，不需要將作用域鏈回退到頂層作用域，以便更快的訪問window。
在參數(shù)列表中增加undefined原因：
　　在自調用匿名函數(shù)的作用域內，確保undefined是真的未定義。
這樣設計的好處：
　　創(chuàng)建私有命名空間。函數(shù)體內的變量和方法，不會影響全局空間。不會與其他程序的變量發(fā)生沖突。

功能擴展extend()

　　根據一般的設計習慣，可以直接通過點(.)語法實現(xiàn)，或者在prototype對象結構中增加一個屬性即可?！猨Query框架是通過extend()函數(shù)來實現(xiàn)功能擴展的。
　　我們也做個類似的方法?！阎付▍?shù)對象包含的所有屬性復制給cQuery或cQuery.prototype對象。

復制代碼代碼如下:

 
(function(){ 
var 
_cQuery = window.cQuery, 
cQuery = function(){ 
return new cQuery.fn.init(); 
}; 

cQuery.fn = cQuery.prototype = { 
init : function () { 
return this; 
} 
}; 
cQuery.fn.init.prototype = cQuery.fn; 

cQuery.extend = cQuery.fn.extend = function( obj ) { 
for (var prop in obj) { 
this[ prop ] = obj[ prop ]; 
} 
return this; 
} 

cQuery.fn.extend({ 
test : function() { 
console.log('測試!'); 
} 
}); 
window.C = window.cQuery = cQuery; 
})(); 
// 調用方式 
C().test(); 

好處：
　　1、方便用戶快速擴展jQuery框架的功能，不會破壞jQuery框架的原型結構。
　　2、方便管理。
注意：
　　通過prototype擴展的對象，我們必須通過實例化函數(shù)來調用（如cQuery().test()，而不能使用cQuery.test()）

對象url參數(shù)化param()

復制代碼代碼如下:

 
(function(){ 
var 
_cQuery = window.cQuery, 
cQuery = function(){ 
return new cQuery.fn.init(); 
}; 

cQuery.fn = cQuery.prototype = { 
init : function () { 
return this; 
} 
}; 

cQuery.param = function(obj) { 
var prefix, s = []; 
for ( prefix in obj ) { 
s[ s.length ] = encodeURIComponent( prefix ) + "=" + encodeURIComponent( obj[ prefix ]); 
} 
return s.join( "&" ); 
} 


cQuery.fn.init.prototype = cQuery.fn; 
window.C = window.cQuery = cQuery; 
})(); 

var param = cQuery.param({"name":"chuanshanjia", "age":30}); 
console.log( param ); 