2011-10-15 12 views
20

tengo la siguiente función de jQuery. Estoy tratando de devolver el valor GUID que se muestra aquí en el alert(); La alerta funciona bien y el valor está lleno, sin embargo, parece que no puedo asignarlo a una variable y devolver su valor.JavaScript valor de retorno asíncrono/asignación con jQuery

En última instancia necesito para acceder al valor GUID en otras funciones, etc. Todo lo que he probado sólo se muestra como undefined.

me gustaría hacer algo como esto:

function trackPage(){ 
    var elqTracker = new jQuery.elq(459); 
    elqTracker.pageTrack({ 
     success: function() { 
      elqTracker.getGUID(function(guid) { 
       alert(guid); 
       var returnValue = guid; 
      }); 
     } 
    }); 
    return returnValue; 
} 

var someGuid = trackPage(); 
+2

es 'getGUID' una llamada asincrónica? – Anurag

+0

no estoy seguro. Es una llamada a un complemento de otra JS (no es una llamada que pueda modificar). Puedo alertar el valor ... e incluso asignarlo a una nueva variable. Simplemente puedo obtener ese valor fuera del función – patrick

+0

Definitivamente suena asíncrono, en ese caso. –

Respuesta

47

Por lo tanto, se ha hecho esta pregunta un millón de veces, y estoy seguro de que todo el mundo (yo incluido) tried this once.

Es sólo la naturaleza de una llamada asincrónica, no se puede utilizar sus resultados como un valor return. Es por eso que te hacen pasar una función que obtiene el resultado de la llamada, ¡tampoco pueden return! Observe también que la llamada elqTracker.pageTrack() función devuelve inmediatamente, por lo tanto su returnValue es simplemente undefined.

mayoría de las personas (véase la respuesta de dfsq) soluciona este problema mediante la introducción de una función de devolución de llamada como parámetro de. Este método es probado, y verdadero – sin embargo jQuery tiene $.Deferred. Esto le permite hacer su propia lógica asíncrona devuelve un promise que luego se puede adjuntar cualquier número de devoluciones de llamada a:

function trackPage(){ 
    var elqTracker = new jQuery.elq(459), 
     dfd = $.Deferred(); 

    elqTracker.pageTrack({ 
     success: function() { 
      elqTracker.getGUID(function(guid) { 
       dfd.resolve(guid); 
      }); 
     } 
    }); 

    return dfd.promise(); 
} 

// example use: 
trackPage().done(function(guid) { 
    alert("Got GUID:" + guid); 
}); 

Aviso ahora que su trackPage() devuelve un objeto que se puede adjuntar a las devoluciones de llamada? No tiene que adjuntarlos inmediatamente tampoco.

var pageHit = trackPage().done(function(guid) { 
    alert("Page Hit GUID:" +guid); 
}); 

$("button").click(function() { 
    pageHit.done(function(guid) { 
     alert("Clicked on Page GUID:" + guid); 
    }); 
}); 

Además, el módulo de jQuery AJAX siempre devuelve promesas, así, por lo que la interfaz para todas sus cosas AJAX debe ser muy similar si usted hace sus propias promesas de retorno lógica.


Como nota al margen: Me gustaría señalar que su var returnValue estaba en el mal "alcance" de todos modos. Necesita ser declarado en el ámbito externo de la función trackPage. Incluso con esta solución, el concepto aún no funciona.

13

ya que usted tiene asíncrono llamar a la forma en que está tratando de escribir código no va a funcionar (porque en el momento de return returnValue; en el retorno trackCode el valor aún no está definido). En su lugar debe pasar de devolución de llamada en trackPage:

function trackPage(callback) { 
    var elqTracker = new jQuery.elq(459); 
    elqTracker.pageTrack({ 
     success: function() { 
      elqTracker.getGUID(function(guid) { 
       alert(guid); 
       // Instead of this: var returnValue = guid; 
       // You should use your callback function 
       callback(guid); 
      }); 
     } 
    }); 
    return returnValue; 
} 

trackCode(function(guid) { 
    // perform some actions with guid 
}); 
Cuestiones relacionadas