ホームページ  >  記事  >  ウェブフロントエンド  >  jsのsetTimeout()関数

jsのsetTimeout()関数

一个新手
一个新手オリジナル
2017-09-21 09:45:412449ブラウズ

js では、setTimeout() 関数はどこにあっても、ローカル変数ではなくグローバル変数です。したがって、次の例の結果は驚くかもしれません:

function A() {
    this.b = function() {
        console.log(1)
    }
}
var c = new A()
setTimeout(c.b, 10)

上の例の出力結果が 1 であると思う人もいるかもしれませんが、結果は未定義です。これは、setTImeout() 関数がグローバル変数に内部の c.b を送信するためです。ただし、グローバル変数には属性 b がないため、未定義が返されます。

jsではsetTimeout()関数の動作仕組みはこんな感じですが、setInterval()関数も同様です。指定されたコードをこの実行から移動し、イベント ループの次のラウンドまで待ってから、指定された時間が到着したかどうかを確認します。到着した場合は、対応するコードが実行されます。到着しない場合は、イベント ループの次のラウンドまで待機して再判断します。これは、今回実行されるすべてのコードが実行されるまで、setTimeout で指定されたコードは実行されないことを意味します。

イベント LOOP の各ラウンドでは、「タスク キュー」で実行する必要があるタスクが実行されます。 setTimeout と setInterval は両方とも、タスクを「タスク キュー」の最後に追加します。したがって、実際には、現在のスクリプトのすべての同期タスクが実行されるまで待機し、その後、このイベント ループの「タスク キュー」のすべてのタスクが実行されるまで待機してから、実行を開始する必要があります。前のタスクが完了するまでにどれくらいの時間がかかるかは不明であるため、setTimeout と setInterval で指定されたタスクがスケジュールされた時間に従って実行されることを保証する方法はありません。

したがって、関数が以前にブロックされている場合、関数は実行されるまで待機してから実行されます。 js はシングルスレッドであるため、ブロックされやすくなります。

setTimeout() 関数では、遅延パラメーターに 0 または負の数を記述しても、最速の実行時間は 4 ミリ秒です。遅延パラメータが 0 または負の数の場合、実行を開始する前に、現在のステップの同期タスクとイベント ループ (タスク キュー) が実行されるまで待つ必要があります。パラメータが 0 または負の数であるため、関数は次のようになります。他の setTimeout() 関数よりもできるだけ早く実行し、パラメーターが 0 であるか、負の数値自体が同じ優先順位を持ちます。たとえば、

setTimeout('console.log(1)',0)
console.log(2)
-返された結果は2 1つまり、最初のパラメータはコンパイルする必要のあるコードまたは関数メソッドでなければなりません。したがって、上記の例では、console.log() は一重引用符で囲まれ、文字列になります。 setTimeout には、文字列をコンパイルするための eval() 関数があります。 console.log() メソッドを一重引用符で囲まない場合、遅延パラメータがあるかどうかに関係なく、setTimeout() 関数全体がすぐに実行されます。美的の Meiyun Smart Number インタビューで私が遭遇したこの質問と同じように:

setTimeout('console.log(1)',0)
setTimeout('console.log(2)',-1)
setTimeout('console.log(3)',-1)
setTimeout('console.log(4)',0)

返される結果は 1 2 3 4 です。一重引用符で囲むと、返される結果は 1 3 2 4 になります

setTimeout をクリアしたい場合タイマーの場合は、clearTimeout() 関数が必要です。具体的な使用法は次のとおりです:

console.log(1)

setTimeout(console.log(2),0)
  
console.log(3)
  
setTimeout(console.log(4),-1)

最後に、次の 3 つのコードを比較して上記の出力を確認してください:

var a = setTimeout('console.log(1)', 1)
clearTimeout(a)
for (var i = 0; i < 3; i++) {
    setTimeout(function() {
        console.log(i);
    }, 0);
    console.log(i);
}
for (var i = 0; i < 3; i++) {
    setTimeout((function() {
        console.log(i);
    })(i), 0);
    console.log(i);
}

この質問は、いくつかの JS スコープの問題を設計しています。 es5のスコープとes6のスコープの変更を紹介する記事を書きます。

以上がjsのsetTimeout()関数の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。