JavaScript AJAX之惰性載入函數(shù)
更新時間：2014年08月27日 10:56:12 投稿：junjie
這篇文章主要介紹了JavaScript AJAX之惰性載入函數(shù),惰性載入表示函數(shù)執(zhí)行的分支僅會發(fā)生1次,是種JS的優(yōu)化技巧,需要的朋友可以參考下
在JS中有些內(nèi)存只需執(zhí)行一遍即可，如瀏覽器類型檢測是最常用的一個功能，因為我們使用Ajax的時候需要檢測瀏覽器的內(nèi)置的XHR。我們可以在第一次檢測的時候記錄下類型，往后在使用Ajax的時候就不需要再去檢測瀏覽器類型了。在JS中就算只有一個if也總比沒有if的語句效率要高。
普通Ajax方法
復(fù)制代碼 代碼如下:
/**
* JS惰性函數(shù)
*/
function ajax(){
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,k=version.length;i<k;i++){
try{
new ActiveXObject(versions[i]);
arguments.callee.activeXString = versions[i];
break;
}catch(ex){
throw ex;
}
}
}
return new ActiveXObject(arguments.callee.activeXString);
}else{
throw "No XHR object";
}
}
每次調(diào)用ajax()函數(shù)都要對瀏覽器內(nèi)置的XHR檢查，效率不高。
使用惰性方式的方法
復(fù)制代碼 代碼如下:
/**
* JS惰性函數(shù)
*/
function ajax(){
if(typeof XMLHttpRequest != "undefined"){
ajax = function(){
return new XMLHttpRequest();
};
}else if(typeof ActiveXObject != "undefined"){
ajax = function(){
if(typeof arguments.callee.activeXString != "string"){
var versions = ["MSXML2.XMLHttp.6.0","MSXML2.XMLHttp.3.0","MSXML2.XMLHttp"];
for(var i=0,k=version.length;i<k;i++){
try{
var xhr = new ActiveXObject(versions[i]);
arguments.callee.activeXString = versions[i];
return xhr;
}catch(ex){
throw ex;
}
}
}
return new ActiveXObject(arguments.callee.activeXString);
}
}else{
ajax = function(){
throw "No XHR object";
}
}
return ajax();
}
在第二個惰性方法中if的每個分支都會為ajax()變量賦值，有效覆蓋了原有函數(shù)，最后一步調(diào)用新的函數(shù)。下一次調(diào)用的ajax()的時候，就直接調(diào)用變量。
優(yōu)化重點
要執(zhí)行特定代碼只有實際調(diào)用才執(zhí)行，而某些JS庫一開始就檢測瀏覽器，預(yù)先設(shè)置好。
由于加了復(fù)雜的判斷所以首次運行速度慢，但后邊的多冊運行的效率會更快。
有時候?qū)懘a久了，不能一成不變，要經(jīng)常思考怎樣才能使程序運行的更快，更有效率。這樣的思考下寫出來的程序才是精裝，而不會產(chǎn)生多余的垃圾代碼。這也不是簡單OO就能一刀切，實際上代碼很多地方都是活的，人更是活的。
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了js原生輪播圖插件制作，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-10-10
淡入淡出效果想必大家都有見到過吧，在本文將為大家介紹下使用js如何控制淡入淡出，感興趣的朋友可以參考下2013-11-11
Webpack-cli安裝成功后查看webpack -v報錯案例詳解
這篇文章主要介紹了Webpack-cli安裝成功后查看webpack -v報錯案例詳解,本篇文章通過簡要的案例,講解了該項技術(shù)的了解與使用,以下就是詳細(xì)內(nèi)容,需要的朋友可以參考下2021-09-09
本文簡單介紹動態(tài)加載、移除、替換js/css文件的示例代碼，代碼簡單易懂，非常不錯，具有參考借鑒加載，需要的朋友參考下吧2018-03-03
JavaScript實現(xiàn)多維數(shù)組的方法
這篇文章主要介紹了JavaScript實現(xiàn)多維數(shù)組的方法，有需要的朋友可以參考一下2013-11-11
這篇文章主要給大家總結(jié)介紹了關(guān)于微信小程序頁面間跳轉(zhuǎn)傳參方式，文中通過示例代碼介紹的非常詳細(xì)，對大家學(xué)習(xí)或者使用小程序具有一定的參考學(xué)習(xí)價值，需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧2019-06-06
昨天閑著沒事，又因為工作需要，寫了一個腳本，用來做ftp。當(dāng)然不是直接做ftp，而是產(chǎn)生一個ftp的腳本，供ftp命令使用。2013-07-07
js中substr,substring,indexOf,lastIndexOf，split，replace的用法詳解
這篇文章主要介紹了js中substr,substring,indexOf,lastIndexOf，split，replace的用法詳解的相關(guān)資料,需要的朋友可以參考下2015-11-11
菜單上下顯示的實現(xiàn)方法有很多,在本文將為大家介紹下使用js是如何實現(xiàn)的，需要的朋友不要錯過2013-11-11
本文通過實例代碼給大家介紹了JS中NEW的實現(xiàn)原理及重寫，本文通過實例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價值，需要的朋友參考下吧2020-02-02