網站搜尋

javascript - 每隔 2 秒打印從 1 到 10 的數字


我想每隔 n 秒打印一次數字,並且根據一些條件我會更改計時器,同時我也會停止打印功能。我是這樣做的 --

var myfunc = {
    value   : 1,
    running : false,
    timer   : 1000,
    start   : function(){
        this.running = true;
        clearInterval(this.timeout);
        this.timeout = setTimeout(function() {
            myfunc.execute(myfunc);
        }, myfunc.timer);

    },
    execute : function(){
        if(!this.running) return false;

        console.log( 'Currently at -- ' + (this.value++) );

        if (this.value > 5 ){
            this.changetiming();
        }

        if (this.value > 10 ){
            this.stop();
            return;
        }else{
            this.start();
        }

    },
    changetiming : function(){
        this.timer = 3000;
    },
    stop : function(){
        this.running = false;
        clearTimeout(this.timeout);
    }
};

myfunc.start();

現在我想知道下面的程式碼出了什麼問題 --

for(var i = 0; i <= 10; i++){
    print(i);
}


function print(i){
    setTimeout(function(){
        console.log(i)
    },2000);
}

答案#1

這是在 ES6+ 中執行此操作的正確且簡單的方法:

const printNumbersForEvery2Sec = (n)=>{
  for (let i = 1; i <= n; i++) {
      setTimeout( () =>{
        console.log(i)
      }, i * 2000)
    }
}
printNumbersForEvery2Sec(10);

通過乘以 i,每個 setTimeout() 分別延遲 2 到 20 秒(2000 x 1、2000 x 2……)。

答案#2

我很確定這個問題「為什麼這段 JavaScript 代碼

for (var i = 0; i <= 10; i++){
    print(i);
}

function print(i) {
    setTimeout(function(){
        console.log(i)
    },2000);
}

如何在經過 2 秒後一次列印出 1 到 10 的值?這個問題以前有人問過。

這是一個常見的錯誤。

你正在做的是呼叫 print 10 次。每次呼叫 print 只需要幾微秒。為什麼呢?因為它只是呼叫 setTimeout。執行 setTimeout 只需要幾微秒就能完成。這個呼叫所做的只是 安排 某件事在未來發生。因此,在幾微秒內,你已經安排了 10 件事情在大約兩秒後發生。所有的安排大約在同一時間發生。因此,所有的控制台日誌大約在你安排它們後的兩秒同時發生。

請參閱 Satapal 對你問題的評論,以獲得實現你想做的事情的好方法。