es6 --- Thunkify源码分析

首先看一个例子:读取package.json下的文件,并将读取的数据(若读取失败)打印出来

// 导入fs和thunkify模块
var thunkify = require('thunkify');
var fs = require('fs');// 定义读取文件的函数read
var read = thunkify(fs.readFile);// 调用read函数读取package.json下的文件.并对数据进行处理
read('pacage.json')(function(err, str) {console.log(err);console.log(str);
}

以上是以同步方式书写的,异步读取文件并,对文件信息进行处理的操作…

下面是thinkify的源码,阅读一下就好…

function thunkify(fn) {return function() {// 传入的参数,放在数组args中var args = new Array(arguments.length);// 保存环境.放在ctx中var ctx = this;for (var i = 0; i < args.length; ++i) {args[i] = arguments[i];}return function (done) {var called;args.push(function () {if (called) return;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);
var print = console.log.bind(console);
ft(1, 2)(print);

函数本质上是对数据的处理,因此分析函数的一个比较好的方法是把参数都打出来,然后找到其中的联系…
下面将几个关键的数据打印到控制台,

// 可以很清楚看见fn就是自己定义的f,对应的语句就是var ft = thunkify(f). 和 function thunkify(fn)// args来自ft(1, 2)(print) 而 print 来自 var print = console.log.bind(console);对应的再fhunkify中,是 (第一个)return 语句 args = new Array(arguments.length),  for(var i = 0; i < args.length; ++i){args[i] = aguments[i];}// 在第2层return 里面接收参数给done，然后定义了一个called函数(确保回调函数只调用一次),具体实现在args.push里面,若已经调用过,会return ,对应if(called) return;经过args.push后,可以看见args2变为3个., 即多了一个函数就是callback函数,对应实例也就是print = console.log.bind(console).// 最后是一个try...catch块.尝试使用f(a,b,callback).. 参数都在args里面// 这样写的好处是:异步实现,方便阅读.. 前面ft(1,2)可以是一个异步操作，如读取文件，或ajax请求网页数据,后面是一个回调函数(cb),这样就是一个同步的写法..

参考《ES6标准入门》(第3版)P364~P365

es6 --- Thunkify源码分析相关推荐

koa源码分析-co模块以及thunk
Thunk以及CO模块 co4.0之前都是返回的thunk函数之后的都是返回promise thunk thunk:在 JavaScript 语言中,Thunk 函数替换的是将多参数函数,替换成单参 ...
lodash源码分析之获取数据类型
所有的悲伤,总会留下一丝欢乐的线索,所有的遗憾,总会留下一处完美的角落,我在冰峰的深海,寻找希望的缺口,却在惊醒时,瞥见绝美的阳光! --几米本文为读 lodash 源码的第十八篇,后续文章会更新到 ...
Koa源码分析（二） -- co的实现
Abstract 本系列是关于Koa框架的文章,目前关注版本是Koa v1.主要分为以下几个方面: Koa源码分析(一) -- generator Koa源码分析(二) -- co的实现 Koa源码分 ...
Vuex 2.0 源码分析
作者:滴滴公共前端团队 - 黄轶大家好,我叫黄轶,来自滴滴公共前端团队,我们团队最近写了一本书 --<Vue.js 权威指南>,内容丰富,由浅入深.不过有一些同学反馈说缺少 Vuex 的 ...
编译打包vue_Vue 源码分析（一）
Vue 源码分析( 一 )目录结构.版本.入口 1.Vue 源码目录结构 dist:打包之后生成的结果目录 examples:代码示例 scripts:配置文件 src:源代码目录compiler: ...
lodash源码分析之baseFindIndex中的运算符优先级
我悟出权力本来就是不讲理的--蟑螂就是海米:也悟出要造反,内心必须强大到足以承受任何后果才行. --北岛<城门开> 本文为读 lodash 源码的第十篇,后续文章会更新到这个仓库中,欢迎 ...
vue源码分析系列三：render的执行过程和Virtual DOM的产生
render 手写 render 函数,仔细观察下面这段代码,试想一下这里的 createElement 参数是什么 . new Vue({el: '#application',render(crea ...
微前端框架之 qiankun 从入门到源码分析
当学习成为了习惯,知识也就变成了常识.感谢各位的点赞.收藏和评论. 新视频和文章会第一时间在微信公众号发送,欢迎关注:李永宁lyn 文章已收录到 github,欢迎 Watch 和 Star. 简介 ...
Vue3源码分析之打包原理
Vue3源码分析之打包原理如果之前你已经看过我的<Vue3源码分析之入门>,那么你可以直接阅读此篇文章 Vue3源码分析之入门一.配置环境 1. 全局安装yarn Monorepo 管 ...

es6 --- Thunkify源码分析

es6 --- Thunkify源码分析相关推荐

最新文章

热门文章