如何从异步调用ajax的返回值问题？

Veröffentlicht am

如何从异步调用ajax的返回值问题？

文章来源自Stack Overflow网站上，Felix Kling提问的问题，这里重点讲的是回答中得票数最高的一个人的答案，希望能够帮助大家更好的了解到ajax的相关知识，当然，有些语法和翻译上会有些错误，可以向我指出。
本人的邮箱:aleenli1992@gmail.com

原问题：

我有一个关于Ajax请求的函数，我怎么才能在foo函数中获取到返回值？

我试着在success这个函数中callback返回值，也试着将返回值赋值到一个局部变量中并且返回它，但是没有一个能够成功的返回的。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function foo() {
    var result;
    $.ajax({
        url: '...',
        success: function(response) {
            result = response;
            // return response; // <- 我也尝试了这样
        }
    });
    return result;
}
var result = foo(); // 结果总是`undefined`.

原答案

问题

异步是Ajax中的最重要的部分，它的意思是发送请求（或者接受返回）是脱离正常处理流。在你的例子中，$.ajax执行之后会立刻返回下一条语句，return result，在这之前函数success的回调函数还没有来得及声明呢。

下面有一些类似的例子，希望能够帮助你彻底的搞懂同步和异步。

同步

想象一下你正在打电话给你的一个朋友，让他帮你找东西。尽管只过了一会，但是在你的朋友还没答复你的这段时间里，你完全是拿着电话无所事事。
相同的事情也发生在当你编写一个普通的代码中：

1
2
3
4
5
6
7
8
9
10
11
function findItem(){
	let item;
	while(item_not_found){
		// 继续找
	}
	return item
}
var item = findItem()
dosomethisElse();

尽管findItem可能花了很长一段时间去执行，任何代码都必须在var item = findItem()之后，只有等待函数返回回来结果了。

异步

你用相同的理由给你的朋友打电话，但是这段时间，你告诉他，你非常着急并且记得回电话给你，你挂了电话，并且做任何你你计划做的事情，一次你的朋友回电话给你，你就可以立刻处理他给你的信息。

这种情况也同时出现在你使用ajax请求的时候。