Переменные отказываются принимать значения внутри функции обратного вызова jQuery.get

Question

Я определяю, сохранено ли значение в localStorage (если localStorage существует), и если его нет в базе данных (или у пользователя нет браузера с localStorage), тогда я запускаю запрос AJAX GET.*

if (Modernizr.localstorage) {
    // there is storage
    artist = localStorage.getItem('artist');
    if (!artist) {
        // but no cache
        artist = fetchArtist();
        localStorage.setItem('artist', artist)
    }
} else {
    // there's no storage
    artist = fetchArtist();
}
function fetchArtist() {
    var fetchedArtist;
    var recentTracks;
    $.get('script.php', [], function(data) {
        recentTracks = data.recenttracks;
        fetchedArtist = ((recentTracks !== undefined) ? recentTracks.track.artist['#text'] : 'Last.fm connection failed.');
    }, 'json');
    return fetchedArtist;
}

script.php просто получает строку JSON, которую jQuery преобразует в объект данных.Я вижу проблему: поскольку $ .get является асинхронным, переменная fetchedArtist возвращается до того, как функция может присвоить нужное мне значение, но я не могу придумать опрятный способ сделать это (возможно, глобальные переменные,действительно лучше нет).Я могу console.log извлечь fetchedArtist var внутри $ .get и значение, которое мне нужно, но функции fetchArtist всегда возвращают неопределенное значение.

Answer 1

Вы должны асинхронизировать рабочий процесс, удалив операторы возврата из функции fetchArtist(), потому что она не может делать то, что вам нужно, из-за асинхронного поведения запроса $.get.

Попробуйте что-то вроде этого:

if (Modernizr.localstorage) {
    // there is storage
    var artist = localStorage.getItem('artist');
    if (!artist) {
        // but no cache
        fetchArtist();
    } else {
        doWhatYouNeedWithArtist( artist );
    }
} else {
    // there's no storage
    fetchArtist();
}

function fetchArtist() {
    var fetchedArtist;
    var recentTracks;
    $.get('script.php', [], function(data) {
        recentTracks = data.recenttracks;
        fetchedArtist = ((recentTracks !== undefined) ? recentTracks.track.artist['#text'] : 'Last.fm connection failed.');
        if ( Modernizr.localstorage ) {
                Modernizr.localstorage.setItem('artist', fetchedArtist);
        }
        // then do your stuff
        doWhatYouNeedWithArtist( fetchedArtist );
    }, 'json');
}

function doWhatYouNeedWithArtist( artists ) {
    // do stuff
}

Надеюсь, это поможет! Ciao.