web-dev-qa-db-ja.com

whileループ内のsetTimeout（）メソッド

ここでw3schoolsの関連ページやその他の同様の質問を読みましたが、次のビットの何が問題になっているのか理解できません。

_var myfunc03 = function (i) {
  document.getElementById('d01').innerHTML += 100-i+"<br>";
};

var myFunc01 = function() {
  i=0;
  while (i<100) {
    setTimeout(myfunc03(i), 1000)
    i++;
  }
};
_

myFunc01();が実行されたとき。

一時停止は一切なく、iに可能なすべての値が一度にリストされます。

ここに論理的な間違いはありますか？

javascriptwhile-loopsettimeout
7
havz

あなたはそれを行うことができますもっと簡単にrecursionで：

var i = 0;
function f1() { ... };   
function f() {
    f1();
    i += 1;
    setTimeout(function() {
        if(i < 100) {
            f();
        }
    }, 1000);
}
f();

例

var i = 0;

var myfunc03 = function(i) {
  document.getElementById('d01').innerHTML += 100 - i + "<br>";
};

var myFunc01 = function() {
  myfunc03(i);
  i += 1;
  setTimeout(function() {
    if (i < 100) {
      myFunc01();
    }
  }, 1000);
}

myFunc01();
<div id="d01"></div>

再利用可能な機能

function say(sentence) {
  console.log(sentence);
}

function sayHello() {
  say("Hello!");
}

var fn = sayHello;
var count = 10;
var ms = 1000;

function repeat(fn, count, ms) {
  var i = 0;

  function f() {
    fn();
    i += 1;
    setTimeout(function() {
      if (i < count) {
        f();
      }
    }, ms);
  }

  f();
}

repeat(fn, count, ms);
10
Sun

はい。コードには2つの問題があります。

  1. setTimeout 関数は最初の引数として関数を受け入れますが、コードではmyfunc03(i)は何も返しません
  2. Whileループはニーズを満たしませんが、代わりに再帰関数を使用する必要があります。最初のタイムアウトが発生した後で2番目の関数を呼び出す必要があるためです。

サンプルコード：

var myfunc03 = function (i) {
  setTimeout(function() {
    document.getElementById('d01').innerHTML += 100-i+"<br>";
    if (i < 100) {
      i++;
      myfunc03(i);
    }
  }, 1000);
};

var myFunc01 = function() {
  myfunc03(0);
};

myFunc01();
<div id="d01"></div>
1
hoozecn

  • SetTimeoutにセミコロンがないため、以下の方法で引数を渡してみてください。

    setTimeout(myfunc03, 1000*i, i);
0
Utkarsh Sinha

while待機中setTimeout：

(async () => {
  var i = 0;
  while (await new Promise(resolve => setTimeout(() => resolve(i++), 1000)) < 100) {
    console.log("I get printed 100 times every second");
  }
})();
0
shoesel