我想展示 jQuery 延迟对象可以让代码变得多么干净,而不是使用“回调 hell ”。
我无法切换到 Javascript 的 Promises。
这是“错误”代码:
/* Callback Hell !? */
// Main
var stringToProcess = "1,2,3,4,5,6";
console.debug("Main Stack: start");
convertStringToArray(stringToProcess, function (convertedString){
convertToObject(convertedString, function(objectOfStrings){
resetObjectValues(objectOfStrings, function(object){
console.debug(object);
});
});
});
console.debug("Main Stack: end");
// Functions
function resetObjectValues(object, callback){
for(var key in object){
object[key] = "X";
}
setTimeout(function thirdcb(){
callback(object);
}, 500);
}
function convertToObject(string, callback){
var object = {};
string.map(function(current, index){
object[index] = current;
});
setTimeout(function secondcb(){
callback(object);
}, 500);
}
function convertStringToArray(string, callback){
var delimiter = ",";
var arrayString = string.split(delimiter);
setTimeout(function firstcb(){
callback(arrayString);
}, 500);
}
这就是我试图让它变得更好的方法:
/* Promise Heaven... */
// Main
var stringToProcess = "1,2,3,4,5,6";
console.debug("Main Stack: start");
var promise;
promise = convertStringToArray(stringToProcess);
promise.done(function(string){
promise = convertToObject(string);
promise.done(function(object){
promise = resetObjectValues(object);
promise.done(function(object){
console.debug(object);
})
})
});
console.debug("Main Stack: end");
// Functions
function resetObjectValues(object, callback){
var deferred = $.Deferred();
for(var key in object){
object[key] = "X";
}
setTimeout(function thirdcb(){
deferred.resolve(object);
}, 500);
return deferred.promise();
}
function convertToObject(string){
var deferred = $.Deferred();
var object = {};
string.map(function(current, index){
object[index] = current;
});
setTimeout(function secondcb(){
deferred.resolve(object);
}, 500);
return deferred.promise();
}
function convertStringToArray(string){
var deferred = $.Deferred();
var delimiter = ",";
var arrayString = string.split(delimiter);
setTimeout(function firstcb(){
deferred.resolve(arrayString);
}, 500);
return deferred.promise();
}
...可悲的是,.done() 代码看起来几乎和“ hell ”代码一样糟糕。我无法弄清楚我们如何正确链接 promise /延期的返回。我看到了教程,他们在没有函数调用参数的情况下执行此操作。但我有一些争论要提出——那么如何相处呢?
最佳答案
promise 链应该看起来像这样:
convertStringToArray(stringToProcess)
.then(function(string){
return convertToObject(string);
})
.then(function(object){
return resetObjectValues(object);
})
.then(function(object){
console.debug(object);
});
基本上每个(回调)函数都会返回一个新的 Promise,然后可以使用该 Promise 将其他处理程序附加到它。这样您就不需要像代码中那样嵌套回调。
关于javascript - jQuery Promise/Deferred 代码比回调更好?如何实现这一目标?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37727570/