手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >JavaScript AJAX之惰性载入函数
JavaScript AJAX之惰性载入函数
摘要:在JS中有些内存只需执行一遍即可,如浏览器类型检测是最常用的一个功能,因为我们使用Ajax的时候需要检测浏览器的内置的XHR。我们可以在第一...

在JS中有些内存只需执行一遍即可,如浏览器类型检测是最常用的一个功能,因为我们使用Ajax的时候需要检测浏览器的内置的XHR。我们可以在第一次检测的时候记录下类型,往后在使用Ajax的时候就不需要再去检测浏览器类型了。在JS中就算只有一个if也总比没有if的语句效率要高。

普通Ajax方法

复制代码 代码如下:

/**

* JS惰性函数

*/

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";

}

}

每次调用ajax()函数都要对浏览器内置的XHR检查,效率不高。

使用惰性方式的方法

复制代码 代码如下:

/**

* JS惰性函数

*/

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()变量赋值,有效覆盖了原有函数,最后一步调用新的函数。下一次调用的ajax()的时候,就直接调用变量。

优化重点

要执行特定代码只有实际调用才执行,而某些JS库一开始就检测浏览器,预先设置好。

由于加了复杂的判断所以首次运行速度慢,但后边的多册运行的效率会更快。

有时候写代码久了,不能一成不变,要经常思考怎样才能使程序运行的更快,更有效率。这样的思考下写出来的程序才是精装,而不会产生多余的垃圾代码。这也不是简单OO就能一刀切,实际上代码很多地方都是活的,人更是活的。

【JavaScript AJAX之惰性载入函数】相关文章:

JavaScript中的pow()方法使用

JavaScript编程学习技巧汇总

JavaScript function函数种类详解

JavaScript中Cookies的相关使用教程

在JavaScript中使用JSON数据

JavaScript常用数组算法小结

JavaScript中eval函数的问题

基于JavaScript实现智能右键菜单

JavaScript Array对象详解

javascript基础知识分享之类与函数化

精品推荐
分类导航