从C#到TypeScript - Generator

从C#到TypeScript - Generator

上篇讲了PromisePromise的执行需要不停的调用then,虽然比callback要好些,但也显得累赘。所以ES6里添加了Generator来做流程控制,可以更直观的执行Promise,但终级方案还是ES7议案中的async await
当然async await本质上也还是Generator,可以算是Generator的语法糖。
所以这篇先来看下Generator.

Generator语法

先来看个例子:

function* getAsync(id: string){ yield 'id'; yield id; return 'finish'; } let p = getAsync('123'); console.info(p.next()); console.info(p.next()); console.info(p.next());

先看下和普通函数的区别,function后面多了一个*,变成了function*,函数体用到了yield,这个大家比较熟悉,C#也有,返回可枚举集合有时会用到。
在ES6里yield同样表示返回一个迭代器,所以用到的时候会用next()来顺序执行返回的迭代器函数。
上面代码返回的结果如下:

{ value: 'id', done: false } { value: '123', done: false } { value: 'finish', done: true }

可以看到next()的结果是一个对象,value表示yield的结果,done表示是否真正执行完。
所以看到最后return了finishdone就变成true了,如果这时再继续执行next()得到的结果是{ value: undefined, done: true }.

Generator原理和使用

Generator其实是ES6对协程的一种实现,即在函数执行过程中允许保存上下文同时暂停执行当前函数转而去执行其他代码,过段时间后达到条件时继续以上下文执行函数后面内容。
所谓协程其实可以看做是比线程更小的执行单位,一个线程可以有多个协程,协程也会有自己的调用栈,不过一个线程里同一时间只能有一个协程在执行。
而且线程是资源抢占式的,而协程则是合作式的,怎样执行是由协程自己决定。
由于JavaScript是单线程语言,本身就是一个不停循环的执行器,所以它的协程是比较简单的,线程和协程关系是 1:N。
同样是基于协程goroutine的go语言实现的是 M:N,要同时协调多个线程和协程,复杂得多。
Generator中碰到yield时会暂停执行后面代码,碰到有next()时再继续执行下面部分。

当函数符合Generator语法时,直接执行时返回的不是一个确切的结果,而是一个函数迭代器,因此也可以用for...of来遍历,遍历时碰到结果done为true则停止。

function* getAsync(id: string){ yield 'id'; yield id; return 'finish'; } let p = getAsync('123'); for(let id of p){ console.info(id); }

打印的结果是:

id
123

因为最后一个finishdone是true,所以for...of停止遍历,最后一个就不会打印出来。
另外,Generatornext()是可以带参数的,

function* calc(num: number){ let count = yield 1 + num; return count + 1; } let p = calc(2); console.info(p.next().value); // 3 console.info(p.next().value); // NaN //console.info(p.next(3).value); // 4

上面的代码第一个输出是yield 1 + num的结果,yield 1返回1,加上传进来的2,结果是3.
继续输出第二个,按正常想法,应该输出3,但是由于yield 1是上一轮计算的,这轮碰到上一轮的yield时返回的总是undefined
这就导致yield 1返回undefined,undefined + num返回的是NaN,count + 1也还是NaN,所以输出是NaN
注释掉第二个,使用第三个就可以返回预期的值,第三个把上一次的结果3用next(3)传进去,所以可以得到正确结果。
如果想一次调用所有,可以用这次方式来递归调用:

let curr = p.next();
while(!curr.done){console.info(curr.value);curr = p.next(curr.value);
}
console.info(curr.value); // 最终结果

Generator可以配合Promise来更直观的完成异步操作。

function delay(): Promise<void>{ return new Promise<void>((resolve, reject)=>{setTimeout(()=>resolve(), 2000)}); } function* run(){ console.info('start'); yield delay(); console.info('finish'); } let generator = run(); generator.next().value.then(()=>generator.next());

run这个函数来看,从上到下执行是很好理解的,先输出'start',等待2秒,再输出'finish'。
只是执行时需要不停的使用then,好在TJ大神写了CO模块,可以方便的执行这种函数,把Generator函数传给co即可。

co(run).then(()=>console.info('success'));

co的实现原理可以看下它的核心代码:

