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

前面我们已经学习过了Generator 函数的优势和使用场景

这篇文章我们继续学习阮老师的第二篇文章,Thunk 函数的含义和用法

说实话,在这之前是没听过这个词的,但其实如果你对犀牛书里的不完全函数有认真看过的话
理解起来也不是很费劲。

首先什么是 thunk 函数?

很多场景下我们都会陷入一个问题,就是函数参数的求值时间。

是函数调用时即求值还是在函数内使用时才求值?

var x = 1; function f(m){ return m * 2; } f(x + 5) //我们把在调用时就计算的方式称为传值调用,等同于: f(6) //我们把在函数内部使用时才求值的方式称为传名调用,等同于: return (x + 5) * 2;

两种方式各有利弊,传值调用比较简单,但是如果计算后的结果没有在程序中使用的话,损失就有点大。
因此有很多场景都倾向于传名调用。

但是像 C,java 的编译方式都是固定的,如何基于现有基础改变程序的执行方式。

比较常见的是将想要传名调用的参数放到一个临时函数之中,把临时函数当做参数,只在使用的时候执行。

这个包装参数的临时函数就叫 Thunk 函数。我们试一下用 Thunk 函数改写一下上面的例子:

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

其实这里我倒觉得可以翻翻犀牛书里的不完全函数,跟 Thunk 函数一个道理,

通过 return 一个 function 来实现传名调用。

老师也顺便介绍了用在生产环境的 Thunkify 模块

我们看一下源码,还是有一些好玩的地方的。

function thunkify(fn){ //全局返回一个临时函数 return function(){ var args = new Array(arguments.length); var ctx = this; for(var i = 0; i < args.length; ++i) { args[i] = arguments[i]; } //上面一段将参数copy到args return function(done){ var called; args.push(function(){ if (called) return; //对callback重新包装,控制callback只执行一次 called = true; done.apply(null, arguments); }); try { fn.apply(ctx, args); } catch (err) { done(err); } } } };

执行结果:

function f(a, b, callback){ var sum = a + b; callback(sum); callback(sum); } var ft = thunkify(f); ft(1, 2)(console.log); // 3

这个地方的理解,方法f在执行时的参数并不是 1,2,console.log

console.log 参数在 thunkify 内部被重新包装,成了:

function(){ if (called) return; //对callback重新包装,控制callback只执行一次 called = true; console.log.apply(null, arguments); }

了解了 Thunk 函数之后,我们要停下来想一想,还是那句话,它的出现要解决什么问题?

是不是一定要使用 Thunk 函数?Thunk 用在什么场景下?

从前面的内容来看,其实并没有什么用,可能概念比较新颖,但是使用起来好像并没有太多提高。

但是没用的话我们也不会写这么一篇文章。

自从有了 Generator 函数,Thunk 函数现在可以用于 Generator 函数的自动流程管理。

看一下例子:

var fs = require('fs'); var thunkify = require('thunkify'); var readFile = thunkify(fs.readFile); var gen = function* (){ var r1 = yield readFile('/etc/fstab'); console.log(r1.toString()); var r2 = yield readFile('/etc/shells'); console.log(r2.toString()); };

这个例子中,我们使用 yield 将执行权交给下一个协程,那么就需要有一种方法把执行权在交还给当前函数

这种方法就是 Thunk 函数,因为它可以重新包装回调函数,我们可以自己写包装函数,将执行权交还给 Generator 函数。

为了对比,我们先看一下如果手动执行上面的代码会是什么样的:

var g = gen(); //开始执行协程 var r1 = g.next(); //读取第一个文件 r1.value(function(err, data){ //读取完成执行回调 if (err) throw err; var r2 = g.next(data); //读取第二个文件 r2.value(function(err, data){ //读取完成执行回调 if (err) throw err; g.next(data); //结束协程 }); });

不难发现,上面的代码其实就是将同一个回调函数传入 value 属性(next 执行返回 value 和 done )

我在看的时候就在想,这个value是属性啊,为什么可以执行?还传递参数?

慢慢理一理:

value属性是yield的返回值,gen中的yield返回的是一个 Thunk 函数,不是固定值。

所以可以执行value,看前面例子里的这句:ft(1, 2)(console.log);

value就等同于ft(1, 2)的返回值

传递的function回调等同于(console.log);

这么是不是就理解了?

Thunk 函数真正的威力,在于可以自动执行 Generator 函数。下面就是一个基于 Thunk 函数的 Generator 执行器:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/d36001183d08dd557cac336098157d8b.html