Функция Jquery не ждет результата результата функции Javascript, почему?

Question

У меня 2 метода. второй вызывает первый. Когда я помещаю функцию предупреждения в первую, я вижу возвращаемое значение. Но вторая функция видит значение как неопределенное. Я не мог понять, почему 2. Нельзя справиться с этой ценностью?

function getTweetReply(id_str) { 
    $.getJSON("get_tweet_reply.php", {id_str: id_str}, function(json) { 
     tweet_relpy = '<blockquote>'+json.results[0].text+'</blockquote>'; 
     alert(tweet_relpy); // --> I can see the result 
     return tweet_relpy; 
    }); 
} 

$(document).on("click", ".tweet",function(){ 
    var id_str = $(this).attr("id"); 
    $.getJSON("get_tweet_details.php", {id_str: id_str},  function(json) { 
     tweet = '<img src="'+json.results[0].profile_image_url+'"><br>\ 
       ' + json.results[0].from_user + '<br>\ 
       ' + json.results[0].from_user_name + '<br>\ 
       ' + getTweetReply(json.results[0].id_str) + '</b><br>'; // --> undefined 
     $("#float").html('<div id="replybox">'+ tweet +'</div>'); 
    }); 
}); 

Answer 1

Во-первых, отделить AJAX от вашего поколения контента и разоблачить обещания:

function getTweetDetails(id_str) { 
    return $.getJSON("get_tweet_details.php", {id_str: id_str}); 
} 

function getTweetReply(id_str) { 
    return $.getJSON("get_tweet_reply.php", {id_str: id_str}); 
} 

function render(details, reply) { 
    // render HTML based on "details" and "reply" JSON structures 
    var tweet = '...'; 
    $("#float").html('<div id="replybox">'+ tweet +'</div>'); 
} 

Это разделение задач - две функции, связанные с AJAX теперь не нужен параметр обратного вызова, «обещание», которое возвращается, позволяет любому количеству обратных вызовов зависеть от результата, а также от обратных вызовов ошибок, которые напрямую не поддерживаются $.getJSON().

Затем, поскольку второй запрос зависит от первого:

$(document).on("click", ".tweet", function() { 
    var id_str = this.id; // not $(this).attr('id') !! 
    getTweetDetails(id_str).done(function(details) { 
     getTweetReply(details.results[0].id_str).done(function(reply) { 
      render(details, reply); 
     }); 
    }); 
});