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 相关文章推荐
javascript parseInt 大改造
Sep 27 Javascript
jQuery模拟超链接点击效果代码
Apr 21 Javascript
js使用栈来实现10进制转8进制与取除数及余数
Jun 11 Javascript
javascript设置连续两次点击按钮时间间隔的方法
Oct 28 Javascript
Javascript学习笔记之函数篇(四):arguments 对象
Nov 23 Javascript
分享20个提升网站界面体验的jQuery插件
Dec 15 Javascript
阻止表单提交按钮多次提交的完美解决方法
May 16 Javascript
js获取元素的外链样式的简单实现方法
Jun 06 Javascript
vue中的非父子间的通讯问题简单的实例代码
Jul 19 Javascript
js实现简易聊天对话框
Aug 17 Javascript
浅谈微信页面入口文件被缓存解决方案
Sep 29 Javascript
element-ui带输入建议的input框踩坑(输入建议空白以及会闪出上一次的输入建议问题)
Jan 15 Javascript
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
网站当前的在线人数
2006/10/09 PHP
php文件上传表单摘自drupal的代码
2011/02/15 PHP
PHP获取http请求的头信息实现步骤
2012/12/16 PHP
php redis实现文章发布系统(用户投票系统)
2017/03/04 PHP
PHP简单实现模拟登陆功能示例
2017/09/15 PHP
PHP数据源架构模式之表入口模式实例分析
2020/01/23 PHP
jQuery 全选效果实现代码
2009/03/23 Javascript
jquery.validate分组验证代码
2011/03/17 Javascript
jQuery.each()用法分享
2012/07/31 Javascript
jQuery页面图片伴随滚动条逐渐显示的小例子
2013/03/21 Javascript
jquery解析JSON数据示例代码
2014/03/17 Javascript
JavaScript中的cacheStorage使用详解
2015/07/29 Javascript
JS实现常见的TAB、弹出层效果(TAB标签,斑马线,遮罩层等)
2015/10/08 Javascript
深入浅析JavaScript中数据共享和数据传递
2016/04/25 Javascript
谈谈因Vue.js引发关于getter和setter的思考
2016/12/02 Javascript
Vuejs实现购物车功能
2017/11/05 Javascript
详解webpack提取第三方库的正确姿势
2017/12/22 Javascript
解决iView中时间控件选择的时间总是少一天的问题
2018/03/15 Javascript
vue-router动态设置页面title的实例讲解
2018/08/30 Javascript
vue实现百度下拉列表交互操作示例
2019/03/12 Javascript
vue中的.$mount('#app')手动挂载操作
2020/09/02 Javascript
Python使用random和tertools模块解一些经典概率问题
2015/01/28 Python
django实现分页的方法
2015/05/26 Python
基于python实现微信模板消息
2015/12/21 Python
Python网络爬虫与信息提取(实例讲解)
2017/08/29 Python
Python OpenCV实现视频分帧
2019/06/01 Python
手写一个python迭代器过程详解
2019/08/27 Python
Python SMTP配置参数并发送邮件
2020/06/16 Python
英国最大的电子产品和家电零售企业:Currys PC World
2016/09/24 全球购物
全球航班旅行搜索网站:Cheapflights
2017/05/19 全球购物
阿联酋网上花店:Ferns N Petals
2018/02/14 全球购物
经贸日语专业个人求职信
2013/12/13 职场文书
婚假请假条怎么写
2014/04/10 职场文书
博士生导师推荐信
2014/07/08 职场文书
机关作风整顿个人整改措施思想汇报
2014/09/29 职场文书
大学感恩节活动总结
2015/05/05 职场文书