JavaScript AJAX之惰性载入函数


Posted in Javascript onAugust 27, 2014

在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 相关文章推荐
js 时间格式与时间戳的相互转换示例代码
Dec 25 Javascript
node.js中的path.sep方法使用说明
Dec 08 Javascript
必备的JS调试技巧汇总
Jul 20 Javascript
解决wx.onMenuShareTimeline出现的问题
Aug 16 Javascript
JS实现的手机端精简幻灯片效果
Sep 05 Javascript
JavaScript与java语言有什么不同
Sep 22 Javascript
jQuery删除当前节点元素
Dec 07 Javascript
Vue2.0父组件与子组件之间的事件发射与接收实例代码
Sep 19 Javascript
React SSR样式及SEO的实践
Oct 22 Javascript
微信小程序实现两边小中间大的轮播效果的示例代码
Dec 07 Javascript
js 实现碰撞检测的示例
Oct 28 Javascript
解决vue自定义组件@click点击失效问题
Apr 30 Vue.js
IE浏览器不支持getElementsByClassName的解决方法
Aug 27 #Javascript
JavaScript中使用stopPropagation函数停止事件传播例子
Aug 27 #Javascript
JavaScript闭包函数访问外部变量的方法
Aug 27 #Javascript
JavaScript中switch判断容易犯错的一个细节
Aug 27 #Javascript
JavaScript中使用arguments获得函数传参个数实例
Aug 27 #Javascript
JavaScript中输出标签的方法
Aug 27 #Javascript
JavaScript实现的GBK、UTF8字符串实际长度计算函数
Aug 27 #Javascript
You might like
收听短波不可能有声音清晰的品质吗
2021/03/01 无线电
php4的彩蛋
2006/10/09 PHP
php中使用redis队列操作实例代码
2013/02/07 PHP
php实现把数组按指定的个数分隔
2014/02/17 PHP
详解YII关联查询
2016/01/10 PHP
php将一维数组转换为每3个连续值组成的二维数组
2016/05/06 PHP
PHP实现实时生成并下载超大数据量的EXCEL文件详解
2017/10/23 PHP
JS小功能(setInterval实现图片效果显示时间)实例代码
2013/11/28 Javascript
JavaScript实现获取dom中class的方法
2015/02/09 Javascript
jQuery对JSON数据进行排序输出的方法
2015/06/24 Javascript
javascript+html5实现绘制圆环的方法
2015/07/28 Javascript
jQuery实现自动切换播放的经典滑动门效果
2015/09/12 Javascript
javascript图片切换综合实例(循环切换、顺序切换)
2016/01/13 Javascript
jQuery 常用代码集锦(必看篇)
2016/05/16 Javascript
通过JS获取Request.QueryString()参数的值实现方法
2016/09/27 Javascript
微信小程序  Mustache语法详细介绍
2016/10/27 Javascript
完全深入学习Bootstrap表单
2016/11/28 Javascript
详谈jQuery.load()和Jsp的include的区别
2017/04/12 jQuery
Vuex之理解Mutations的用法实例
2017/04/19 Javascript
React Native之prop-types进行属性确认详解
2017/12/19 Javascript
animate.css在vue项目中的使用教程
2018/08/05 Javascript
vue 自定义提示框(Toast)组件的实现代码
2018/08/17 Javascript
Python查看多台服务器进程的脚本分享
2014/06/11 Python
django 基于中间件实现限制ip频繁访问过程详解
2019/07/30 Python
在 Jupyter 中重新导入特定的 Python 文件(场景分析)
2019/10/27 Python
基于pycharm 项目和项目文件命名规则的介绍
2021/01/15 Python
Canvas 文本填充线性渐变的使用详解
2020/06/22 HTML / CSS
美国女鞋品牌:naturalizer(娜然)
2016/08/01 全球购物
房产授权委托书范本
2014/09/22 职场文书
离婚协议书范本(2014版)
2014/09/28 职场文书
2015年试用期自我评价范文
2015/03/10 职场文书
部门优秀员工推荐信
2015/03/24 职场文书
幼儿园万圣节活动总结
2015/05/05 职场文书
功夫熊猫观后感
2015/06/10 职场文书
python中sqllite插入numpy数组到数据库的实现方法
2021/06/21 Python
java实现面板之间切换功能
2022/06/10 Java/Android