JS Thunk 函数的含义和用法实例总结

JS Thunk 函数实际上是一种特殊的函数，它将一个多参数函数转换成一个只接受回调函数为参数的单参函数。目的是为了让函数的执行结果可以通过回调函数来获取。

使用 Thunk 函数可以有效地处理异步操作，使得回调嵌套不那么深，也更容易进行错误捕捉。以下将详细解释 Thunk 函数的含义和用法实例总结。

1. 概念

1.1 Thunk 函数的定义

Thunk 函数是指将多个参数的函数封装成单个参数的函数。

1.2 Thunk 函数是什么用途？

Thunk 函数可以让数据的延迟计算成为可能，即只需要在真正需要的时候再计算结果。

1.3 Thunk 函数的简化写法

ES6 的函数默认会遵循 Thunk 函数的规则，即自动把参数转化成一个只包含回调函数的函数。

例如：

let foo = (a, b, callback) => {
  // do something
};

// 上面的函数实际上等价于下面的函数
let fooThunk = (a, b) => {
  return (callback) => {
    // do something
  };
};

2. 实例

下面通过两个实例来说明 Thunk 函数的具体用法。

2.1 实例一

// 原始异步函数
function asyncFunc(value, callback) {
    setTimeout(() => {
        callback(value)
    }, 200)
}

// 转换成 Thunk 函数
function toThunk(func, value) {
    return function(callback) {
        func(value, callback)
    }
}

// 使用 Thunk 函数
let asyncThunk = toThunk(asyncFunc, 42)

asyncThunk((value)=>{
    console.log(value) // 42
})

上述代码中，原始异步函数 asyncFunc 接收两个参数，其中 value 表示需要异步处理的数据，callback 是异步函数执行结束时的回调函数。toThunk 方法接收两个参数，其中 func 表示需要转换为 Thunk 函数的异步函数，value 表示传递给异步函数的数据。toThunk 方法返回一个新的函数，这个新函数只接受一个参数 callback，将该参数作为异步函数的回调函数。调用 asyncThunk 函数时，可以传递一个回调函数，来获取异步函数执行结束时的返回结果。

2.2 实例二

const thunkify = function(fn) {
  return function() {
    let args = new Array(arguments.length)
    let ctx = this

    for (let i = 0; i < args.length; i++) {
      args[i] = arguments[i]
    }

    return function(done) {
      let called

      args.push(function() {
        if (called) {
          return
        }

        called = true
        done.apply(null, arguments)
      })

      try {
        fn.apply(ctx, args)
      } catch (err) {
        done(err)
      }
    }
  }
};

// 原始异步函数
const readFileThunk = thunkify(fs.readFile)

// 使用 Thunk 函数
const file = path.resolve(__dirname, './index.js');
const f = readFileThunk(file);

f((err, res)=>{
    if(err) console.log('Something went wrong!', err);
    else console.log(res);
});

上述代码中，使用 Node.js 的文件读取方法 fs.readFile 作为例子，通过 thunkify 方法将其转换为 Thunk 函数。然后将文件读取路径传递给 Thunk 函数，最后传递一个回调函数来接收读取文件的结果。

总结

Thunk 函数主要用于处理异步操作，将多参数函数转换成单参函数，实现数据延迟计算。ES6 中默认函数遵循 Thunk 函数的规则，自动把参数转化成一个只包含回调函数的函数。我们可以用 Thunk 函数来改善回调函数嵌套的问题，使得代码的可读性和可维护性更加优秀。