我知道 Javascript 是异步的,但在这种情况下我不明白为什么会发生这种情况。
在下面的第 27 行,我调用函数“GetProducer”,该函数应该返回我稍后打算使用的特定生产者的数据。然而,当对其进行控制台输出时,它变得未定义,这是因为第 28 行的代码是在检索数据(第 27 行)之前执行的。
为什么会发生这种情况?我该如何解决?
1. function GetProducer(id) {
2.
3. $.ajaxSetup ({
4. url: "http://localhost/api/v1/producers/" + id,
5. type: "GET",
6. dataType: "json",
7. cache: false,
8. contentType: "application/json"
9. })
10. $.ajax({
11. success: function(data){
12. return data;
13. },
14. error: function(xmlHttpRequest, textStatus, errorThrown) {
15. console.log(xmlHttpRequest);
16. console.log(textStatus);
17. console.log(errorThrown);
18. }
19. }).done(function(data){
20. console.log(data);
21. })
22. }
23.
24. $('.modal-btn').click(function(){
25. var producerId = $(this).attr('id');
26. $('#myModalLabel').html(producerId);
27. var info = GetProducer(producerId);
28. console.log(info); // <--- undefined
29. });
最佳答案
ajax回调函数中的return
语句是没有用的。该函数是异步调用的,您不能期望任何东西将您的返回值传递给任何东西。
如果您将 console.log()
调用内部“成功”回调,您将看到一个值。
您可能需要更改“GetProducer”函数,使其也接受回调参数:
GetProducer(producerId, function(info) { ... });
该函数或多或少看起来像这样:
function GetProducer(producerId, callback) {
$.ajaxSetup({
// ... same
});
$.ajax({
success: function(data) {
callback(data);
},
// etc
});
}
因此,回调函数将是放置处理“生产者”信息的代码的位置。异步编程就是在结果可用时提供处理结果的 API 函数。
关于javascript - 代码以错误的顺序执行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13897066/