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 相关文章推荐
jQuery select控制插件
Aug 17 Javascript
收集json解析的四种方法分享
Jan 17 Javascript
Javascript中Array.prototype.map()详解
Oct 22 Javascript
z-blog SyntaxHighlighter 长代码无法换行解决办法(jquery)
Nov 16 Javascript
JavaScript更改字符串的大小写
May 07 Javascript
jQuery实现的个性化返回底部与返回顶部特效代码
Oct 30 Javascript
学习JavaScript设计模式(继承)
Nov 26 Javascript
AngularJs Managing Service Dependencies详解
Sep 02 Javascript
详解从Vue.js源码看异步更新DOM策略及nextTick
Oct 11 Javascript
React Native react-navigation 导航使用详解
Dec 01 Javascript
通过实例讲解JS如何防抖动
Jun 15 Javascript
解决vue项目本地启动时无法携带cookie的问题
Feb 06 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
经典的星际争霸,满是回忆的BGM
2020/04/09 星际争霸
php 信息采集程序代码
2009/03/17 PHP
php记录代码执行时间(实现代码)
2013/07/05 PHP
PHP利用APC模块实现大文件上传进度条的方法
2015/10/29 PHP
学习php设计模式 php实现访问者模式(Visitor)
2015/12/07 PHP
php实现图片以base64显示的方法
2016/10/13 PHP
laravel利用中间件做防非法登录和权限控制示例
2019/10/21 PHP
IE iframe的onload方法分析小结
2010/01/07 Javascript
JavaScript CSS 修改学习第四章 透明度设置
2010/02/19 Javascript
vue实现简单实时汇率计算功能
2017/01/15 Javascript
javascript笔记之匿名函数和闭包
2017/02/06 Javascript
详解weex默认webpack.config.js改造
2018/01/08 Javascript
create-react-app修改为多页面支持的方法
2018/05/17 Javascript
详解使用 Node.js 开发简单的脚手架工具
2018/06/08 Javascript
vue 引用自定义ttf、otf、在线字体的方法
2019/05/09 Javascript
解决Vue动态加载本地图片问题
2019/10/09 Javascript
vue使用微信扫一扫功能的实现代码
2020/04/11 Javascript
[56:00]DOTA2上海特级锦标赛主赛事日 - 4 胜者组决赛Secret VS Liquid第一局
2016/03/05 DOTA
[50:27]Secret vs VG 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/20 DOTA
常见python正则用法的简单实例
2016/06/21 Python
python django 访问静态文件出现404或500错误
2017/01/20 Python
Python 数据结构之旋转链表
2017/02/25 Python
简单实现python收发邮件功能
2018/01/05 Python
Python+matplotlib实现计算两个信号的交叉谱密度实例
2018/01/08 Python
python调用百度语音识别实现大音频文件语音识别功能
2018/08/30 Python
python绘制漏斗图步骤详解
2019/03/04 Python
浅析Python 读取图像文件的性能对比
2019/03/07 Python
Python异步编程之协程任务的调度操作实例分析
2020/02/01 Python
Python3使用tesserocr识别字母数字验证码的实现
2021/01/29 Python
请用用Java代码写一个堆栈
2012/01/26 面试题
体育教师自荐信范文
2013/12/16 职场文书
法学个人求职信范文
2014/01/27 职场文书
销售顾问工作计划书
2014/09/15 职场文书
护士长2015年终工作总结
2015/04/24 职场文书
车间安全生产管理制度
2015/08/06 职场文书
一文搞懂python异常处理、模块与包
2021/06/26 Python