function co(gen) { var ctx = this; var args = slice.call(arguments, 1); return new Promise(function(resolve, reject) { if (typeof gen === 'function') gen = gen.apply(ctx, args); if (!gen || typeof gen.next !== 'function') return resolve(gen); onFulfilled(); //最主要就是这个函数,递归执行next()和then() function onFulfilled(res) { var ret; try { ret = gen.next(res); // next(), res是上一轮的结果 } catch (e) { return reject(e); } next(ret); // 里面调用then,并再次调用onFulfilled()实现递归 return null; } function onRejected(err) { // 处理失败的情况 var ret; try { ret = gen.throw(err); } catch (e) { return reject(e); } next(ret); } function next(ret) { if (ret.done) return resolve(ret.value); // done是true的话表示完成,结束递归 var value = toPromise.call(ctx, ret.value); if (value && isPromise(value)) return value.then(onFulfilled, onRejected); //递归onFulfilled return onRejected(new TypeError('You may only yield a function, promise, generator, array, or object, ' + 'but the following object was passed: "' + String(ret.value) + '"')); } }); }

可以看到co的核心代码和我上面写的递归调用Generator函数的本质是一样的,不断调用下一个Promise,直到done为true。

纵使有co这个库,但是使用起来还是略有不爽,下篇就轮到async await出场,前面这两篇都是为了更好的理解下一篇。

转载于:https://www.cnblogs.com/yulei126/p/6790030.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/401053.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

C#中检查null的语法糖

&#x1f680; 优质资源分享 &#x1f680; 学习路线指引&#xff08;点击解锁&#xff09;知识定位人群定位&#x1f9e1; Python实战微信订餐小程序 &#x1f9e1;进阶级本课程是python flask微信小程序的完美结合&#xff0c;从项目搭建到腾讯云部署上线&#xff0c;打造一…

iOS UItextView监听输入特定字符跳转页面选择选项返回

今天有朋友问我一个需求的实现,于是自己写了一个Demo简单的实现了一下: 需求是: 1>比如: 检测用户输入"A"字符串,跳转页面选择选项,将选择的选项放置textView里,作为当前的输入; 2>不是"A"字符,则正常的textView输入; 3.用户跳转选择了,则将选择的输…

PDCA循环——快速提升软件质量的必备工具

&#x1f680; 优质资源分享 &#x1f680; 学习路线指引&#xff08;点击解锁&#xff09;知识定位人群定位&#x1f9e1; Python实战微信订餐小程序 &#x1f9e1;进阶级本课程是python flask微信小程序的完美结合&#xff0c;从项目搭建到腾讯云部署上线&#xff0c;打造一…

oracle 表空间 用户

-- create user mapecun identified by "accp"; --alter user 用户名 quota unlimited on 表空间; --alter user mapecun quota unlimited on USERS; --grant create sequence to mapecun; /** grant create session to mapecun; grant create table to mapecun; g…

如何在Web前端实现CAD图文字全文搜索功能之技术分享

&#x1f680; 优质资源分享 &#x1f680; 学习路线指引&#xff08;点击解锁&#xff09;知识定位人群定位&#x1f9e1; Python实战微信订餐小程序 &#x1f9e1;进阶级本课程是python flask微信小程序的完美结合&#xff0c;从项目搭建到腾讯云部署上线&#xff0c;打造一…

基于Java (spring-boot)的仓库管理系统

一、项目介绍 本系统的使用者一共有系统管理员、仓库管理员和普通用户这3种角色: 1.系统管理员&#xff1a;通过登录系统后&#xff0c;可以进行管理员和用户信息的管理、仓库和物品分类的管理&#xff0c;以及操作日志的查询&#xff0c;具有全面的系统管理权限。 2.仓库管理…

基于语义感知SBST的API场景测试智能生成

&#x1f680; 优质资源分享 &#x1f680; 学习路线指引&#xff08;点击解锁&#xff09;知识定位人群定位&#x1f9e1; Python实战微信订餐小程序 &#x1f9e1;进阶级本课程是python flask微信小程序的完美结合&#xff0c;从项目搭建到腾讯云部署上线&#xff0c;打造一…

【KMP模板】简单写个KMP~

本来easy的KMP 却一直过不了洛谷的模板题。。。 仔细一看原来在输出next数组时打的回车而不是空格。。。 身败名裂。。。 话说有个sunday貌似一般状况下比KMP快呢。。。去看看2333 #include<cstdio> #include<iostream> #include<cstring> #include<algor…

2015 CALLED THE INTERFACE OF 2014

Writer&#xff1a;BYSocket&#xff08;泥沙砖瓦浆木匠&#xff09; 微博&#xff1a;BYSocket豆瓣&#xff1a;BYSocketReprint it anywhere u want. ”Hi , Happy New Year.Written in Stupid Enlish,Dont push me *.* ” 2014 System 2015 is coming.But 2014 is not over.…

论文解读(MERIT)《Multi-Scale Contrastive Siamese Networks for Self-Supervised Graph Representation Learni

&#x1f680; 优质资源分享 &#x1f680; 学习路线指引&#xff08;点击解锁&#xff09;知识定位人群定位&#x1f9e1; Python实战微信订餐小程序 &#x1f9e1;进阶级本课程是python flask微信小程序的完美结合&#xff0c;从项目搭建到腾讯云部署上线&#xff0c;打造一…

Fiddler抓包9-保存会话(save)

前言 为什么要保存会话呢&#xff1f;举个很简单的场景&#xff0c;你在上海测试某个功能接口的时候&#xff0c;发现了一个BUG&#xff0c;而开发这个接口的开发人员是北京的一家合作公司。你这时候给对方开发提bug&#xff0c; 如何显得专业一点&#xff0c;能让对方心服口服…

『现学现忘』Git基础 — 17、Commit对象

&#x1f680; 优质资源分享 &#x1f680; 学习路线指引&#xff08;点击解锁&#xff09;知识定位人群定位&#x1f9e1; Python实战微信订餐小程序 &#x1f9e1;进阶级本课程是python flask微信小程序的完美结合&#xff0c;从项目搭建到腾讯云部署上线&#xff0c;打造一…

Spring/MVC映射WEB-INF下的文件(img、css、js等)

学过Mvc的都知道并且会访问该目录下面的jsp 页面&#xff08;这是最基础的&#xff09; 但我们想访问里面的图片什么的&#xff0c;又该怎么去访问呢&#xff0c; 一句代码&#xff1a; <mvc:resources mapping"/img/**" location"/WEB-INF/img/"/> …

NSDate 类的总结,全面基础

NSDate 类的总结,全面基础 <span style"font-size:24px;"><span style"font-size:18px;">//1.创建日期对象//创建的NSDate对象,获得的永远是0时区时间,假设要是求东八区时间,就加8个小时NSDate *date [NSDate date];NSLog("%",date…

《HelloGitHub》第 73 期

&#x1f680; 优质资源分享 &#x1f680; 学习路线指引&#xff08;点击解锁&#xff09;知识定位人群定位&#x1f9e1; Python实战微信订餐小程序 &#x1f9e1;进阶级本课程是python flask微信小程序的完美结合&#xff0c;从项目搭建到腾讯云部署上线&#xff0c;打造一…

FTP命令大全

项目需要&#xff0c;接触到ftp的一些操作&#xff0c;这里搬运一些ftp命令供以后参考 命令描述ABOR(ABORT)此命令使服务器终止前一个FTP服务命令以及任何相关数据传输。ACCT(ACCOUNT)此命令的参数部分使用一个Telnet字符串来指明用户的账户。ADAT(AUTHENTICATION/SECURITY DAT…

typora + EasyBlogImageForTypora直接上传图片到博客园

&#x1f680; 优质资源分享 &#x1f680; 学习路线指引&#xff08;点击解锁&#xff09;知识定位人群定位&#x1f9e1; Python实战微信订餐小程序 &#x1f9e1;进阶级本课程是python flask微信小程序的完美结合&#xff0c;从项目搭建到腾讯云部署上线&#xff0c;打造一…

20155320 第十一周课堂总结

20155320 第十一周课堂总结 未及时提交原因&#xff1a; 对代码掌握的不熟练&#xff0c;并且由于起初不知道自己电脑浏览器不支持蓝墨云图片提交&#xff0c;尝试几次后只能把图片传到手机上导致截图没有及时提交 1,。测试题目 1.修改教材P74 一行代码 NineNineTable.java, 让…

Nginx的安装(笔记)

0, 先决条件Nginx 依赖 zlib zlib-devel gcc-c libtool openssl openssl-devel pcre安装命令&#xff1a;yum -y install make zlib zlib-devel gcc-c libtool openssl openssl-devel pcre安装命令&#xff1a;wget http://downloads.sourceforge.net/project/pcre/pcre/8.41/p…

.NET混合开发解决方案14 WebView2的基本身份验证

&#x1f680; 优质资源分享 &#x1f680; 学习路线指引&#xff08;点击解锁&#xff09;知识定位人群定位&#x1f9e1; Python实战微信订餐小程序 &#x1f9e1;进阶级本课程是python flask微信小程序的完美结合&#xff0c;从项目搭建到腾讯云部署上线&#xff0c;打造一…