Javascript: forma de no bloqueo para esperar hasta que una condición sea verdadera

Question

Tengo varios ASP.NET UpdatePanels, cada uno con un AsyncPostBackTrigger vinculado al evento del clic del mismo botón en el servidor. Dado que solo un UpdatePanel puede hacer lo suyo a la vez, uso .get_isInAsyncPostBack() del PageRequestManager para evitar que un usuario pueda acceder a otra parte de la página hasta que se complete la devolución de datos asincrónica.

Otra parte de esta página necesita actualizar dinámicamente varios paneles de actualización consecutivamente. Como los paneles de actualización usan activadores asíncronos, llama __doPostBack("<%=ButtonName.ClientID %>", 'PanelId'); dispara de manera asincrónica. Debido a esto, se moverá rápidamente a la siguiente iteración del ciclo e intentará actualizar el siguiente panel. Sin embargo, la segunda iteración falla porque ya hay otro panel de actualización haciendo una devolución de datos asincrónica.

Idealmente, habría una manera de esperar hasta que .get_isInAsyncPostBack() devuelva falso sin bloquear otra actividad del cliente.

La investigación me ha llevado a mucha gente con mi problema, a casi todos se les aconseja usar setTimeOut(). No creo que esto funcione para mí. No quiero esperar una cantidad específica de tiempo antes de ejecutar una función. Simplemente quiero que mi Javascript espere mientras se ejecuta otro script, preferiblemente espere hasta que una condición específica sea verdadera.

Entiendo que muchos probablemente querrán sugerir que reconsidere mi modelo. En realidad, no es mi modelo, sino uno que fue entregado a nuestro equipo de desarrollo que actualmente es un desastre total bajo el capó. Debido a limitaciones de tiempo, la reescritura del modelo no es una opción. La única opción es hacer que esto funcione. Creo que si tuviera una forma de hacer que el código del cliente espere sin bloquear, mi problema estaría resuelto.

Answer 1

No existe tal funcionalidad como esperar o dormir en javascript, ya que detendría la respuesta del navegador.

En su caso Me gustaría ir con algo similar a la siguiente:

function wait(){ 
    if (!condition){ 
    setTimeout(wait,100); 
    } else { 
    // CODE GOES IN HERE 
    } 
} 

Answer 2

Es fácil cometer un error al llamar setTimeout que hará que la pila de llamadas JavaScript para llenar. Si su función tiene parámetros, es necesario pasar los de al final de la lista setTimeout parámetro de la siguiente manera:

function wait(param1, param2){ 
    if (!condition){ 
    setTimeout(wait, 100, param1, param2); 
    } else { 
    // CODE GOES IN HERE 
    } 
} 

Si pasa parámetros o incluso incluir vacía() después del nombre de la función, que será ejecutado inmediatamente y llene la pila.

// This is the wrong way to do it!  
function wait(param1, param2){ 
    if (!condition){ 
    setTimeout(wait(param1, param2), 100); // you'll get max call stack error if you do this! 
    } else { 
    // CODE GOES IN HERE 
    } 
} 

Answer 3

Esta función llama a condFunc que debe devolver verdadero cuando se cumple la condición. Cuando eso sucede, se llama readyFunc. checkInterval establece porcentaje de control en milisegundos

 var wait = function(condFunc, readyFunc, checkInterval) { 
      var checkFunc = function() { 
       if(condFunc()) { 
        readyFunc(); 
       } 
       else 
       { 
        setTimeout(checkFunc, checkInterval); 
       } 
      }; 
      checkFunc(); 
     }; 

Uso:

 wait(
      function() { return new Date().getSeconds() == 10; }, 
      function() { console.log("Done"); }, 
      100 
     ); 

impresiones "Done" cuando el tiempo actual es de 10 segundos después del minuto

Answer 4

que necesitaba para frenar un proceso y se acercó con una pequeño y útil método.

let wait = (seconds) => 
    new Promise(resolve => 
     setTimeout(() => resolve(), seconds * 1000) 
    ); 

Y puede usarlo así.

(async() => { 
    await wait(3); //wait 3 seconds 
    let result = await doWork(); 
})