美文网首页
写一个自己的Thunkify模块

写一个自己的Thunkify模块

作者: pure懒人 | 来源:发表于2017-02-15 15:44 被阅读0次

    什么是Thunk函数

    本段内容无耻抄袭自阮一峰的《ESMAScript 6 入门》中对Thunk函数的介绍

    Thunk 函数早在上个世纪60年代就诞生了。那时,编程语言刚刚起步,计算机学家还在研究编译器怎么写比较好。一个争论的焦点是"求值策略",即函数的参数到底应该何时求值。

    var x = 1
    
    function f(m){
      return m * 2
    }
    
    f(x + 5)
    

    上面代码先定义函数f,然后向它传入表达式x + 5。请问,这个表达式应该何时求值?

    一种意见是"传值调用"(call by value),即在进入函数体之前,就计算x + 5的值(等于6),再将这个值传入函数f。C语言就采用这种策略。

    f(x + 5)
    // 传值调用时,等同于
    f(6)
    

    另一种意见是“传名调用”(call by name),即直接将表达式x + 5传入函数体,只在用到它的时候求值。Haskell 语言采用这种策略。

    f(x + 5)
    // 传名调用时,等同于
    (x + 5) * 2
    

    传值调用和传名调用,哪一种比较好?回答是各有利弊。传值调用比较简单,但是对参数求值的时候,实际上还没用到这个参数,有可能造成性能损失。

    编译器的“传名调用”实现,往往是将参数放到一个临时函数之中,再将这个临时函数传入函数体。这个临时函数就叫做 Thunk 函数。

    function f(m) {
      return m * 2
    }
    
    f(x + 5)
    
    // 等同于
    
    var thunk = function () {
      return x + 5
    }
    
    function f(thunk) {
      return thunk() * 2
    }
    

    上面代码中,函数f的参数x + 5被一个函数替换了。凡是用到原参数的地方,对Thunk函数求值即可。这就是 Thunk 函数的定义,它是“传名调用”的一种实现策略,用来替换某个表达式。

    我眼中的Thunk函数

    上面对Tunk函数的定义已经非常明白了,但是对于JS这门语言来说,其本身就是传值调用的,所以JS中的Thunk函数一般是指,将原本接受回调函数作为参数的多参函数转化为只接受回调函数作为参数的单参函数。这么说好像有点拗口,看下面一段例子:

    // 转化前
    function fn(arg, cb) {
      ...
      cb(err, result)
    }
    // 转化后
    function thunkFn(arg) {
      return function (cb) {
        return fn(arg, cb)
      }
    }
    

    上面这段代码可以看出一般函数转化为Thunk函数需要做一步转换工作,如果每次转化都要这么做无疑是一件麻烦的事情,有句话(瞎编的话)叫做重复的事情做两次就需要抽象提取,对重复工作的厌恶、鄙视是一个优秀(强迫症、龟毛)程序员的基本素养。那么下面我们就开始分析下怎么抽离一个公共的模块(thunkify函数)替代重复劳动。

    Thunkify模块的基础功能

    根据之前的例子我们可以很轻松的推演出一个可以实现thunkify基础功能的函数:

    function thunkify (fn) {
      // 返回准备接收前置参数的Thunk函数
      return function () {
        // 闭包传入的前置参数
        var args = Array.prototype.slice.call(arguments)
    
        // 返回准备接受回调函数的完整功能函数
        return function (cb) {
          // 推入回调函数组成完整参数数组
          args.push(cb)
    
          // 返回最终调用的完整功能函数的返回值
          return fn.apply(null, args)
        }
      }
    }
    

    以上代码基本可以完成一般情况下的Thunkify功能,可以看到整段代码其实和柯里化的原理是类似的,只是并没有像柯里化函数一样细的参数颗粒度,而且对传入的功能函数要求最后一个参数必须是回调函数。第一步返回的Thunk函数需要根据传入的功能函数的要求,在调用时传入所有需要的前置参数,最后必须要传入回调函数才能完成整个Thunk函数的功能。形象的区别可以用代码表示为

    // 柯里化函数的调用,最后的参数‘c’可以为任何需要的类型
    curryingFn(a)(b)(c)
    
    // Thunk函数的调用,最后的参数‘cb’必须为回调函数
    thunk(a,b)(cb)
    

    更健壮的Thunkify模块

    上面的代码已经实现了Thunkify模块的主题功能,但是对于一些细节和特殊情况缺少处理,这样必然会导致错误的发生,下面让我们打造一个更强壮的可以放心使用的公共模块吧。

    • 上下文丢失
      上面的代码没有对回调函数的上下文做特殊处理,比如下面的代码就会出现问题
    var fn = function (cb) {
        cb(null, this.text)
    }
    var obj = {
        text: 'abc',
        thunkFn: thunkify(fn)
    }
    obj.thunkFn()(function (null, text) {
        return text // undefined
    })
    

    解决办法:

    function thunkify (fn) {
        return function () {
          var args = Array.prototype.slice.call(arguments)
          // 闭包上下文
          var ctx = this
          return function (cb) {
            args.push(cb)
            return fn.apply(ctx, args)
          }
        }
    }
    

    ES6简洁写法:

    function thunkify (fn) {
        // 此处不能使用箭头函数,想想为什么?
        return function (...args) {
          return cb => {
            args.push(cb)
            return fn.apply(this, args)
          }
        }
    }
    
    • 错误捕获
      目前还没有添加对错误的捕获和处理,可能会造成程序的意外中断,添加错误处理:
    function thunkify (fn) {
      return function (...args) {
        return cb => {
          args.push(cb)
          let result
          try {
            result = fn.apply(this, args)
          } catch(e) {
            cb(e)
          }
          return result
        }
      }
    }
    
    • 回调函数只运行一次
      这个是之前没考虑到的情况,参考了tj大神写的thunkify模块才意识到这个问题,补上回调函数只运行一次的限制:
    function thunkify (fn) {
      return function (...args) {
        return cb => {
          let done = false
          let result
          // 替换掉原有回调函数,加上运行判断
          args.push(function (...cbArgs) {
            if (done) {
              return
            }
            done = true
            cb(...cbArgs)
          })
          try {
            result = fn.apply(this, args)
          } catch(e) {
            cb(e)
          }
          return result
        }
      }
    }
    

    这样我们就得到了一个完整的、健壮的Thunkify模块,具体代码见es6-thubkify

    相关文章

      网友评论

          本文标题:写一个自己的Thunkify模块

          本文链接:https://www.haomeiwen.com/subject/adcqwttx.html