jQ鏈式寫法詳解

jQ的鏈式寫法詳解：

　　jq的鏈式寫法很好用，直接打【.】就能夠了，提及來JQ 是如何實現鏈式寫法的呢？

　　不少人都說jq的鏈式寫法就是 return this   那麼return this表明了什麼呢？

　　簡單說return this就是要返回下一個函數的執行父級（原諒我語文很差，找不到一個更好的詞代替父級這倆個字。）

　　那麼下面寫個例子，來實現一個簡單的鏈式寫法:

 

 1 function a(){
 2     // 執行一些操做。
 3     console.log(111);
 4     return window;
 5 }
 6 function b(){
 7     console.log(22);
 8     //執行一些操做。
 9     return window;
10 }
11 a().b();

　　這算實現了鏈式寫法吧？ 我返回下一個函數的父級，當a函數執行完後，返回window，這樣下個b函數也能夠進行操做，固然這個在項目中不這麼寫。

　　在寫個項目中可使用的鏈式寫法：

 1 function a(){
 2     console.log(1);
 3     return this;
 4 }
 5 function b(){
 6     console.log(2);
 7     return this;
 8 }
 9 var obj={
10     a:a,
11     b:b
12 }
13 obj.a().b();

 那麼jq是如何實現鏈式寫法的呢？確定不是這麼簡單對吧？

 介紹下jq是如何實現鏈式寫法的。

　　在jq中有這麼一行代碼定義了

1 jQuery = function (selector, context) {
2     return new jQuery.fn.init(selector, context, rootjQuery);
3 },

jQuery.fn = jQuery.prototype = {}

jQuery.fn.init.prototype = jQuery.fn;

 

　簡單說這幾行代碼實現了JQ的鏈式寫法定義一個函數，return 一個實例，init函數裏進行了處理初始化操做，好比選擇器，拼接字符串等等，這裏不一一介紹。

　最後再將jq的prototype 賦值給init方法的prototype。

　這樣就實現了鏈式寫法。在工做中也常常會使用到JQ的鏈式寫法，好比說：

　　在作移動端項目的時候，一般你們會引入zepto。可是zepto大約27k左右，在移動端已經很大了，那麼咱們就有必要不去引入zepto。而是咱們單獨寫一個經常使用方法庫。

　　而且使用鏈式寫法，操做簡單，並且仍是專門應對於咱們的項目。因此推薦你們不引入zepto。而是本身去寫個經常使用方法庫。