[Compose] Callback is not suitable for Async programming
An example of callback implemnetation for handling async flow:
function fakeAjax(url, cb) {
var fake_responses = {
file1: "The first text",
file2: "The middle text",
file3: "The last text",
};
var randomDelay = (Math.round(Math.random() * 1e4) % 4000) + 1000;
console.log("Requesting: " + url, "time: ", randomDelay);
setTimeout(function () {
cb(fake_responses[url]);
}, randomDelay);
}
function output(text) {
console.log(text);
}
// **************************************
// The old-n-busted callback way
const stack = [];
const response = {};
function getFile(file) {
if (!(file in response)) {
stack.push(file);
}
// CONS:
// 1. It needs global variable to store extra information
// 2. The solution is not flexable to apply elsewhere
// 3. Won't result in a easy to test solution
fakeAjax(file, function (text) {
response[file] = text;
for (let i = 0; i < stack.length; i++) {
if (stack[i] in response) {
if (response[stack[i]] !== false) {
output(response[stack[i]]);
response[stack[i]] = false;
}
} else {
return;
}
}
output("completed!");
});
}
// request all files at once in "parallel"
// and print result in sequencial order
// in the end, print "completed!"
getFile("file1");
getFile("file2");
getFile("file3");
As we can see, the code is not easy to understand, then most like not easy to maintable and resuable.
Callback is used a lot in Node.js, but it is not good to handle async events, for multi reasons.
Callback hell:
If you want events happen in sequence, we have to use nested callback, which results callback hall.
Callback is not reasonable
For a complex async program, if we use lots of callback, it is hard to understand which callback will happen at which time. Often developers got lost in the middle.
Callback: iversion of contrrol
Some callback we don't have control, we might pass a callback to a third parity library, then this library will control when to call this callback
But still we need to worry about callback is called
- Not too early
- Not too late
- Not too many times
- Not too few times
- No lost context
- No swallowed error
But how can we handle all those trust issues? Sadly nope.
There are many tries to fix the issues, but none of those are good enough:
Separate callback:
Pass two callbacks, one for error, one for success.
Problem is how can we make sure two callbacks won't be called at the same time? how to make sure callback are only trigger once? how to make sure only pass one callback without another?
So basiclly inversion of control problem, lack of trust.
function trySomething(ok, err) {
setTimeout(() => {
const num = Math.random()
if (num > 0.5) {
ok(num)
} else {
err(num)
}
}, 1000)
}
trySomething(
(num) => {
console.log('success:', num)
},
(num) => {
console.log("Error: ", num)
}
)
"Error first style":
Now we only use one callback function, and force to do error handling. But it has the same issue as "Separate callback".
How to prevent we receive both error and success callback?....
function trySomething(cb) {
setTimeout(() => {
const num = Math.random()
if (num > 0.5) {
cb(null, num)
} else {
cb("Too low!")
}
}, 1000)
}
trySomething(
(err, num) => {
if (err) console.log(err)
else console.log('success:', num)
}
)
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· AI技术革命,工作效率10个最佳AI工具
2022-10-17 [Typescript] 54. Medium - Tuple to Nested Object
2022-10-17 [Typescript] 53. Medium - Shift
2022-10-17 [Unit testing RxJS] Testing Observables with Subscribe and assert Parttern
2021-10-17 [CSS] Tailwindcss: get started
2021-10-17 [CSS] Purgecss to remove unused css
2019-10-17 [TypeScript] Modifier
2019-10-17 [Flutter] Getting Location Data From Across Platforms