zoukankan      html  css  js  c++  java
  • JavaScript 流程控制器

    已知有流程step1、step2、step3、step4、step5 , 如何控制输出下面过程

    例如:

    1:step1、step2、step3、step2、step3、step4、step5

    2:step1、step2、step4、step5

    3:step1、step2、step4、step5、step3、step4、step5

    /*
    * 流程控制器
    * 作者:caoke
    * */
    
    class Step{
        //初始化
        constructor(stepArr,callback){
    
            this.stepArr=stepArr;
            this.curIndex=0;
            this.isPaused=false;
            this.nextMode=null;
            this.curStep=this.stepArr[this.curIndex];
            this.hasRunTimes={};
            this.stepArr.forEach( (step)=> {
                this.hasRunTimes[step]=0;
            })
            this.callback=callback;
        }
        callback(){
            this.go()
        }
        // 运行当前流程
        run(){
            this.curStep=this.stepArr[this.curIndex]
            if(this.curStep){
                this.hasRunTimes[this.curStep]++
                this.callback&&this.callback.apply(this,[this.curStep,this.hasRunTimes[this.curStep]])
            }
        }
        // 跳转到某个流程
        go(step){
            this.clear()
            if(step){
                this.curIndex=this.stepArr.indexOf(step)
            }else{
                this.curIndex++
            }
            this.run()
        }
    
        // 进入下一个流程
        next(){
            if(this.nextMode){
                this.go(this.nextMode.nextStep)
            }else{
                this.go()
            }
        }
    
        // 自动进入下一步
        waitSecondAndGo(second,step){
            if(!this.isPaused){
               this.stopTimer()
            }
            const mode={
                startTime:new Date().getTime(),
                allSecond:second,
                leftSecond:second*1000,
                nextStep:step,
                timer:null,
            }
    
            //获得下一步
            if(this.nextMode==null||mode.leftSecond<this.nextMode.leftSecond){
                this.nextMode=mode;
            }
    
            if(!this.isPaused){
                this.startTimer()
            }
    
        }
        // 暂停
        pause(){
            if(!this.isPaused){
                this.isPaused=true;
                this.stopTimer()
    
            }
    
        }
        // 继续
        repause(){
            if(this.isPaused){
                this.isPaused=false;
                this.startTimer()
            }
    
        }
        stopTimer(){
            if(this.nextMode&&this.nextMode.timer){
                const duration=new Date().getTime()-this.nextMode.startTime;
                this.nextMode.leftSecond=this.nextMode.leftSecond-duration;
    
                clearTimeout(this.nextMode.timer);
                this.nextMode.timer=null;
            }
        }
        startTimer(){
            if(this.nextMode&&this.nextMode.timer==null){
                this.nextMode.startTime=new Date().getTime();
                this.nextMode.timer=setTimeout(() => {
                    this.go(this.nextMode.nextStep)
                },this.nextMode.leftSecond)
            }
        }
        // 销毁
        clear(){
            if(this.nextMode){
                if(this.nextMode.timer){
                    clearTimeout(this.nextMode.timer);
                    this.nextMode.timer=null
                }
                this.nextMode=null
            }
        }
    }
    export default Step;
    

      

      

      

      

      

      

  • 相关阅读:
    BZOJ 1499 NOI2005 瑰丽华尔兹 单调队列
    大整数乘法python3实现
    GPIO
    Java程序猿从笨鸟到菜鸟之(九十二)深入java虚拟机(一)——java虚拟机底层结构具体解释
    TCP三次握手和四次挥手具体解释
    vector的成员函数解析
    Yii PHP Framework有用新手教程
    管道(Pipe)/createPipe
    android使用自己定义属性AttributeSet
    ASP连接sql server实例解析
  • 原文地址:https://www.cnblogs.com/caoke/p/9892138.html
Copyright © 2011-2022 走看看