1.0.8 • Published 4 years ago
async-loop-timer v1.0.8
使用
npm
npm i async-loop-timer
github
下载该项目,将lib中的代码复制到你的项目中。
引用index.js即可可以通过不同的方式引入不同输出文件.
- index.js -> umd 通用方式
- index.es.js -> es (export/import)
- index.cjs.js -> commonjs
- index.amd.js -> amd
script 引入
- script标签链入src中的AsyncLoop.js 即可。
或者引入index.js。用例:
```
<script> const AsyncLoop = window.asynclooptimer //绑定在全局synclooptimer变量了。 其余操作和用法请看下面接口说明。 let myInterval = new AsyncLoop(); function timeoutFn(){ // 模拟异步函数 setTimeout(function(){ console.log('2000ms异步函数'); // 异步回调... myInterval.request(); //需要在循环函数尾部调起下次循环 }, 2000) } myInterval.init(() => { timeoutFn(); }, 5000, 'diff'); myInterval.start(); </script>
说明
github中 index.html 中即为使用用例。推荐测试
代码中也有详细注释。
可进行二次加工修改以符合个人使用。
sum && diff 周期时序图
- sum模式周期时序图 500ms为例
rfn########---------------rfn##---------------rfn########################---------------rfn#### -----------500ms##########-----500ms##########---------------------------500ms##########
- diff模式周期时序图 500ms为例
rfn########----rfn############rfn########################rfn####--------rfn######------rfn#### 500ms##########500ms##########500ms##########------------500ms##########500ms##########
语法(模块化引入)
let myInterval = new AsyncLoop()
Api
1. init
init 初始化 loopFn, cycleTime, mode(可选)
可通过 init 重新初始化实例内容
语法:
myInterval.init(loopFn, cycleTime [, mode])
使用方法一
function timeoutFn() {
// 模拟异步函数
setTimeout(function(){
// 异步回调...
myInterval.request(); //需要在循环函数尾部调起下次循环
}, 2000)
}
myInterval.init(() => {
timeoutFn();
}, 5000, 'diff');
使用方法二
function timeoutFn() {
// 模拟异步函数
return new Promise((resolve) => {
setTimeout(function(){
// 异步回调...
resolve()
}, 2000)
})
}
myInterval.init(async () => {
await timeoutFn();
myInterval.request();
}, 5000, 'diff');
loopFn
你需要循环的异步函数
cycleTime
基本循环周期:sum模式下为
loopFnTime + cycleTime
, diff模式下为max(loopFntime, cycleTime);
loopFnTime 为异步函数执行时间
mode (可选)
循环模式:分为sum和diff模式,默认为sum
1. sum模式周期时序图 500ms为例
rfn########---------------rfn##---------------rfn########################---------------rfn####
-----------500ms##########-----500ms##########---------------------------500ms##########
2. diff模式周期时序图 500ms为例
rfn########----rfn############rfn########################rfn####--------rfn######------rfn####
500ms##########500ms##########500ms##########------------500ms##########500ms##########
rfn######## 为异步函数执行;500ms########## 为基准周期;
2. request
主功能函数, 相当于调用一次循环;需要写在异步函数尾部,具体看init的使用方式。
语法:
myInterval.request([time])
使用
myInterval.request(0)
表示立即调用一次循环
time (可选)
会在time时间后调用异步函数,如缺省则使用初始化时的循环周期。
3. initJudge
initJudge 初始化前置条件函数,默认为null,当其返回结果为true时进入主函数,否则不执行loopFn直接进入下一次循环。
语法
myInterval.initJudge(JudgeFn);
使用
let list = [1, 2, 3];
myInterval.initJudge(function() {
return list.length > 2;
});
4. start
start 开始循环
使用
myInterval.start();
5. stop
stop 停止循环
使用
myInterval.stop();
6. restart
restart 重启循环。
使用
myInterval.restart();