需求: 让一个函数, 执行到一半的时候, 去执行其他函数,大致如下
输出顺序依次为: 1 > 3 > 5 > 6 > 4 > 2
上面 koa 的执行,有点类似如下效果: 将 callback 换成了具体函数
const foo = () => {
console.log('1')
const bar = () => {
console.log('3')
const baz = () => {
console.log('5')
console.log('6')
}
baz()
console.log('4')
}
bar()
console.log('2')
}
foo()
实现如下
const foo = (callback) => {
console.log('1')
callback()
console.log('2')
}
const bar = (callback) => {
console.log('3')
callback()
console.log('4')
}
const baz = (callback) => {
console.log('5')
callback()
console.log('6')
}
const middlewares = [foo, bar, baz]
const compose = (middlewares) => {
const dispatch = (i) => {
if (i === middlewares.length) return
return middlewares[i](() => dispatch(i + 1))
}
return dispatch(0)
}
compose(middlewares)
递归的方式, 注意给 middlewares[i]
传的是 () => dispatch(i + 1)
将一个函数传递给另一个函数, 这种风格方式称为: continuatuin-passing
风格(CPS)
关于这种方式, 有个 demo 如下
同步的 CPS
const foo = () => {
console.log('haha')
}
const bar = (arg) => {
console.log(arg)
}
const fn = (fn1, fn2) => {
fn1();
(() => fn2('给回调函数传参'))();
}
fn(foo, bar)
fn 接收 2 个函数, 这 2 个函数做些什么事情我不用关心, 反正我只需要执行他们就行了
我需要给 fn2 传递一个参数, 直接 fn2('一个参数')
不就可以了?
可是, 如果对回调函数进行异步调用呢? 这样写会报错
异步的 CPS
const foo = () => {
console.log('haha')
}
const bar = (arg) => {
console.log(arg)
}
const fn = (callback1, callback2) => {
setTimeout(callback1, 100)
setTimeout(() => callback2('给回调函数传参'), 200)
// 下面的语句会报错: Callback must be a function. Received undefined
// setTimeout(callback2('给回调函数传参'), 300)
}
fn(foo, bar)
setTimeout
接受一个函数, 而不是函数执行的结果, 直接使用 callback2('给回调函数传参')
会报错
注意, 这里我将 fn
变为了 callback
, 说明在函数传的函数为异步函数
回调回调, 回过头来调用它, 不是立即执行, 从名字上可看出其差别