Tırnak ve parantez içeren veya içermeyen setTimeout arasındaki fark

JavaScript öğreniyorum ve son zamanlarda JavaScript zamanlama olaylarını öğrendim. Ben yaklaşık öğrendiğimde setTimeoutde W3Schools'da , daha önce girmek yoktu garip figür ettim. Çift tırnak işareti kullanıyorlar ve sonra işlevi çağırıyorlar.

Misal:

setTimeout("alertMsg()", 3000);

JavaScript çift ve tek tırnak bir dize anlamına biliyorum.

Ayrıca aynı şekilde yapabileceğimi gördüm:

setTimeout(alertMsg, 3000);

Parantez söz konusu olduğunda, parantez olmadan kopyalanır. Tırnakları ve parantezleri kullanırken deliriyorum.

Birisi bana bu üç kullanım yolu arasındaki farkı açıklayabilirse memnun olurum setTimeout:

Parantez ile:

setTimeout("alertMsg()", 3000);

Tırnak işaretleri ve parantez olmadan:

setTimeout(alertMsg, 3000);

Ve üçüncüsü sadece tırnak işaretleri kullanıyor:

setTimeout("alertMsg", 3000);

Not: setTimeoutReferans için daha iyi bir kaynak MDN olacaktır .

kullanılması setIntervalveyasetTimeout

Sen ilk argüman olarak bir işleve bir başvuru geçirmesi gerektiğini setTimeoutya setInterval. Bu referans şu şekilde olabilir:

• Anonim bir işlev

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

• Mevcut bir işlevin adı

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

• Varolan bir işlevi işaret eden değişken

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

  _{Bir işlevdeki "değişkeni" "işlev adı" ndan ayrı olarak ayarladığımı unutmayın. Değişkenlerin ve işlev adlarının aynı ad alanını işgal ettiği ve birbirini tıkayabildiği açık değildir.}

Geçiş argümanları

Bir işlevi çağırmak ve parametreleri iletmek için, zamanlayıcıya atanan geri aramanın içindeki işlevi çağırabilirsiniz:

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

Bağımsız değişkenleri işleyiciye aktarmanın başka bir yöntemi daha vardır, ancak tarayıcılar arası uyumlu değildir .

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

Geri arama içeriği

Varsayılan olarak, thisyürütüldüğünde geri aramanın bağlamı ( zamanlayıcı tarafından çağrılan işlevin içindeki değeri ) genel nesnedir window. Değiştirmek isterseniz, kullanın bind.

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

Güvenlik

Bu mümkün olsa da, gereken bir dize geçemiyor için setTimeoutya setInterval. Bir dize geçirilmesi yapar setTimeout()veya setInterval()benzer bir işlevi kullanmak eval()olduğunu komut dosyaları gibi yürütür dizeleri keyfi ve potansiyel olarak zararlı betik çalıştırma mümkün hale.

yazdığınız setTimeout işlevi çalıştırılmadığını düşünüyorum. jquery kullanıyorsanız, bunu yaparak doğru çalışmasını sağlayabilirsiniz:

    function alertMsg() {
      //your func
    }

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

Tamamen Joseph ile aynı fikirde.

İşte bunu test etmek için bir keman: http://jsfiddle.net/nicocube/63s2s/

Keman bağlamında, dize argümanı işe yaramaz, bence işlev küresel kapsamda tanımlanmamıştır.

Dizeyi işlevin ilk parametresi olarak iletmeniz durumunda gerçekte ne olur?

setTimeout ( 'string', number)

çalışma zamanı geldiğinde değerlendirilen ilk parametrenin number(milisaniye geçtikten sonra ) değeridir . Temelde eşittir

setTimeout ( eval('string'), number)

Bu

zamanlayıcı sona erdiğinde derlenen ve yürütülen bir işlev yerine bir dize eklemenizi sağlayan alternatif bir sözdizimi. Bu sözdizimi eval () kullanımını bir güvenlik riski haline getiren aynı nedenlerle önerilmez.

Bu nedenle, referans aldığınız örnekler iyi örnekler değildir ve farklı bağlamlarda veya sadece basit yazım hatalarıyla verilebilir.

Bu şekilde çağırırsanız setTimeout(something, number), ilk parametre dize değil, çağrılan bir şeyin göstergesidir something. Ve yine somethingdize ise - o zaman değerlendirilecektir. Ancak eğer işlev ise, işlev yürütülür. jsbin örneği

    ##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.

Parantez ile:

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

Tırnak işaretleri ve parantez olmadan:

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

Ve üçüncüsü sadece tırnak işaretleri kullanıyor:

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);

Yukarıdaki örnekte, önce alertMsg2 () işlevini hemen arayın (4S zaman aşımını veriyoruz ama rahatsız etmiyoruz) alertMsg1 () (2 Saniye bekleme süresi) sonra alertMsg4 () (8 Saniye bekleme süresi) ancak alertMsg3 () çalışmıyor, çünkü bunu taraflar olmadan tırnak içine alıyoruz, bu nedenle dize olarak değerlendiriliyor.