Poczekaj 5 sekund przed wykonaniem następnej linii

Ta funkcja poniżej nie działa tak, jak chcę; będąc nowicjuszem w JS nie wiem, dlaczego.

Muszę poczekać 5 sekund, zanim sprawdzę, czy tak newStatejest -1.

Obecnie nie czeka, po prostu sprawdza od razu.

function stateChange(newState) {
  setTimeout('', 5000);

  if(newState == -1) {
    alert('VIDEO HAS STOPPED');
  }
}

Musisz umieścić swój kod w funkcji zwrotnej, którą udostępniasz setTimeout:

function stateChange(newState) {
    setTimeout(function () {
        if (newState == -1) {
            alert('VIDEO HAS STOPPED');
        }
    }, 5000);
}

Każdy inny kod zostanie wykonany natychmiast.

Naprawdę nie powinieneś tego robić , prawidłowe użycie limitu czasu jest właściwym narzędziem dla problemu PO i każdej innej okazji, w której po prostu chcesz coś uruchomić po pewnym czasie. Joseph Silber pokazał to dobrze w swojej odpowiedzi. Jeśli jednak w jakimś nieprodukcyjnym przypadku naprawdę chcesz zawiesić główny wątek na pewien czas, zrobi to.

function wait(ms){
   var start = new Date().getTime();
   var end = start;
   while(end < start + ms) {
     end = new Date().getTime();
  }
}

Z wykonaniem w formie:

console.log('before');
wait(7000);  //7 seconds in milliseconds
console.log('after');

Przybyłem tutaj, ponieważ budowałem prosty przypadek testowy do sekwencjonowania kombinacji operacji asynchronicznych wokół długotrwałych operacji blokujących (tj. Kosztownej manipulacji DOM) i to jest moja symulowana operacja blokowania. Dobrze pasuje do tej pracy, więc pomyślałem, że opublikuję ją dla każdego, kto przyjedzie tutaj z podobnym przypadkiem użycia. Mimo to tworzy obiekt Date () w pętli while, co może bardzo przytłoczyć GC, jeśli będzie działać wystarczająco długo. Ale nie mogę wystarczająco podkreślić, jest to odpowiednie tylko do testowania, do budowania jakiejkolwiek faktycznej funkcjonalności, którą powinieneś odnieść do odpowiedzi Josepha Silbera.

Oto rozwiązanie wykorzystujące nową składnię async / await .

Sprawdź obsługę przeglądarki, ponieważ jest to nowa funkcja wprowadzona w ECMAScript 6.

Funkcja użyteczności:

const delay = ms => new Promise(res => setTimeout(res, ms));

Stosowanie:

const yourFunction = async () => {
  await delay(5000);
  console.log("Waited 5s");

  await delay(5000);
  console.log("Waited an additional 5s");
};

Zaletą tego podejścia jest to, że sprawia, że ​​Twój kod wygląda i zachowuje się jak kod synchroniczny.

Użyj funkcji opóźnienia w następujący sposób:

var delay = ( function() {
    var timer = 0;
    return function(callback, ms) {
        clearTimeout (timer);
        timer = setTimeout(callback, ms);
    };
})();

Stosowanie:

delay(function(){
    // do stuff
}, 5000 ); // end delay

Kredyty: Jak opóźnić procedurę obsługi .keyup (), dopóki użytkownik nie przestanie pisać?

Nie powinieneś po prostu próbować zatrzymać 5 sekund w javascript. To nie działa w ten sposób. Możesz zaplanować uruchomienie funkcji kodu za 5 sekund od teraz, ale musisz umieścić kod, który chcesz uruchomić później w funkcji, a reszta kodu po tej funkcji będzie nadal działać natychmiast.

Na przykład:

function stateChange(newState) {
    setTimeout(function(){
        if(newState == -1){alert('VIDEO HAS STOPPED');}
    }, 5000);
}

Ale jeśli masz taki kod:

stateChange(-1);
console.log("Hello");

console.log()Oświadczenie będzie działać natychmiast. Nie będzie czekać, aż upłynie limit czasu wstateChange() funkcji. Nie można po prostu wstrzymać wykonywania javascript na określony czas.

Zamiast tego każdy kod, który chcesz uruchomić, musi znajdować się wewnątrz setTimeout() funkcji zwrotnej (lub wywoływanej z tej funkcji).

