在写JavaScript代码的时候,异步回调是一个非常常见的特征。完善的回调会有和超时相关的设置,例如Ajax的timeout选项。那如果SDK提供的异步调用函数中没有提供超时设置,在出现异常的时候就只能干等了吗?这当然是不能忍的。
我们先构造一个没有提供超时设置的回调函数:
function myTimeout(options) { options = options || {}; setTimeout(function () { options.callback("called!"); }, 5000);}
上面的代码很简单,5秒后回调送进去的回调函数。如果我们要为这个异步回调提供超时设置,例如3秒钟超时,那么该怎么弄呢?
(function () {var oldMyTimeout = myTimeout;myTimeout = function (options) { var timeoutFlag = false; var timeoutHandle = -1; var timeout = options.timeout; var callback = options.callback; var hookCallback = function () { if(timeoutFlag == true) return; // 检测到超时,不再执行后面的实际回调函数 clearTimeout(timeoutHandle); // 清空超时控制器 return callback.apply(this, Array.prototype.slice.call(arguments)); //调用原始的回调函数 } options.callback = hookCallback; if(timeout > 0) { // 超时设置小于0时,不进行超时检测 timeoutHandle = setTimeout(function() { timeoutFlag = true; callback("已经超时(" + timeout + "ms)"); }, timeout); } oldMyTimeout(options);}})();
可以用下面代码进行测试:
// called!myTimeout({ callback: function (data) {console.log(data);}, timeout: 6000});// 已经超时(4000ms)myTimeout({ callback: function (data) {console.log(data);}, timeout: 4000});