我将 3 个 ajax 请求链接到一个 RESTful 端点:
- PUT 一些数据(返回 {} 并确定)
- 获取我刚刚放的数据
- 显示数据
我已经使用 .then()
建立了一个 promise 链。但是请求并没有按照预期的顺序 (1,2,3) 发生,而是 (2,1) 并且以 OPTIONS
请求开始。
为什么它们没有按预期顺序发生?
如何确保顺序正确?
var _id = x;
function doReqs() {
putData(_id, data)
.then(getData(_id))
.then(showData);
}
// returns empty object {}
function putData(id, data) {
return $.ajax({
method: 'PUT',
url: http://xxx,
contentType: 'application/json'
});
}
// returns JSON {"data": {"xx": "xx}}
function getData(id) {
return $.ajax({
method: 'GET',
url: http://xxx
});
}
function showData(data) {
console.log(data);
}
最佳答案
在这段代码中:
function doReqs() {
putData(_id, data)
.then(getData(_id))
.then(showData);
}
.then(getData(_id))
部分是错误的。这是错误的,原因有二。
.then()
应该传递一个函数引用。当您传递getData(_id)
时,您将立即执行该函数并将该函数的返回值(它是一个 jqXHR 对象)传递给.then()
。这不是您应该传递给.then()
的内容。因为您正在立即执行
getData(_id)
,所以它不会在 promise 链序列中正确执行。
请记住,任何时候您传递一个 func()
并将其后的括号作为参数传递时,它会立即执行该函数并将其返回值作为参数传递。由于上述原因,这不是您想要的 .then()
。
如果您试图控制传递给 getData()
的内容,那么您可以确保从 putData()
返回正确的内容,因为那是将传递给 getData()
的内容,或者您可以创建一个 stub 函数来传递正确的内容:
function doReqs() {
putData(_id, data)
.then(function() {
return getData(_id);
})
.then(showData);
}
或者,你可以这样做:
function doReqs() {
putData(_id, data)
.then(getData.bind(null, _id))
.then(showData);
}
或者,由于 putData()
的解析值将作为参数传递给 promise 链中的下一步(即 getData
),您可以这样做:
function putData(id, data) {
return $.ajax({
method: 'PUT',
url: http://xxx,
contentType: 'application/json'
}).then(function() {
// make sure putData passes the id to the next step in the chain
return id;
});
}
function doReqs(id) {
putData(id, data)
.then(getData)
.then(showData);
}
这是一个链式操作的工作示例:
function delay(t, val) {
return new Promise(function(resolve) {
setTimeout(resolve.bind(null, val), t);
});
}
function first(arg) {
console.log("running first..., arg = ", arg);
return delay(500, 10);
}
function second(arg) {
console.log("running second..., arg = ", arg);
return delay(100, 100);
}
function third(arg) {
console.log("running third..., arg = ", arg);
}
first(1).then(second).then(third);
关于javascript - 如何同步链式 jQuery Promise 的顺序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41084184/