Hacer que la función "get" de AJAX sea sincrónica/¿cómo obtener el resultado?

Question

Tengo un problema con la función $ .get. La URL contiene JSON

mi código:

xyz = null 

    $.get('http://www.someurl.com/123=json', function(data) { 
     var xyz = data.positions[0].latitude; 
    }); 

alert(xyz); 
//some more code using xyz variable 

Sé que xyz alertará a un resultado nulo porque el $.get es asíncrono.

Entonces, ¿hay alguna forma de que pueda usar el xyz fuera de esta función get?

Answer 1

La verdadera respuesta es NO , pero se puede usar esto:

function useXYZ(){ 
    alert(xyz); 
} 

xyz = null   

$.get('http://www.someurl.com/123=json', function(data) { 
    xyz = data.positions[0].latitude; 
    useXYZ(); 
}); 

Answer 2

get es un atajo. Usted puede hacer lo mismo, pero sincrónica, usando:

var xyz = null 


$.ajax({ url: 'http://www.someurl.com/123=json', 
     async: false, 
     dataType: 'json', 
     success: function(data) { 
       xyz = data.positions[0].latitude; 
      } 
     }); 


alert(xyz); 

Vas a tener que declarar la variable xyz antes de la llamada ajax, sin embargo.

Answer 3

Este es un problema común con Javascript. El código de Javascript debe escribirse con el estilo de paso de continuación. Es molesto, pero es algo que puedes convertir sin pensar demasiado.

Básicamente, cada vez que tendríamos algo así como

var x = someSyncFunction(a, b, c); 
//do something with x 
console.log(x); 

Podemos convertirlo en código asíncrono al hacer todo el código después de la función devuelve en una función de continuación y girando x partir de una variable en un parámetro de la devolución de llamada de continuación.

someAsyncFunction(a, b, c, function(x){ 
    //do something with x; 
    console.log(x); 
}); 

Tiene que tener en cuenta que es muy fácil escribir código confuso. Un buen truco para tener en cuenta es que puede hacer que sus propias funciones también reciban devoluciones de llamada. Esto permite que sean utilizados por la función diferente (al igual que las funciones normales de sincronización de ayuda que devuelven un valor puede ser utilizado por diferentes funciones)

var getXyz = function(onResult){ //async functions that return do so via callbacks 
           //you can also another callback for errors (kind of analogous to throw) 
    $.get('http://www.someurl.com/123=json', function(data) { 
     var xyz = data.positions[0].latitude; 
     onResult(xyz); //instead of writing "return xyz", we pass x to the callback explicitely. 
    }); 
}; 

getXyz(function(xyz){ //this would look like "var xyz = getXyz();" if it were sync code instead. 
    console.log('got xyz'); 
}); 

El truco aquí es cambiar todas las declaraciones de retorno de la función en las llamadas a la función de devolución de llamada. Piense como si la función de sincronización nunca regresara y la única forma de devolverle un valor a alguien es pasar ese valor a una devolución de llamada.

---

Puede que pregunte por qué no hay una manera más fácil de hacer todo esto. Bueno, no hay, a menos que use otro idioma en lugar de Javascript (o al menos algo que le permite escribir código asíncrono en estilo sincrónico pero compila automáticamente a Javascript regular)