No se puede acceder a la variable global en jQuery $ .get dentro de la función

Question

A continuación se muestra un código con el que estoy teniendo problemas. Básicamente, estoy definiendo una matriz vacía como una variable global (var playlist = []) y luego intento agregarle elementos en una llamada jQuery $ .get. Por lo que he leído en Internet, ¡debería poder hacer esto! El siguiente código muestra el error: "No se puede llamar al método 'play' de undefined". la lista de reproducción [0] se establece dentro de la función, alertar a la lista de reproducción [0] dentro de la llamada $ .get da el resultado esperado, pero no persiste fuera de la función.

var playlist = []; 
function playArtist(artist){ 
    $.get('media/songs/' + artist, 
    function(data){ 
     for (var i in data){ 
     playlist[i] = setSong(data[i].Resource.name,'track' + data[i].Media.id,i + 1); 
     } 
    $('#track-total').text(parseInt(playlist.length)); 
    },'json' 
); 
    playlist[0].play(); 
} 

¿Alguien puede ayudar?

Gracias!

Answer 1

Las posibilidades son, playlist se está utilizando antes de $.get devuelve - como ajax las llamadas son asincrónicas. Funciona dentro de la devolución de llamada de éxito porque se dispara una vez que se ha completado la solicitud, por lo que contendrá los datos que espera.

Answer 2

.get es asincrónico, de ahí la necesidad de proporcionar una función de devolución de llamada. Mientras tu obtención todavía está en proceso, estás tratando de usar la matriz, probablemente antes de que se haya completado.

Answer 3

No tiene que hacer nada de esto. Me encontré con el mismo problema con mi proyecto. lo que debes hacer es realizar una llamada a función dentro de la devolución de llamada exitosa para restablecer la variable global. Siempre que tenga javascript asíncrono establecido en falso, funcionará correctamente. Aquí está mi código. Espero eso ayude.

var exists; 

//function to call inside ajax callback 
function set_exists(x){ 
    exists = x; 
} 

    $.ajax({ 
    url: "check_entity_name.php", 
    type: "POST", 
    async: false, // set to false so order of operations is correct 
    data: {entity_name : entity}, 
    success: function(data){ 
    if(data == true){ 
     set_exists(true); 
    } 
    else{ 
     set_exists(false); 
    } 
    } 
}); 

if(exists == true){ 
    return true; 
} 
else{ 
    return false; 
} 

Espero que te ayude.