javascript,setInterval函数从0开始计数

时间:2017-05-21 07:29:55

标签: javascript

我注意到,我的setInterval函数从1开始计数,有时甚至从10开始计数。但是如果我将间隔增加到大约20秒,它会从0开始正确计数。后续计数是正确的 - 每一步都添加一个,但是初始cnt值,如果我减少到internval到大约5秒,就会出错。

var stepProt = function () {
        console.log('started stepProt constructor'); 
        this.step = 20; //seconds
        this.cnt = 0;   //init counter, pointer to rtArr
    }; 

    stepProt.prototype.countingFnc = function () {
        console.log('started stepFnc.prototype.countingFnc');
        var msec = this.step*1000;
        var that = this;
        that.cnt=0;
        this.nameToStop = window.setInterval( function () {
            that.stepFnc(); }, msec );
    } 

    stepProt.prototype.stepFnc = function() {

        console.log (' 132 startedFnc rtG.prototype.stepFnc, this.cnt='+this.cnt );  //if interval is 5seconds, this.cnt usually starts from 1, but sometimes from 10, instead of starting from 0. All other steps are correct, +1 each time.
       /* here there is some logics, which takes time */
        this.cnt++;
    }; 

    var stepIn = new stepProt(); //instance
    stepIn.stepFnc();

可能是什么原因以及如何解决?

P.S。 实际上,我在window onload之前使用这个功能。也许这就是原因? 我在window.onload之前包含了许多脚本。 后来我为window.onload功能制作了单个脚本。

我把

var stepIn = new stepFnc(); //instance
stepIn.stepFnc();
在窗口onload之前

,因为如果我在window.onload中使用它,由于某种原因,其他函数不会将stepIn实例理解为可访问的全局变量。也许是因为我使用的是php模板。

3 个答案:

答案 0 :(得分:2)

您应该致电stepIn.countingFnc();开始此过程。另一件事是我更改了函数stepFnc的名称,因此它与构造函数名称的可读性不匹配。

var stepFnc = function () {
    console.log('started stepFnc constructor');
    this.step = 20; //seconds
    this.cnt = 0;   //init counter, pointer to rtArr
};

stepFnc.prototype.countingFnc = function () {
    console.log('started stepFnc.prototype.countingFnc');
    var msec = this.step*1000;
    var that = this;
    that.cnt=0;
    this.nameToStop = setInterval( function () {
        that.triggerFnc(); }, msec );
}

stepFnc.prototype.triggerFnc = function() {

    console.log (' 132 startedFnc rtG.prototype.stepFnc, this.cnt='+this.cnt );  //if interval is 5seconds, this.cnt usually starts from 1, but sometimes from 10, instead of starting from 0. All other steps are correct, +1 each time.
    /* here there is some logics, which takes time */
    this.cnt++;
};

var stepIn = new stepFnc();
stepIn.countingFnc();

希望这会有所帮助。 ;)

答案 1 :(得分:2)



var stepFnc = function () {
        console.log('started stepFnc constructor'); 
        this.step = 1; //seconds
        this.cnt = 0;   //init counter, pointer to rtArr
}; 

stepFnc.prototype.countingFnc = function () {
        console.log('started stepFnc.prototype.countingFnc');
        var msec = this.step*1000;
        var that = this;
        that.cnt=0;
        this.nameToStop = window.setInterval( function () {
            that.stepFnc(); }, msec );
}; 

stepFnc.prototype.stepFnc = function() {

        console.log (' 132 startedFnc rtG.prototype.stepFnc, this.cnt='+this.cnt );  //if interval is 5seconds, this.cnt usually starts from 1, but sometimes from 10, instead of starting from 0. All other steps are correct, +1 each time.
       /* here there is some logics, which takes time */
        this.cnt++;
}; 

var stepIn = new stepFnc();
stepIn.countingFnc();




答案 2 :(得分:0)

似乎原因是我在脚本中使用setInterval而不是window.onload,因此第一个计数器是错误的。我创建了函数来检查是否加载了javascript,而且我在setInterval中使用boolen只在加载了所有javascript之后开始计数。

var loadIn - 检查是否加载了javascript,并设置了loadIn.jsLoad = true。 if(loadIn.jsLoad){that.stepFnc(); }

代码检查

javascript已加载:this.jsLoad = true(主要是我需要这个),

加载了html:this.htmlLoad = true,

加载了js和html:this.bLoaded = true

 console.log('loading check started' ); 

    var loadProt = function () {
        this.bLoaded = "";
        this.checkLoadInt="";
        this.jsLoadFnc="";
        this.bDomainCheckPass = false; //assumes that domain is wrong
        this.beforeunload = ""; //event

        this.jsLoad = false;
        this.htmlLoad = false;
        this.bLoaded =false;

    }; 

    loadProt.prototype.checkLoadFnc = function() {
        console.log('startedFnc checkLoadFnc');
        this.htmlLoad = false;
        this.jsLoad = false; 
        if(document.getElementById("bottomPreloadSpan")) { this.htmlLoad =true; }
        this.jsLoad = this.jsLoadFnc(); 
        console.log( 'htmlLoad='+this.htmlLoad +',  jsLoad=' +this.jsLoad ) ; 
        this.bLoaded = this.htmlLoad && this.jsLoad;
        if( this.bLoaded ) { 
            this.stopIntervalFnc(); 
        }
    };

    loadProt.prototype.stopIntervalFnc = function() {
        console.log('startedFnc stopIntervalFnc');
        document.getElementById("preloadSpan").style.visibility = "hidden";
        var preloadImg = document.getElementById('preloadImage');
        preloadImg.parentNode.removeChild(preloadImg);

        clearInterval(this.checkLoadInt);
        this.bDomainCheckPass = this.checkAllowedDomains(); // i do not give it here
        //this.evalStep(); 
        if(this.bDomainCheckPass) {
            console.log('ERROR right domain');
        } else {
            console.log('ERROR Wrong domain');
            //window.location.assign loads a new document - to login page, saying you was redirected .... 
        } 
    }  

    var loadIn = new loadProt(); 

    loadIn.checkLoadInt = window.setInterval( 
            function() { loadGIn.checkLoadFnc(); }, 1000 );  
    loadIn.jsLoadFnc = document.onreadystatechange = function () { return (document.readyState=='complete') ? true : false ; }

计数器功能:

var stepProt = function () {
        console.log('started stepFnc constructor'); 
        this.step = 20; //seconds
        this.cnt = 0;   //init counter, pointer to rtArr
    }; 

stepProt.prototype.countingFnc = function () {
    console.log('started stepFnc.prototype.countingFnc');
    var msec = this.step*1000;
    var that = this;
    that.cnt=0;
    this.nameToStop = window.setInterval( function () {
             if(loadIn.jsLoad) { that.stepFnc(); }
        }, msec );
} 

stepProt.prototype.stepFnc = function() {

    console.log (' 132 started  stepFnc, this.cnt='+this.cnt );  
   /* here there is some logics, which takes time */
    this.cnt++;
}; 

var stepIn = new stepProt(); //instance
stepIn.countingFnc();