惰性函数——JS高级

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

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

先看下他最常用的实现

// 旧方法

function createXHR() {
var xhr;
try{
xhr = new XMLHttpRequest();
}catch(e) {
handleErr(e);

try {
xhr = new ActiveXObject("Msxml2.XMLHTTP");
}catch(e) {
try{
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}catch(e) {
xhr = null;
}
}
}

return xhr ;
}

function handleErr(error) {
// 这一步在实战中很重要，因为catch会延长作用域链，所以是在全局作用域声明的e
// 这里我们把它赋给局部变量，则查找更快
var err = error;

// do sth.
}

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

那

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

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

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

不多说，直接上代码

// 惰性函数
// 第二次才生效
// 作用：优化对于被频繁使用的函数
function createXHR() {
var xhr;
if(typeof XMLHttpRequest != 'undefined') {
xhr = new XMLHttpRequest();
createXHR = function() {
return new XMLHttpRequest();
}
}else {
try {
xhr = new ActiveXObject("Msxml2.XMLHTTP");
createXHR = function() {
return new ActiveXObject("Msxml2.XMLHTTP");
}
}catch(e) {
try {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
createXHR = function() {
return new ActiveXObject("Microsoft.XMLHTTP");
}
}catch(e) {
createXHR = function () {
return null;
}
}
}
}
return xhr
}

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

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

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