Jeśli spróbujesz „wstrzymać” przez zapętlenie, to zasadniczo zawiesisz interpreter Javascript na pewien czas. Ponieważ JavaScript uruchamia kod tylko w jednym wątku, podczas zapętlania nic innego nie może zostać uruchomione (nie można wywoływać żadnych innych programów obsługi zdarzeń). Pętla oczekująca na zmianę jakiejś zmiennej nigdy nie zadziała, ponieważ żaden inny kod nie może działać, aby zmienić tę zmienną.

Jeśli korzystasz z funkcji asynchronicznej , możesz to zrobić w jednym wierszu:

console.log(1);
await new Promise(resolve => setTimeout(resolve, 3000)); // 3 sec
console.log(2);

Zauważ , że jeśli celem jest NodeJS, użycie tego będzie bardziej wydajne (jest to predefiniowana, obiecana funkcja setTimeout):

await setTimeout[Object.getOwnPropertySymbols(setTimeout)[0]](3000) // 3 sec

Spróbuj tego:

//the code will execute in 1 3 5 7 9 seconds later
function exec() {
    for(var i=0;i<5;i++) {
        setTimeout(function() {
            console.log(new Date());   //It's you code
        },(i+i+1)*1000);
    }
}

Najlepszym sposobem na utworzenie takiej funkcji jest czekanie w milisekundach, ta funkcja będzie czekać na milisekundy podane w argumencie:

function waitSeconds(iMilliSeconds) {
    var counter= 0
        , start = new Date().getTime()
        , end = 0;
    while (counter < iMilliSeconds) {
        end = new Date().getTime();
        counter = end - start;
    }
}

Na podstawie Josepha Silber za odpowiedź , chciałbym zrobić to tak, że nieco bardziej ogólne.

Miałbyś swoją funkcję (stwórzmy ją na podstawie pytania):

function videoStopped(newState){
   if (newState == -1) {
       alert('VIDEO HAS STOPPED');
   }
}

I możesz mieć funkcję oczekiwania:

function wait(milliseconds, foo, arg){
    setTimeout(function () {
        foo(arg); // will be executed after the specified time
    }, milliseconds);
}

Na koniec miałbyś:

wait(5000, videoStopped, newState);

To rozwiązanie, wolałbym nie używać argumentów w funkcji oczekiwania (aby mieć tylko foo();zamiast foo(arg);), ale tak jest na przykład.

To rozwiązanie pochodzi z dokumentacji React Native dotyczącej kontroli odświeżania :

function wait(timeout) {
    return new Promise(resolve => {
        setTimeout(resolve, timeout);
    });
}

Aby zastosować to do pytania PO, możesz użyć tej funkcji w koordynacji z await:

await wait(5000);
if (newState == -1) {
    alert('Done');
}

Możesz dodać opóźnienie, wprowadzając niewielkie zmiany w funkcji (asynchronizuj i czekaj).

const add5SecondsDelay = () => {
  return new Promise(resolve => {
    setTimeout(() => {
      resolve('5 seconds');
    }, 50000);
  });
}

async function asyncFunctionCall() {

  console.log("stpe-1"); 
  const result = await add5SecondsDelay ();
  console.log("step-2 after 5 seconds delay"); 

}

asyncFunctionCall();

using angularjs:

$timeout(function(){
if(yourvariable===-1){
doSomeThingAfter5Seconds();
}
},5000)

Utwórz nową funkcję Js

function sleep(delay) {
        var start = new Date().getTime();
        while (new Date().getTime() < start + delay);
      }

Wywołaj funkcję, jeśli chcesz opóźnić wykonanie. Użyj wartości milisekund w int dla wartości opóźnienia.

####Some code
 sleep(1000);
####Next line

Użyłem go do uruchamiania gier komputerowych z Edge lub IE. I automatycznie zamyka IE Edge po 7 sekundach.

Firefox i Google Chrome nie mogą być używane do uruchamiania gier w ten sposób.

<html<body>
<a href="E:\game\game.exe" name="game" onmouseout="waitclose(7000);"> game
<img src="game.jpg" width="100%" height="97%" ></a>
<script>
function waitclose(ms){
 var start = new Date().getTime();var end=start;
 while(end < start + ms) {end = new Date().getTime();}
window.open('', '_self', ''); window.close();
}
</script>
</body></html>