¿Cómo puedo devolver un valor recuperado por AJAX a la función principal de la función actual en JavaScript?

Question

tengo el siguiente JavaScript (y jQuery) Código:

function checkEmail(email) { 
    if (email.length) { 
     $.getJSON('ajax/validate', {email: email}, function(data){ 
      if (data == false) { 
       // stuff 
      } 
      return data; 
     }) 
    } 
} 

Quiero la función anónima a return data a la función madre, checkEmail(). He intentado hacer algo como esto:

function checkEmail(email) { 
    if (email.length) { 
     var ret = null; 
     $.getJSON('ajax/validate', {email: email}, function(data){ 
      if (data == false) { 
       // stuff 
      } 
      ret = data; 
     }) 
     return ret; 
    } 
} 

Pero por supuesto esto no funcionará porque la llamada $.getJSON() es asíncrona, por lo que será return ret antes de la petición GET está terminado.

¿Algún comentario aquí?

¡Gracias!

Answer 1

En general, la mejor manera de manejar este tipo de problema es utilizar alguna forma de función de devolución de llamada. En realidad, es realmente la única solución practicable: la única otra opción es codificar tus propias extensiones para el navegador, y eso es un poco (a menos que realmente te guste golpear tu cabeza contra una pared). En realidad, hay bastantes preguntas paralelas en estas tablas: puede intentar buscar algunas, muchas son muy buenas.

La modificación de su código:

function checkEmail(email) { 
    /* 
     original parts of the function here! 
    */ 

    if (email.length) { 
     $.getJSON('ajax/validate', {email: email}, function(data){ 
      if (data == false) { 
       // stuff 
      } 
      checkEmailResponse(data); 
     }) 
    } 
} 

function checkEmailResponse(data) 
{ 
    // do something with the data. 
} 

Answer 2

que podría tener el bloque de función de los padres hasta que haya algo allí. Y para reducir la intensidad de la CPU, podría usar un tiempo de espera de algún tipo.

function checkEmail(email) { 
if (email.length) { 
    var ret = null; 
    $.getJSON('ajax/validate', {email: email}, function(data){ 
     if (data == false) { 
      // stuff 
     } 
     ret = data; 
    }) 
    while(ret == null){ 

    } 
    return ret; 
} 

}

Espero que esto ayude.

Answer 3

Tendrás que cambiar la forma de abordar el problema. Usted sabe que lo que tiene arriba no funcionará, por lo que no puede pensar en términos de "llamar a una función y operar en su valor de retorno".

Deberá cambiar a algo como la sugerencia de Toby de CPS, o dependiendo de lo que desencadena esta función, manejarlo con eventos personalizados.

Answer 4

También debería usar una devolución de llamada porque la llamada es asincrónica y, por lo tanto, diseñe toda la fuente de JavaScript alrededor de esa idea (como los otros señalaron).

Si realmente necesita obtenerlo como valor de retorno, debe desactivar la llamada asincrónica, pero esto no se recomienda en absoluto, ya que bloquea la página hasta que la respuesta esté allí.

function checkEmail(email, callback) { 
    if (email.length) 
    return $.ajax({ 
     data: {email: email}, 
     url: 'ajax/validate', 
     async: false 
    }).responseText; // only the raw response text of the XMLHttpRequest 
    } 
}