ExtJS 中所谓的“线程类“ TaskRunner 和 DelayedRunner,本质上都是调用了window对象的 setInterval 方法。
setInterval 的第一个参数是一段js代码,第二个参数是毫秒值。它将作为参数传入的js代码每隔一段时间调用一次,
两次调用间的时间间隔由第二个参数指定,直到 setInterval 返回的计数器被 clearInterval 方法释放。
可按如下方法实例化 ExtJS 的 TaskRunner 线程对象:
var runner = new Ext.util.TaskRunner();
//配置该线程实例的启动方法
runner.start({
run: function(){
console.log( ' Take action! ' );
},
interval: 1000, //每秒执行一次
repeat: 5 //重复执行5次
});
参考之前文章介绍的“配置注入式”继承方法,下面试着自己动手创建js线程类并实例化:
//定义js线程对象
var TaskRunner = function(config){
this.start = function(){
if(!config) return;
var interval = 0;
//检验输入的interval值,如果合法,则覆盖默认的interval值
if(config.interval && config.interval > 0 ){
interval = config.interval;
}
var repeat = 1;
//检验输入的repeat值,如果合法,则覆盖默认的repeat值
if(config.repeat && config.repeat > 1 ){
repeat = config.repeat;
}
//定义一个指向计时器对象的引用
var timer = null;
//检验输入的run值,如果不为空且是js函数,则该方法被调用
if(config.run && typeof(config.run) == 'function'){
//config.run()函数将被调用repeat次,每次间隔interval毫秒
timer = window.setInterval(function(){
config.run();
repeat--;
if( repeat<= 0 ){
clearInterval(timer);//如已重复repeat次,释放计时器
//检验输入的callback值,如果不为空且是js函数,则该方法被调用
if(config.callback && typeof(config.callback) == 'function'){
config.callback();
}
}
}, interval);
}
}
};
//创建js线程对象实例
var runner = new TaskRunner({
//这里约定变量run所引用的函数将会在一个“线程”中被多次调用
run: (function(){
//利用闭包产生的私有变量,只能被如下的匿名函数访问
var counter = 1;
return function(){//该匿名函数的引用将被赋给run
console.log('Just say hi at the '+counter+' times!');
counter ++;
};
})(), //左侧的括号说明函数在定义后被立即执行
interval: 2000, // run函数每间隔2000毫秒被调用一次
repeat: 5, // run函数共计被调用5次
//定义回调函数,在线程结束时它被调用
callback: function(){
console.log('Bye~');
}
});
runner.start(); //启动线程
运行上述代码后,浏览器控制台显示如下信息:
Just say hi at the 1 times!
Just say hi at the 2 times!
Just say hi at the 3 times!
Just say hi at the 4 times!
Just say hi at the 5 times!
Bye~
这种由计时器控制的线程,因为结束时间不容易确定,所以回调函数 callback 的添加通常是必不可少的。
需要注意的是,针对“注入”的配置对象config,因为用户的实际应用环境比较复杂,所以输入检验是必不可少的。
这些都依赖于配置对象config 和类之间完善的“约定”,对于大量采用“注入”方式的 ExtJS,想要称心如意地使用,
熟练地查阅文档和示例是关键。