JavaScript 函數惰性載入

來源:互聯網
上載者:User

最近看JavaScript進階程式設計,大有收穫,接下來幾天寫一下讀書筆記。之前寫了一篇Ajax初步理解的隨筆,裡面有個函數用來建立XmlHttpRequest對象,瀏覽器安全色性原因,寫出的代碼通過大量if判斷或者try,catch語句將函數引導到正確代碼處。

<script type="text/javascript">            function createXHR(){                var xhr = null;                try {                    // Firefox, Opera 8.0+, Safari,IE7+                    xhr = new XMLHttpRequest();                }                catch (e) {                    // Internet Explorer                     try {                        xhr = new ActiveXObject("Msxml2.XMLHTTP");                    }                    catch (e) {                        try {                            xhr = new ActiveXObject("Microsoft.XMLHTTP");                        }                        catch (e) {                            xhr = null;                        }                    }                }                return xhr;            }        </script>

每次調用這個函數的時候,都要先進行瀏覽器能力檢查,首先檢查瀏覽器是否支援內建的XMLHyypRequest對象,如果不支援然後檢查各版本基於ActiveX的XMLHttpRequest,每次調用該函數都是這樣,其實當第一次執行完後,如果瀏覽器支援某個特定XMLHttpRequest對象,那麼下次執行的時候這種支援性並不會改變,沒必要再進行一邊檢測,即使只有一個if語句,執行也肯定比沒有要慢,如果我們可以讓if語句不必每次執行,那麼就可以在頻繁調用的情況下提高執行速度。解決方案就是稱之為惰性載入的技巧。

惰性載入

惰性載入表示函數執行的分支只會在函數第一次掉用的時候執行,在第一次調用過程中,該函數會被覆蓋為另一個按照合適方式執行的函數,這樣任何對原函數的調用就不用再經過執行的分支了。createXHR函數可以被改寫為這樣

function createXHR(){                var xhr=null;                if(typeof XMLHttpRequest !='undefined'){                    xhr = new XMLHttpRequest();                    createXHR=function(){                        return new XMLHttpRequest();                    }                }else{                    try {                        xhr = new ActiveXObject("Msxml2.XMLHTTP");                        createXHR=function(){                            return new ActiveXObject("Msxml2.XMLHTTP");                        }                    }                    catch (e) {                        try {                            xhr = new ActiveXObject("Microsoft.XMLHTTP");                            createXHR=function(){                                return new ActiveXObject("Microsoft.XMLHTTP");                            }                        }                        catch (e) {                            createXHR=function(){                                return null;                            }                        }                    }                }                return xhr;            }

在這個惰性載入的createXHR中第一次執行的時候每個分支都會為createXHR重新賦值,覆蓋原函數,返回xhr對象,而第二次執行的時候就會直接調用重寫後的函數,這樣就不必執行每個分支重新做檢測了。

優點

惰性載入函數有兩個主要優點,第一是顯而易見的效率問題,雖然在第一次執行的時候函數會意味賦值而執行的慢一些,但是後續的調用會因為避免的重複資料偵測更快;第二個是要執行的適當代碼只有當實際調用函數是才執行,很多JavaScript庫在在載入的時候就根據瀏覽器不同而執行很多分支,把所有東西實現設定好,而惰性載入函數將計算延遲,不影響初始指令碼的執行時間。

轉載至http://www.cnblogs.com/dolphinX/p/3251165.html

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在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.