本文實例講述了JS優化與惰性載入函數。分享給大家供大家參考，具體如下：
惰性載入函數
由于現在瀏覽器之間的差異，為了實現跨瀏覽器工作，很多函數要書寫大量if語句或者try…catch…語句。當每次調用函數時，都要對每個if分支或try語句進行檢查，這樣會使得瀏覽器反應變慢。實際上，當我們用某個瀏覽器打開網頁時，就決定了某個if分支或try語句是可用的，沒有必要每次調用都檢查。為了解決以上問題，JavaScript中出現一種名為惰性載入的技巧。
惰性載入表示函數執行的分支僅會發生一次。有兩種實現惰性載入的方式：在函數被調用時再處理函數；在聲明函數時就指定適當函數。
借用JavaScript高級程序設計中的例子來說明這兩種解決方案。
創建XHR對象的兼容寫法如下：
function createXHR(){ if (typeof XMLHttpRequest != "undefined"){ return new XMLHttpRequest(); } else if (typeof ActiveXObject != "undefined"){ if (typeof arguments.callee.activeXString != "string"){ var versions = ["MSXML2.XMLHttp.6.0", "MSXML2.XMLHttp.3.0", "MSXML2.XMLHttp"]; for (var i=0,len=versions.length; i < len; i++){ try { var xhr = new ActiveXObject(versions[i]); arguments.callee.activeXString = versions[i]; return xhr; } catch (ex){ //skip } } } return new ActiveXObject(arguments.callee.activeXString); } else { throw new Error("No XHR object available."); }}使用惰性載入的第一種方法――在函數被調用時再處理函數：
function createXHR(){ if(typeof XMLHttpRequest!="undefined"){ createXHR=function(){ return new XMLHttpRequest(); }; }else if(typeof ActiveXObject!="undefined"){ createXHR=function(){ if(typeof arguments.callee.activeXString!="string"){ var versions=["MSXML2.XMLHttp.6.0","MSXML2.XMLHttp.3.0","MSXML2.XMLHttp"], i,len; for(i=0,len=versions.length;i<len;i++){ try{ new ActiveXObject(versions[i]); arguments.callee.activeXString=versions[i]; break; }catch(ex){ //skip } } } return new ActiveXObject(arguments.callee.activeXString); }; }else{ createXHR=function(){ throw new Error("No XHR object available."); }; } return CreateXHR();}使用惰性載入的第二種方法――在聲明函數時就指定適當函數：
var createXHR=(function(){ if(typeof XMLHttpRequest!="undefined"){ return function(){ return new XMLHttpRequest(); }; }else if(typeof ActiveXObject!="undefined"){ return function(){ if(typeof arguments.callee.activeXString!="string"){ var versions=["MSXML2.XMLHttp.6.0","MSXML2.XMLHttp.3.0","MSXML2.XMLHttp"], i,len; for(i=0,len=versions.length;i<len;i++){ try{ new ActiveXObject(versions[i]); arguments.callee.activeXString=versions[i]; break; }catch(ex){ //skip } } } return new ActiveXObject(arguments.callee.activeXString); }; }else{ return function(){ throw new Error("No XHR object available."); }; }})();上例中，使用的是一個匿名、自執行的函數，用以確定應該使用哪個函數。
以上兩種使用惰性載入函數的共同優點是，只在第一次執行函數時犧牲部分性能，可以提高代碼效率。
更多關于JavaScript相關內容可查看本站專題：《javascript面向對象入門教程》、《JavaScript中json操作技巧總結》、《JavaScript切換特效與技巧總結》、《JavaScript查找算法技巧總結》、《JavaScript動畫特效與技巧匯總》、《JavaScript錯誤與調試技巧總結》、《JavaScript數據結構與算法技巧總結》、《JavaScript遍歷算法與技巧總結》及《JavaScript數學運算用法總結》
希望本文所述對大家JavaScript程序設計有所幫助。
新聞熱點
疑難解答
