js的co.js源码解析

2024-03-27 21:58
文章标签 源码 js 解析 co

本文主要是介绍js的co.js源码解析,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

co的主要思想是利用把每个yield后面的值转成一个Promise对象,然后给该Promise对应注册fulfilled和rejected两个回调,在这两个回调里会执行next函数,进行下一步迭代,也就是执行下一个yield,从而不断地向前驱动迭代器,直到执行完毕或者出错。

co的好处:

    var content = yield readSomethingAsync();console.log(content);

即使readSomethingAsync是异步完成的,但是当执行到console.log(content);这里的时候可以保证content的内容是我们想要的。而不需要通过在一大堆回调里对content进行赋值。这就是通过同步的方式写异步代码。
co的大致执行流程
这里写图片描述


/*** slice() reference.*/var slice = Array.prototype.slice;/*** Expose `co`.*/module.exports = co['default'] = co.co = co;/*** Wrap the given generator `fn` into a* function that returns a promise.* This is a separate function so that* every `co()` call doesn't create a new,* unnecessary closure.** @param {GeneratorFunction} fn* @return {Function}* @api public*/
// 包裹一个generatorFunction,后面执行
co.wrap = function (fn) {createPromise.__generatorFunction__ = fn;return createPromise;function createPromise() {// 执行generatorFunction,返回一个iterator供co使用return co.call(this, fn.apply(this, arguments));}
};/*** Execute the generator function or a generator* and return a promise.** @param {Function} fn* @return {Promise}* @api public*/
// 参数可以是生成器函数或者迭代器
function co(gen) {var ctx = this;// 获取传给生成器函数的参数,如果gen是迭代器则该参数没用,见下面的gen.apply(ctx, args);var args = slice.call(arguments, 1)// we wrap everything in a promise to avoid promise chaining,// which leads to memory leak errors.// see https://github.com/tj/co/issues/180return new Promise(function(resolve, reject) {/* gen是函数说明是一个生成器函数,此时,执行生成器函数返回一个迭代器如果gen不是一个函数,则一般情况下是一个迭代器,否则直接resovle该值返回*/if (typeof gen === 'function') gen = gen.apply(ctx, args);if (!gen || typeof gen.next !== 'function') return resolve(gen);// 迭代器开始自动执行onFulfilled();/*** @param {Mixed} res* @return {Promise}* @api private*/function onFulfilled(res) {var ret;try {// 执行到yield语句,返回yield语句右边的值,传入的res是上一个yield右边对应的Promise决议的值ret = gen.next(res);} catch (e) {// 出错则rejectreturn reject(e);}// 已yield返回值为参数,执行next,进行下一次的迭代next(ret);}/*** @param {Error} err* @return {Promise}* @api private*/function onRejected(err) {var ret;try {// 抛出异常,如果当前的yield在try中,则该异常由生成器内部捕获处理,否则由onRejected函数处理ret = gen.throw(err);} catch (e) {return reject(e);}next(ret);}/*** Get the next value in the generator,* return a promise.** @param {Object} ret* @return {Promise}* @api private*/function next(ret) {// 迭代器执行完毕则resolveif (ret.done) return resolve(ret.value);// 把yield返回的值,也就是迭代器返回的值转成Promisevar value = toPromise.call(ctx, ret.value);/*如果返回的值是一个Promise,或者能被转成Promise,则注册后续的回调,等待value(a Promise)的决议,resolve或者reject。这里是co库的重点,每一次yield后,返回的值都会被转成一个Promise,然后等待该Promise决议,执行注册的回调,在回调中继续调用next执行下一次迭代,也就是执行下一个yield,循环这个过程,直到迭代器结束。*/if (value && isPromise(value)) return value.then(onFulfilled, onRejected);// 不能转成Promise则抛出异常return onRejected(new TypeError('You may only yield a function, promise, generator, array, or object, '+ 'but the following object was passed: "' + String(ret.value) + '"'));}});
}/*** Convert a `yield`ed value into a promise.** @param {Mixed} obj* @return {Promise}* @api private*/
// 把obj转成Promise
function toPromise(obj) {if (!obj) return obj;if (isPromise(obj)) return obj;if (isGeneratorFunction(obj) || isGenerator(obj)) return co.call(this, obj);if ('function' == typeof obj) return thunkToPromise.call(this, obj);if (Array.isArray(obj)) return arrayToPromise.call(this, obj);if (isObject(obj)) return objectToPromise.call(this, obj);return obj;
}/*** Convert a thunk to a promise.** @param {Function}* @return {Promise}* @api private*/
/*把thunk函数转成Promise,thunk函数具体可参考thunkify库,实际是一个偏函数,最后一个参数需要一个回调,如下代码所示。
*/
function thunkToPromise(fn) {var ctx = this;return new Promise(function (resolve, reject) {/*fn是一个偏函数,里面包裹这一个异步函数,此时他还需要最后一个参数,也就是回调函数。如果不调用回调则该Promise无法决议。执行fn的时候,一般是一个异步的操作,比如readFile读取文件,然后读取完毕后会执行回调,在回调了执行该Promise的resolve或者reject*/fn.call(ctx, function (err, res) {if (err) return reject(err);if (arguments.length > 2) res = slice.call(arguments, 1);resolve(res);});});
}/*** Convert an array of "yieldables" to a promise.* Uses `Promise.all()` internally.** @param {Array} obj* @return {Promise}* @api private*/
// 数组转成Promise
function arrayToPromise(obj) {// 把数组里的每个元素都转成Promise,Promise.all等待该数组中的所有的Promise决议return Promise.all(obj.map(toPromise, this));
}/*** Convert an object of "yieldables" to a promise.* Uses `Promise.all()` internally.** @param {Object} obj* @return {Promise}* @api private*/function objectToPromise(obj){var results = new obj.constructor();var keys = Object.keys(obj);var promises = [];// 把对象中的每个值转成一个Promisefor (var i = 0; i < keys.length; i++) {var key = keys[i];// 把对象的值转成Promise,如果不能转,则直接记录该值var promise = toPromise.call(this, obj[key]);if (promise && isPromise(promise)) defer(promise, key);else results[key] = obj[key];}// 等待所有Promise的决议,然后返回resultsreturn Promise.all(promises).then(function () {return results;});// 往promises数组中加promisefunction defer(promise, key) {// predefine the key in the resultresults[key] = undefined;promises.push(promise.then(function (res) {results[key] = res;}));}
}/*** Check if `obj` is a promise.** @param {Object} obj* @return {Boolean}* @api private*/function isPromise(obj) {return 'function' == typeof obj.then;
}/*** Check if `obj` is a generator.** @param {Mixed} obj* @return {Boolean}* @api private*/function isGenerator(obj) {return 'function' == typeof obj.next && 'function' == typeof obj.throw;
}/*** Check if `obj` is a generator function.** @param {Mixed} obj* @return {Boolean}* @api private*/
function isGeneratorFunction(obj) {var constructor = obj.constructor;if (!constructor) return false;if ('GeneratorFunction' === constructor.name || 'GeneratorFunction' === constructor.displayName) return true;return isGenerator(constructor.prototype);
}/*** Check for plain object.** @param {Mixed} val* @return {Boolean}* @api private*/function isObject(val) {return Object == val.constructor;
}

这篇关于js的co.js源码解析的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/853507

相关文章

Java中Redisson 的原理深度解析

《Java中Redisson的原理深度解析》Redisson是一个高性能的Redis客户端,它通过将Redis数据结构映射为Java对象和分布式对象,实现了在Java应用中方便地使用Redis,本文... 目录前言一、核心设计理念二、核心架构与通信层1. 基于 Netty 的异步非阻塞通信2. 编解码器三、

Java HashMap的底层实现原理深度解析

《JavaHashMap的底层实现原理深度解析》HashMap基于数组+链表+红黑树结构,通过哈希算法和扩容机制优化性能,负载因子与树化阈值平衡效率,是Java开发必备的高效数据结构,本文给大家介绍... 目录一、概述:HashMap的宏观结构二、核心数据结构解析1. 数组(桶数组)2. 链表节点(Node

Java 虚拟线程的创建与使用深度解析

《Java虚拟线程的创建与使用深度解析》虚拟线程是Java19中以预览特性形式引入,Java21起正式发布的轻量级线程,本文给大家介绍Java虚拟线程的创建与使用,感兴趣的朋友一起看看吧... 目录一、虚拟线程简介1.1 什么是虚拟线程?1.2 为什么需要虚拟线程?二、虚拟线程与平台线程对比代码对比示例:三

一文解析C#中的StringSplitOptions枚举

《一文解析C#中的StringSplitOptions枚举》StringSplitOptions是C#中的一个枚举类型,用于控制string.Split()方法分割字符串时的行为,核心作用是处理分割后... 目录C#的StringSplitOptions枚举1.StringSplitOptions枚举的常用

Python函数作用域与闭包举例深度解析

《Python函数作用域与闭包举例深度解析》Python函数的作用域规则和闭包是编程中的关键概念,它们决定了变量的访问和生命周期,:本文主要介绍Python函数作用域与闭包的相关资料,文中通过代码... 目录1. 基础作用域访问示例1:访问全局变量示例2:访问外层函数变量2. 闭包基础示例3:简单闭包示例4

MyBatis延迟加载与多级缓存全解析

《MyBatis延迟加载与多级缓存全解析》文章介绍MyBatis的延迟加载与多级缓存机制,延迟加载按需加载关联数据提升性能,一级缓存会话级默认开启,二级缓存工厂级支持跨会话共享,增删改操作会清空对应缓... 目录MyBATis延迟加载策略一对多示例一对多示例MyBatis框架的缓存一级缓存二级缓存MyBat

前端缓存策略的自解方案全解析

《前端缓存策略的自解方案全解析》缓存从来都是前端的一个痛点,很多前端搞不清楚缓存到底是何物,:本文主要介绍前端缓存的自解方案,文中通过代码介绍的非常详细,需要的朋友可以参考下... 目录一、为什么“清缓存”成了技术圈的梗二、先给缓存“把个脉”:浏览器到底缓存了谁?三、设计思路:把“发版”做成“自愈”四、代码

Java集合之Iterator迭代器实现代码解析

《Java集合之Iterator迭代器实现代码解析》迭代器Iterator是Java集合框架中的一个核心接口,位于java.util包下,它定义了一种标准的元素访问机制,为各种集合类型提供了一种统一的... 目录一、什么是Iterator二、Iterator的核心方法三、基本使用示例四、Iterator的工

JS纯前端实现浏览器语音播报、朗读功能的完整代码

《JS纯前端实现浏览器语音播报、朗读功能的完整代码》在现代互联网的发展中,语音技术正逐渐成为改变用户体验的重要一环,下面:本文主要介绍JS纯前端实现浏览器语音播报、朗读功能的相关资料,文中通过代码... 目录一、朗读单条文本:① 语音自选参数,按钮控制语音:② 效果图:二、朗读多条文本:① 语音有默认值:②

在Node.js中使用.env文件管理环境变量的全过程

《在Node.js中使用.env文件管理环境变量的全过程》Node.js应用程序通常依赖于环境变量来管理敏感信息或配置设置,.env文件已经成为一种流行的本地管理这些变量的方法,本文将探讨.env文件... 目录引言为什么使php用 .env 文件 ?如何在 Node.js 中使用 .env 文件最佳实践引