переменная JQuery становится неопределенным без причины

Question

У меня есть следующий код, в котором я хочу, чтобы сохранить содержимое файла bar.txt в переменной foo:

var foo; 

jQuery.get('http://example.com/bar.txt', function(data) { 
    foo = data; 
    alert(foo); 
});   

alert(foo); 

Проблема заключается в том, что, по-видимому, после того, как функции JQuery конец переменной становится неопределенной (хотя она была объявлена ​​вне той области). Первый alert(foo) отображает содержимое файла правильно, но второй ничего не отображает.

Может ли кто-нибудь сказать мне, что здесь происходит?

Answer 1

Это как асинхронное программирование работы. Функция $.get «заканчивается», когда вызов обработчика обратного вызова вызывается не линейным способом, следуя коду.

«Первый» alert(), который будет запускаться при запуске этого кода, является тем, который вы вызывали в последней строке (за пределами $.get обработчиком), к тому времени запрос ajax еще не завершен.

Второй alert произойдет, когда ajax будет завершен (внутри обработчика $.get) и отобразит данные, которые вы назначили переменной, исходя из аргумента обработчика.

Некоторые комментарии к вашему коду, надеюсь, вы поймете лучше:

var foo; // foo is now undefined 

jQuery.get('http://example.com/bar.txt', function(data) { 
    // the code in this handler will be executed after the ajax is complete 
    foo = data; 
    alert(foo); // foo is now the contents of bar.txt, this will happen last 
});   

alert(foo); // foo is still undefined, and this alert happens first 

Вы можете запрограммировать это по-другому, если вам нужен пример того, как «повторно» переменную Foo:

var foo; 

jQuery.get('http://example.com/bar.txt', function(data) { 
    foo = data; 
    onData(); 
});   

function onData() { 
    alert(foo); 
} 

Answer 2

попробовать

var foo; 

jQuery.get('http://example.com/bar.txt', function(data) { 
    window.foo = data; 
    alert(foo); 
});   

alert(foo);