Thunk

117 阅读1分钟

题目 扁平化Thunk 例子 假设我们有这样的Callback

type Callback = 
  (error: Error, result: any | Thunk) => void

Thunk是接受Callback为参数的函数。

type Thunk = (callback: Callback) => void

比如如下的3个thunk

const func1 = (cb) => {
  setTimeout(() => cb(null, 'ok'), 10)
}

const func2 = (cb) => {
  setTimeout(() => cb(null, func1), 10)
}

const func3 = (cb) => {
  setTimeout(() => cb(null, func2), 10)
}

在上述的代码中,3个函数在某种意义上被串在了一起, func3 → func2 → func1,不过暂时还无法工作,我们需要额外的“胶水”。

好了,现在请你实现flattenThunk()提供“胶水”让其工作。

flattenThunk(func3)((error, data) => {
   console.log(data) // 'ok'
})

注意

当Error发生时,尚未被调用的函数需要被跳过。

补充:

//整半天楞是没看懂题,对着评论区的代码才看懂题。。其实就是写个函数支持thunk的链式调用,且做出错误处理。
const func1 = (cb) => {
  console.log('fn1')
  setTimeout(() => cb(null, 'ok'), 10)
}

const func2 = (cb) => {
    console.log('fn2')
  setTimeout(() => cb(null, func1), 10)
}

const func3 = (cb) => {
    console.log('fn3')
  setTimeout(() => cb(null, func2), 10)
}
flattenThunk(func3)((error, data) => {
   console.log(data) // 'ok'
})
// fn3
// fn2
// fn1
// ok

答案

//简单来说就是劫持callback,自己实现一个支持链式调用的callback;
function flattenThunk(thunk){ // thunk: 即案例的func3
    return function(callback){// callback: 给定的回调
        const _callback = (error,data) => {
           if(error){
               //立即处理错误
               callback(error);
           }else if(typeof data == 'function'){
               //如果data是一个"Thunk"即函数
               data(_callback);
           }else{
               callback(error,data);
           }
        }
        thunk(_callback);
    }
}