Đợi 5 giây trước khi thực hiện dòng tiếp theo

Hàm này bên dưới không hoạt động như tôi muốn; là một người mới làm quen với JS Tôi không thể hiểu tại sao.

Tôi cần nó để chờ 5 giây trước khi kiểm tra xem newStatelà -1.

Hiện tại, nó không chờ đợi, nó chỉ kiểm tra ngay lập tức.

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

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

Bạn phải đặt mã của mình vào chức năng gọi lại mà bạn cung cấp cho setTimeout:

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

Bất kỳ mã nào khác sẽ thực thi ngay lập tức.

Bạn thực sự không nên làm điều này , việc sử dụng đúng thời gian chờ là công cụ phù hợp cho vấn đề của OP và bất kỳ dịp nào khác mà bạn chỉ muốn chạy một cái gì đó sau một khoảng thời gian. Joseph Silber đã chứng minh điều đó tốt trong câu trả lời của mình. Tuy nhiên, nếu trong một số trường hợp không sản xuất bạn thực sự muốn treo chủ đề chính trong một khoảng thời gian, điều này sẽ làm điều đó.

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

Với việc thực hiện theo mẫu:

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

Tôi đã đến đây vì tôi đang xây dựng một trường hợp thử nghiệm đơn giản để giải trình tự hỗn hợp các hoạt động không đồng bộ xung quanh các hoạt động chặn chạy dài (tức là thao tác DOM đắt tiền) và đây là hoạt động chặn mô phỏng của tôi. Nó phù hợp với công việc đó, vì vậy tôi nghĩ rằng tôi đã đăng nó cho bất kỳ ai khác đến đây với trường hợp sử dụng tương tự. Mặc dù vậy, nó đang tạo một đối tượng Date () trong một vòng lặp while, điều này có thể sẽ áp đảo GC nếu nó chạy đủ lâu. Nhưng tôi không thể nhấn mạnh đủ, điều này chỉ phù hợp để thử nghiệm, để xây dựng bất kỳ chức năng thực tế nào bạn nên tham khảo câu trả lời của Joseph Silber.

Đây là một giải pháp sử dụng cú pháp async / await mới .

Hãy chắc chắn kiểm tra hỗ trợ trình duyệt vì đây là một tính năng mới được giới thiệu với ECMAScript 6.

Chức năng tiện ích:

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

Sử dụng:

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

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

Ưu điểm của phương pháp này là nó làm cho mã của bạn trông và hoạt động giống như mã đồng bộ.

Sử dụng chức năng trì hoãn như thế này:

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

Sử dụng:

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

Tín dụng: Làm thế nào để trì hoãn trình xử lý .keyup () cho đến khi người dùng ngừng gõ?

Bạn không nên cố gắng tạm dừng 5 giây trong javascript. Nó không hoạt động theo cách đó. Bạn có thể lên lịch cho chức năng mã để chạy 5 giây kể từ bây giờ, nhưng bạn phải đặt mã mà bạn muốn chạy sau đó vào một chức năng và phần còn lại của mã sau chức năng đó sẽ tiếp tục chạy ngay lập tức.

Ví dụ:

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

Nhưng, nếu bạn có mã như thế này:

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

Các console.log()tuyên bố sẽ chạy ngay lập tức. Nó sẽ không đợi cho đến khi hết thời gian chờ trong stateChange()chức năng. Bạn không thể chỉ tạm dừng thực thi javascript trong một khoảng thời gian xác định trước.

Thay vào đó, bất kỳ mã nào bạn muốn chạy độ trễ phải nằm trong setTimeout()hàm gọi lại (hoặc được gọi từ hàm đó).

Nếu bạn đã cố gắng "tạm dừng" bằng cách lặp, thì về cơ bản, bạn sẽ "treo" trình thông dịch Javascript trong một khoảng thời gian. Vì Javascript chỉ chạy mã của bạn trong một luồng duy nhất, khi bạn lặp không có gì khác có thể chạy (không có trình xử lý sự kiện nào khác có thể được gọi). Vì vậy, việc lặp vòng chờ đợi một số biến thay đổi sẽ không bao giờ hoạt động vì không có mã nào khác có thể chạy để thay đổi biến đó.

Nếu bạn đang ở trong chức năng không đồng bộ, bạn chỉ cần thực hiện trong một dòng:

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

Lưu ý , nếu mục tiêu là NodeJS, việc sử dụng này sẽ hiệu quả hơn (đó là chức năng setTimeout được xác định trước):

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

Thử cái này:

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

Cách tốt nhất để tạo một hàm như thế này để chờ tính bằng mili giây, hàm này sẽ đợi mili giây được cung cấp trong đối số:

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

Dựa trên câu trả lời của Joseph Silber , tôi sẽ làm như thế, chung chung hơn một chút.

Bạn sẽ có chức năng của mình (hãy tạo một cái dựa trên câu hỏi):

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

Và bạn có thể có chức năng chờ:

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

Cuối cùng, bạn sẽ có:

wait(5000, videoStopped, newState);

Đó là một giải pháp, tôi không muốn sử dụng các đối số trong hàm chờ (chỉ có foo();thay vì foo(arg);) mà là ví dụ.

Giải pháp này xuất phát từ tài liệu của React Native để kiểm soát làm mới :

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

Để áp dụng điều này cho câu hỏi của OP, bạn có thể sử dụng chức năng này phối hợp với await:

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

Bạn có thể thêm độ trễ bằng cách thực hiện các thay đổi nhỏ cho chức năng của mình (không đồng bộ và chờ đợi).

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

sử dụng angularjs:

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

Tạo chức năng Js mới

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

Gọi hàm khi bạn muốn trì hoãn thực hiện. Sử dụng mili giây trong int cho giá trị độ trễ.

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

Tôi đã sử dụng nó để chạy các trò chơi PC từ edge hoặc IE. Và nó tự đóng IE Edge sau 7 giây.

Firefox và Google Chrome không thể được sử dụng để bắt đầu trò chơi theo cách này.

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