DIV CSS 佈局教程網

疑問

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

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

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

自調用匿名函數(function(){})(window)
. 代碼如下:
(function(window, undefined){
// jquery code
})(window);

代碼解析：

　　第一個括號：創建一個匿名函數。
　　第二個括號：立即執行。

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

功能擴展extend()

　　根據一般的設計習慣，可以直接通過點(.)語法實現，或者在prototype對象結構中增加一個屬性即可。——jQuery框架是通過extend()函數來實現功能擴展的。
　　我們也做個類似的方法。——把指定參數對象包含的所有屬性復制給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擴展的對象，我們必須通過實例化函數來調用（如cQuery().test()，而不能使用cQuery.test()）

對象url參數化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 );

輸出結果

對象url參數化：有利於結構化，易於維護。如果在url後面加一坨的參數列表，難道看著不眼暈嗎？

總結

　　暫時寫到這裡，如果大家有所補充，那最好不過了。——大家多交流互相學習下。