惰性函数——JS高级

我们先来看一下js的异步提交。

XHR我们在原生的时候常常用到，因为常用到，我们更多把封装到了工具库中

先看下他最常用的实现

 1 // 旧方法 2  3 function createXHR() { 4     var xhr; 5     try{ 6         xhr = new xmlHttPRequest(); 7     }catch(e) { 8         handleErr(e); 9 10         try {11             xhr = new ActiveXObject("Msxml2.xmlhttp");12         }catch(e) {13             try{14                 xhr = new ActiveXObject("Microsoft.XMLHTTP");15             }catch(e) {16                 xhr = null;17             }18         }19     }20 21     return xhr ;22 }23 24 function handleErr(error) {25     // 这一步在实战中很重要，因为catch会延长作用域链，所以是在全局作用域声明的e26     // 这里我们把它赋给局部变量，则查找更快27     var err = error;28 29     // do sth.30 }

没错吧？这是最常见的createXHR实现方法了。

那

如题，这里要说的 惰性函数 是什么东西呢？

我们先说它的作用： 优化被经常调用到的函数。

这也属于JS高级中的一部分

不多说，直接上代码

 1 // 惰性函数 2 // 第二次才生效 3 // 作用：优化对于被频繁使用的函数 4 function createXHR() { 5     var xhr; 6     if(typeof XMLHttpRequest != 'undefined') { 7         xhr = new XMLHttpRequest(); 8         createXHR = function() { 9             return new XMLHttpRequest();10         }11     }else {12         try {13             xhr = new ActiveXObject("Msxml2.XMLHTTP");14             createXHR = function() {15                 return new ActiveXObject("Msxml2.XMLHTTP");16             }17         }catch(e) {18             try {19                 xhr = new ActiveXObject("Microsoft.XMLHTTP");20                 createXHR = function() {21                     return new ActiveXObject("Microsoft.XMLHTTP");22                 }23             }catch(e) {24                 createXHR = function () {25                     return null;26                 }27             }28         }29     }30     return xhr 31 }

代码中，我们让函数在第一次运行之后，则判断除了浏览器的环境，就被重新赋值了。赋值后的函数是直接return 对应的方法。

所以，这个函数，需要第二次调用的时候才真正的被调用。

正是因为它第二次调用函数的时候，没有去走第一次调用那样复杂的判断的路，所以显得“懒惰”。因此我们叫它 惰性函数