как поспать в javascript?

Question

Кто-нибудь знает, как я могу заснуть в javascript до того, как система прочитает следующую строку?

пример:

    1 var chkResult = Validation();
    2 //sleep here for for 10 sec before the next line been read    
    3   
    4 document.getElementById('abc').innerHTML = chkResult;

В этом примере, как я могу перевести javascript в режим ожидания / ожидания в строке 2 на 10 секунд, прежде чем он продолжит читать строку 4? Я пробовал setTimeout ('', 10000); но, похоже, у меня все еще не работает ...

Answer 1

У меня есть шляпа дал правильный намек. Используйте метод setTimeout для выполнения кода четвертой строки через 10 секунд:

var chkResult = Validation();
var timeout = window.setTimeout(function() {
    document.getElementById('abc').innerHTML = chkResult;
}, 10000);

Сохранение идентификатора тайм-аута в переменной может быть полезно, если вы хотите очистить тайм-аут .

Answer 2

Попробуйте

setTimeout(function() { return true; }, 10000);

Первый аргумент ожидает функцию. Это из памяти; Я не проверял это.

Редактировать: То, что сказал Гамбо ... поздно здесь ... не уверен, что я думал.

Answer 3

    1 var chkResult = Validation();
    2 alert("wait ten seconds, then press ok");
    3       
    4 document.getElementById('abc').innerHTML = chkResult;

Предыдущий код делегирует задачу сна параллельному процессору. Это немного грязно, потому что вы должны использовать DSL для этого стиля многопоточности.

Answer 4

setTimeout запускает отдельный «поток» выполнения в интерпретаторе JavaScript. Вам нужно передать ему функцию и спроектировать свои сценарии таким образом, чтобы функция, которую запускает setTimeout, продолжала работать там, где остановилась вызывающая функция, - таким образом имитируя сон.

Answer 5

Задержка не произойдет до тех пор, пока JavaScript не вернет управление браузеру, поэтому ваша строка 4 будет выполнена до запуска setTimeout.

Вы должны делать все возможное, основываясь на событиях.

Answer 6

В JS нет функции сна.

Однако вы можете использовать setTimeout:

var chkResult = Validation();
setTimeout(() => { document.getElementById('abc').innerHTML = chkResult }, 10000);

Более современный способ - использовать обещания и асинхронные функции:

const doThis = () => document.querySelectorAll('p')[0].innerHTML ='Do this';
const doThat = () => document.querySelectorAll('p')[1].innerHTML ='Do that';
const doAlsoThat = () => document.querySelectorAll('p')[2].innerHTML ='Do also that';
const sleep = ms => new Promise(resolve => setTimeout(resolve, ms));

// using async function
(async () => {
  doThis(); // executed at t=0s (approx)
  await sleep(1000);
  doThat(); // executed at t=1s (approx)
})();

// using promises
sleep(2000).then(doAlsoThat); // executed at t=2s (approx)

<p></p>
<p></p>
<p></p>

Answer 7

но таким образом ваша строка будет выполняться ДО строки 4

Answer 8

Javascript должен делиться темой с браузером, поэтому та пауза, которую вы хотите, выглядела бы так, будто браузер завис на 10 секунд, если бы это было возможно. Такие функции, как «оповещение» и «подсказка», делают это. Для этого они являются злом, так как одно предупреждение в цикле может поставить на колени целый браузер, и единственный выход - принудительно выйти из него.

Способ обойти эту проблему - основанная на событиях парадигма. Javascript имеет функции первого класса, поэтому их можно передавать как значения для «обратных вызовов», которые вы можете назначить определенным событиям.

setTimeout является одним из таких событий. Другие опубликовали код, но в целом вам нужно просто назначить свои функции определенным событиям, а затем убраться из браузера, чтобы он мог заниматься своим бизнесом в браузере. Браузер сообщит вам, когда что-то произошло, и вы можете быстро сделать что-то подходящее в ответ, а затем снова убраться с дороги. Таким образом, браузер может поддерживать вид реагирования.

Если вы хотите узнать больше, взгляните на этот вопрос: Как обстоят дела с графическим интерфейсом и игровой программой по сравнению с веб-программами

Answer 9

Могу ли я предложить это в качестве общего решения:

  function sleep (ms, args, obj) {
    /* Called at the top of a function to invoke a delay in processing that
       function

       Returns true if the function should be executed, and false if the sleep
       timer is activated. 

       At the end of the sleep tiemout, the calling function is re-called by
       calling it with "apply (obj, args || [])".
    */

    var caller = sleep.caller;
    if (caller.sleepTimer) { 
      /* if invoked from timeout function, delete timer and return false */
      delete caller.sleepTimer;
      return true;
    }

    /* Create timer and re-call caller at expiry */
    caller.sleepTimer = window.setTimeout (function () {
      caller.apply (obj || null, args || []);
    },ms);

    return false;
  }    

Примеры использования:

function delayed () {
  if (!sleep (5000)) return;  

  document.body.innerHTML += "<p>delayed processing</p>";
}

function delayed_args (a, b) {
  if (!sleep (10000, arguments)) return;  

  document.body.innerHTML += "<p>args : (" + a + ", " + b + ")</p>";
}

function delayed_method_args (a,b) {
  if (!sleep (20000, arguments, this)) return;  

  document.body.innerHTML += "<p>method_args " + this + " (" + a + ", " + b + ")</p>";
}

Проверено на Opera и Firefox 3.0