prototype.js中Function.prototype.bind方法淺解__js

來源:互聯網
上載者:User
初次看到prototype.js架構裡面的Function.prototype.bind = function() {}和class.create()方法實在有些不理解,因為通常mickey在使用jquery的時候並沒多想這些強大的庫裡面為我們提供的那些及其方便使用的原型方法是如何?的。所以在看到prototype.js此類的架構的部分源碼後,對裡面一些基礎的類擴充原型方法的巧妙使用理解起來吃力的原因了。但是mickey經過層層分析,段段調用,因此得出了以下結論,如有不足之處請留言指正。 

prototype.js中的Function.prototype.bind方法: 

Js代碼   Function.prototype.bind = function() {       var __method = this;       var args = Array.prototype.slice.call(arguments);       var object=args.shift();       return function() {           return __method.apply(object,                args.concat(Array.prototype.slice.call(arguments)));   }   }  

為所有function對象增加一個新的prototype(原型)方法bind: 

1.將調用bind方法的對象儲存到__method(方法)變數裡面。 
2.將調用bind方法時傳遞的參數轉換成為數組儲存到變數args。 
3.將args數組的第一位[0]元素提取出來儲存到變數object。 
4.返回一個函數。 
這個被返回的函數在再次被調用的時候執行如下操作: 

1.使用apply方法將調用bind方法的函數裡面的this指標替換為object。 
2.將傳遞到這個匿名函數裡面的參數轉換為數組,與args數組組合形成一個新的數組,傳遞給__method方法。 
var args = Array.prototype.slice.call(arguments)將這條代碼簡寫來看可以成為這樣[].slice.call(arguments);但是這樣會給記憶體裡增加一個空的數組對象,為了容易閱讀點在簡化可以把它假看成為這樣的形式slice.call(arguments),去掉call可以假看成為這樣的形式function slice(arguments){….},其實在slice就是一個為所有數組定義好的prototype方法而已它與我們自訂的原型方法不同的是,它是javascript為開發人員預先定義好的內建方法,他只能被數組調用。mickey在編輯器裡面alert(Array.prototype.slice)之後得到的就是funciton slice(){…}。 

既然slice也只是一個普通函數方法,slice.call(object)這樣讓slice裡面的this臨時的被替換一下也是可以的。就如[].slice(){..}裡面的this指標會指向調用slice方法的數組對象一樣。使用call方法或apply方法可以將調用此方法的對象內的this指標臨時性的改變為傳遞參數中的第一個參數,這一切都是臨時性的,它會在函數執行完畢記憶體釋放後重設。 
var object=args.shift()將數組中的[0]位置的對象儲存到object變數,這個object就是要被替換的指標。 

Js代碼   function o(){       this.num = 1;       var fn = function(arg){alert(this.num+arg)}.bind(this,2);       fn();   }   new o()   
代碼的第3行:一個匿名函數調用了bind方法,並傳遞o對象和一個數字2到bind函數裡面,這兩個傳遞過去的參數都將被轉換成為數組形式,o對象會被單獨提取出來放入object裡。之後bind函數調用完畢,返回一個函數儲存到 fn變數裡邊,現在fn變數裡儲存了bind函數的返回函數,fn裡面的內容就文章第一個代碼塊的第五行到第七行。 
代碼第4行:調用fn函數,或者說是在調用bind函數的傳回值。這時候會彈出數字“3”。 

bind方法中的匿名函數間接儲存了它運行環境裡面的變數,通常這樣的方法稱之為“閉包”。 

這在很多開源架構為開發人員製作出的強大方法和屬性便是這樣出來的,對於初學者mickey來說以上言論如有不正確的地方還是我想還是可以勉強原諒的,如果您發現了不妥之處請留言指出。 

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.