引用符と括弧の有無によるsetTimeoutの違い

私はJavaScriptを学習していますが、JavaScriptのタイミングイベントについて最近学びました。W3Schoolsで知ったとき、今setTimeoutまで出会ったことのない奇妙な姿に気づきました。彼らは二重引用符を使用してから、関数を呼び出します。

例：

setTimeout("alertMsg()", 3000);

JavaScriptの二重引用符と単一引用符は文字列を意味することを知っています。

また、私はそのように同じことができることがわかりました：

setTimeout(alertMsg, 3000);

括弧が付いている場合はそれを参照しており、括弧がない場合はコピーされます。引用符とかっこを使用していると、頭がおかしくなります。

これらの3つの使用方法の違いを誰かに説明してもらえたら嬉しいですsetTimeout。

括弧付き：

setTimeout("alertMsg()", 3000);

引用符と括弧がない場合：

setTimeout(alertMsg, 3000);

そして、3番目は引用符のみを使用しています。

setTimeout("alertMsg", 3000);

注意：setTimeout参照のためのより良い情報源はMDNです。

setIntervalまたはを使用するsetTimeout

setTimeoutまたはの最初の引数として関数への参照を渡す必要がありますsetInterval。この参照は、次の形式になります。

• 匿名関数

  setTimeout(function(){/* Look mah! No name! */},2000);

• 既存の関数の名前

  function foo(){...}
  
  setTimeout(foo, 2000);

• 既存の関数を指す変数

  var foo = function(){...};
  
  setTimeout(foo, 2000);

  _{「関数の変数」は「関数名」とは別に設定しています。変数と関数名が同じ名前空間を占め、お互いに混雑する可能性があることは明らかではありません。}

引数を渡す

関数を呼び出してパラメーターを渡すには、タイマーに割り当てられたコールバック内で関数を呼び出すことができます。

setTimeout(function(){
  foo(arg1, arg2, ...argN);
}, 1000);

ハンドラに引数を渡す別の方法がありますが、 ブラウザー間の互換性はありません。

setTimeout(foo, 2000, arg1, arg2, ...argN);

コールバックコンテキスト

デフォルトでthisは、実行時のコールバックのコンテキスト（タイマーによって呼び出される関数内の値）はグローバルオブジェクトです。windowです。変更したい場合は、を使用してくださいbind。

setTimeout(function(){
  this === YOUR_CONTEXT; // true
}.bind(YOUR_CONTEXT), 2000);

安全保障

可能ですが、またはに文字列を渡すべきではありません。文字列を渡すと、スクリプトとして文字列を実行するのと同様の機能が作成または使用され、任意の、潜在的に有害なスクリプトの実行が可能になります。setTimeoutsetIntervalsetTimeout()setInterval()eval()

あなたが書いたsetTimeout関数が実行されていないと思います。jqueryを使用する場合は、次のようにして正しく実行できます。

    function alertMsg() {
      //your func
    }

    $(document).ready(function() {
       setTimeout(alertMsg,3000); 
       // the function you called by setTimeout must not be a string.
    });

ジョセフに完全に同意します。

これをテストするためのフィドルです： http //jsfiddle.net/nicocube/63s2s/

フィドルのコンテキストでは、関数がグローバルスコープで定義されていないため、文字列引数は機能しません。

関数の最初のパラメータとして文字列を渡した場合、実際には何が起こりますか

setTimeout（'string'、number）

実行するとき（numberミリ秒経過後）に評価される最初のパラメーターの値です。基本的には

setTimeout（eval('string')、number）

これは

関数の代わりに文字列を含めることができる代替構文。タイマーが切れたときにコンパイルおよび実行されます。この構文は、eval（）の使用をセキュリティリスクにする同じ理由で推奨されていません。

したがって、あなたが参照するサンプルは良いサンプルではなく、異なるコンテキストまたは単純なタイプミスで与えられる可能性があります。

このように呼び出す場合setTimeout(something, number)、最初のパラメータは文字列ではなく、呼び出されるものへのポインタsomethingです。そして再びsomething文字列の場合-それは評価されます。ただし、関数の場合は、関数が実行されます。 jsbinサンプル

    ##If i want to wait for some response from server or any action we use setTimeOut.

    functionOne =function(){
    console.info("First");

    setTimeout(()=>{
    console.info("After timeOut 1");
    },5000);
    console.info("only setTimeOut() inside code waiting..");
    }

    functionTwo =function(){
    console.info("second");
    }
    functionOne();
    functionTwo();

## So here console.info("After timeOut 1"); will be executed after time elapsed.
Output:
******************************************************************************* 
First
only setTimeOut() inside code waiting..
second
undefined
After timeOut 1  // executed after time elapsed.

括弧付き：

setTimeout("alertMsg()", 3000); // It work, here it treat as a function

引用符と括弧がない場合：

setTimeout(alertMsg, 3000); // It also work, here it treat as a function

そして、3番目は引用符のみを使用しています。

setTimeout("alertMsg", 3000); // It not work, here it treat as a string

function alertMsg1() {
        alert("message 1");
    }
    function alertMsg2() {
        alert("message 2");
    }
    function alertMsg3() {
        alert("message 3");
    }
    function alertMsg4() {
        alert("message 4");
    }

    // this work after 2 second
    setTimeout(alertMsg1, 2000);

    // This work immediately
    setTimeout(alertMsg2(), 4000);

    // this fail
    setTimeout('alertMsg3', 6000);

    // this work after 8second
    setTimeout('alertMsg4()', 8000);

上記の例では、alertMsg1（）（2秒の待機時間）の直後に最初のalertMsg2（）関数呼び出し（タイムアウトは4Sですが、問題はありません）、次にalertMsg4（）（8秒の待機時間）しかし、alertMsg3（）は、パーティなしで引用符で囲んで文字列として扱われるため、機能しません。