Różnica między setTimeout z cytatami i nawiasami i bez nich

Uczę się JavaScript i ostatnio dowiedziałem się o zdarzeniach JavaScript. Kiedy dowiedziałem się o setTimeoutco W3Schools , zauważyłem dziwną postać, która nie uruchamiać się wcześniej. Używają podwójnych cudzysłowów, a następnie wywołują funkcję.

Przykład:

setTimeout("alertMsg()", 3000);

Wiem, że podwójne i pojedyncze cudzysłowy w JavaScript oznaczają ciąg znaków.

Widziałem też, że mogę zrobić to samo:

setTimeout(alertMsg, 3000);

Z nawiasami, do których się odnosi, bez nawiasów jest kopiowany. Kiedy używam cytatów i nawiasów, robi się szalony.

Będę zadowolony, jeśli ktoś może wyjaśnić mi różnicę między tymi trzema sposobami użycia setTimeout:

Z nawiasami:

setTimeout("alertMsg()", 3000);

Bez cytatów i nawiasów:

setTimeout(alertMsg, 3000);

A trzeci używa tylko cudzysłowów:

setTimeout("alertMsg", 3000);

Uwaga: Lepszym źródłem setTimeoutodniesienia będzie MDN .

Za pomocą setIntervallubsetTimeout

Powinieneś przekazać odwołanie do funkcji jako pierwszy argument dla setTimeoutlub setInterval. Odniesienie to może mieć postać:

• Anonimowa funkcja

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

• Nazwa istniejącej funkcji

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

• Zmienna wskazująca na istniejącą funkcję

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

  _{Zauważ, że ustawiam „zmienną w funkcji” oddzielnie od „nazwy funkcji”. Nie jest oczywiste, że nazwy zmiennych i funkcji zajmują tę samą przestrzeń nazw i mogą się wzajemnie blokować.}

Przekazywanie argumentów

Aby wywołać funkcję i przekazać parametry, możesz wywołać funkcję wewnątrz wywołania zwrotnego przypisanego do timera:

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

Istnieje inna metoda przekazywania argumentów do modułu obsługi, jednak nie jest on zgodny z różnymi przeglądarkami .

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

Kontekst oddzwaniania

Domyślnie kontekst wywołania zwrotnego (wartość thisfunkcji wywoływanej przez stoper) podczas wykonywania jest obiektem globalnym window. Jeśli chcesz to zmienić, użyj bind.

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

Bezpieczeństwo

Chociaż jest to możliwe, nie należy przekazywać łańcucha do setTimeoutlub setInterval. Przechodząc ciąg sprawia, setTimeout()lub setInterval()użyć funkcji podobnej do eval()że wykonuje ciągi jako skrypty , czyniąc wykonanie arbitralny i potencjalnie szkodliwy skrypt możliwe.

myślę, że funkcja setTimeout, którą piszesz, nie jest uruchamiana. jeśli używasz jquery, możesz ustawić, aby działała poprawnie, wykonując następujące czynności:

    function alertMsg() {
      //your func
    }

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

Całkowicie zgadzam się z Józefem.

Oto skrzypce, aby to przetestować: http://jsfiddle.net/nicocube/63s2s/

W kontekście skrzypce argument string nie działa, moim zdaniem, ponieważ funkcja nie jest zdefiniowana w zasięgu globalnym.

Co dzieje się w rzeczywistości w przypadku podania ciągu jako pierwszego parametru funkcji

setTimeout ( 'string', number)

jest oceniana wartość pierwszego parametru, kiedy nadszedł czas uruchomienia (po upływie numbermilisekund). Zasadniczo jest to równe

setTimeout ( eval('string'), number)

To jest

alternatywna składnia, która pozwala dołączyć ciąg zamiast funkcji, która jest kompilowana i wykonywana po upływie czasu. Ta składnia nie jest zalecana z tych samych powodów, które sprawiają, że używanie eval () stanowi zagrożenie bezpieczeństwa.

Próbki, do których się odwołujesz, nie są dobrymi próbkami i mogą być podane w innym kontekście lub po prostu literówką.

Jeśli wywołujesz w ten sposób setTimeout(something, number), pierwszym parametrem nie jest ciąg, ale wskaźnik do czegoś zwanego something. I znowu, jeśli somethingjest ciągiem - wtedy zostanie to ocenione. Ale jeśli jest to funkcja, funkcja zostanie wykonana. próbka 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.

Z nawiasami:

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

Bez cytatów i nawiasów:

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

A trzeci używa tylko cudzysłowów:

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

W powyższym przykładzie pierwsze wywołanie funkcji alertMsg2 () następuje natychmiast (dajemy limit czasu 4S, ale nie przeszkadza) po tym alertMsg1 () (czas oczekiwania 2 sekundy), a następnie alertMsg4 () (czas oczekiwania 8 sekund) ale alertMsg3 () nie działa, ponieważ umieszczamy go w cudzysłowie bez stron, więc jest traktowany jako ciąg.