通過jQuery原始碼學習javascript(三)

2021-09-08 20:48:22 字數 2327 閱讀 5742

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

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

一、二。

輸出結果

這是乙個字串物件,在使用for的時候,會出現上面的情況。

自呼叫匿名函式(function(){})(window)

(function

(window, undefined))(window);

**解析:

第乙個括號:建立乙個匿名函式。

第二個括號:立即執行。

使window變數由全域性變數變為區域性變數,不需要將作用域鏈回退到頂層作用域,以便更快的訪問window。

在引數列表中增加undefined原因:

在自呼叫匿名函式的作用域內,確保undefined是真的未定義。

這樣設計的好處:建立私有命名空間。函式體內的變數和方法,不會影響全域性空間。不會與其他程式的變數發生衝突。

功能擴充套件extend()

根據一般的設計習慣,可以直接通過點(.)語法實現,或者在prototype物件結構中增加乙個屬性即可。——jquery框架是通過extend()函式來實現功能擴充套件的。

我們也做個類似的方法。——把指定引數物件包含的所有屬性複製給cquery或cquery.prototype物件。

(function

(); cquery.fn = cquery.prototype =

};cquery.fn.init.prototype =cquery.fn;

cquery.extend = cquery.fn.extend = function

( obj )

return

this

; }

cquery.fn.extend(

});window.c = window.cquery =cquery;

})();

//呼叫方式

c().test();

好處:1、方便使用者快速擴充套件jquery框架的功能,不會破壞jquery框架的原型結構。

2、方便管理。

注意:通過prototype擴充套件的物件,我們必須通過例項化函式來呼叫(如cquery().test(),而不能使用cquery.test())

物件url引數化param()

(function

();

cquery.fn = cquery.prototype =

};cquery.param = function

(obj)

return s.join( "&");

}cquery.fn.init.prototype =cquery.fn;

window.c = window.cquery =cquery;

})();

var param = cquery.param();

console.log( param );

輸出結果

物件url引數化:有利於結構化,易於維護。如果在url後面加一坨的引數列表,難道看著不眼暈嗎? 

總結

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

推薦

休閒區【當你學不進去的時候】----普瑞馬法則

jQuery原始碼學習

jquery框架學習 1 定義變數和函式 2 給jq物件,新增一些方法和屬性 3 extend jq的繼承方法 4 jq.extend 擴充套件jq的一些工具方法 5 jq複雜的選擇功能 6 callbacks 回函物件,函式的統一管理 7 deferred 延遲物件,對非同步的乙個統一管理 8 s...

jQuery原始碼學習筆記

整個jquery是乙個自呼叫的匿名函式 1 function global,factory 9return factory w 10 11 else 14 typeof window undefined window this,function window,noglobal 自呼叫函式大家都不陌生...

jquery原始碼學習筆記二 jQuery工廠

筆記一裡記錄,jquery的總體結構如下 function global,factory typeof window undefined window this,function window,noglobal 那麼這個生成jquery的工廠是咋樣的?醬紫的 function window,nogl...