——基于es6:Promise/A 规范简单实现 异步流程控制思想
前言:
nodejs强大的异步处理能力使得它在服务器端大放异彩,基于它的应用不断的增加,但是异步随之带来的嵌套、难以理解的代码让nodejs看起来并没有那么优雅,显得臃肿。类似于这样的代码:
function println(name,callback){var value = {"ztf":"abc","abc":"def","def":1} setTimeout(function(){ callback(value[name]); },500); } println("ztf",function(name){ println(name,function(res){ console.log(res);//def println(res,function(res1){ console.log(res1);//1 }) }); });
上面的代码 println中定义了value对象,延迟五百秒调用callback传入相关的值,
首先调用println传入"ztf",假设下一个执行函数依赖与本次传回的值,那么调用就变成了上面的代码 传入ztf返回abc ,使用abc返回def,使用def返回1;
因为nodejs是作为服务端使用,必不可少的就是各种数据库查询,数据库查询拥有更多的依赖,比如我需要查询某个用户的权限,那么需要三步
① 通过id查找用户
② 通过返回的用户角色id查找对应的角色
③ 通过角色找到对应的权限
此处便需要三层嵌套关系,代码也就和上面的差不多了 。
promise/A 规范
Promise表示一个异步操作的最终结果。它有三个状态,分别是 未完成态、完成态(resolve)、失败态(reject) 状态不可逆,完成态不能返回未完成,失败态不能变成完成态
与promise主要的交互方式是在它的then方法中传入回调函数,形成链式调用,
实现
首先 我们来看Promise/A 规范在具体的应用中的调用方式:
我们可以根据promise规范,将上面的例子改为:
var printText = function(name){var deferred = new Deferred(); //new一个托管函数println(name,deferred.callback());//把回调函数托管到Deferred中实现return deferred.promise; //返回promise对象实现链式调用} printText("ztf") .then(function(name){ console.log(name);return printText(name); //第二次调用依赖第一次调用 返回promise对象 在成功态中判断 }) .then(function(res){ console.log(res);//defreturn printText(res); }) .then(function(res1){ console.log(res1);//1});
这样的代码从某种程度上,改变了异步代码不断嵌套的现状,通过then()方法的链式调用,达到异步代码的流程控制。
//处理回调var Promise = function(){this.queue = []; //存储的是回调函数的队列this.isPromise = true; }//延迟对象var Deferred = function(){this.promise = new Promise(); } Deferred.prototype = {//托管了callback回调函数 callback:function(){ },//完成态 resolve:function(){ },//失败态 reject:function(){ } }
这里定义了两个对象 Promise与Deferred, Promise负责处理函数的分发,Deferred顾名思义,处理了延迟对象。
Promise =.queue = []; .isPromise = = handler =((fulfilledHandler) == =((errorHandler) == = Deferred =.promise = =
可以看到Promise.then方法只是将回调插入队列,一个完成态执行,一个失败态执行。
为了完成整个流程,还需要在Deferred中定义完成态和失败态的处理方法:
//处理内部操作var Promise = function(){this.queue = []; //存储的是回调函数的队列this.isPromise = true; } Promise.prototype = {//then方法 fulfilledHandler是完成态时执行的回调函数 errorHandler则是失败态
then:function(fulfilledHandler,errorHandler){ var handler = {}; if(typeof(fulfilledHandler) == "function"){ handler.fulfilled = fulfilledHandler; } if(typeof(errorHandler) == "function"){ handler.errored = errorHandler; } this.queue.push(handler); return this; }
Deferred =.promise = = self = promise =((handler = promise.queue.shift())){ (handler && res = handler.fulfilled.apply(self,args); (res && res.isPromise){ res.queue ==
加入了完成态操作,这段代码获取了.then传入的回调函数集合 promise.queue while依次调用,传入当前的arguments
然后 我们需要将完成态在托管回调函数(Deferred.callback())中,按照逻辑执行:
Promise =.queue = []; .isPromise = = handler =((fulfilledHandler) == =((errorHandler) == = Deferred =.promise = = self = args = Array.prototype.slice.call(arguments); = args.concat(Array.prototype.slice.call(arguments,)); self = promise = args =((handler = promise.queue.shift())){ (handler && res = handler.fulfilled.apply(self,args); (res && res.isPromise){ res.queue ==
代码到这里,主要功能已经完成,只是失败态还没有添加,它的实现方式与成功态类似 只是少了二次嵌套:
//处理内部操作var Promise = function(){this.queue = []; //存储的是回调函数的队列this.isPromise = true; } Promise.prototype = {//then方法 fulfilledHandler是完成态时执行的回调函数 errorHandler则是失败态 then:function(fulfilledHandler,errorHandler){var handler = {};if(typeof(fulfilledHandler) == "function"){ handler.fulfilled = fulfilledHandler; }if(typeof(errorHandler) == "function"){ handler.errored = errorHandler; }this.queue.push(handler);return this; } }//处理外部操作var Deferred = function(){this.promise = new Promise(); } Deferred.prototype = {//托管了callback回调函数 callback:function(){var self = this;var args = Array.prototype.slice.call(arguments); //将arguments转为数组return function(err){if(err){//这里是失败态 传入了error对象 self.reject.call(self,err);return; } args = args.concat(Array.prototype.slice.call(arguments,1)); //合并外部arguments 与内部arguments 去掉err//这里是完成态 console.log(args); self.resolve.apply(self,args); } },//完成态 resolve:function(){var self = this;var promise = self.promise;var args = arguments;var handler; while((handler = promise.queue.shift())){ //取出待执行队列中的第一个函数 直到全部执行完毕if(handler && handler.fulfilled){var res = handler.fulfilled.apply(self,args); //调用失败态回调函数if(res && res.isPromise){ //如果有二次嵌套 则再次执行promiseres.queue = promise.queue; self.promise = res;return; } } } },//失败态 reject:function(err){var self = this;var promise = self.promise;var args = arguments;var handler;while((handler = promise.queue.shift())){ //取出待执行队列中的第一个函数 直到全部执行完毕if(handler && handler.errored){ var res = handler.fulfilled.call(self,err); //调用完成态回调函数 } } } }
总结
要点:
① 每个操作都返回一样的promise对象,保证链式操作
② 函数callback第一个参数总是error对象 无报错则null
③ 每个链式都通过then方法连接 返回promise对象再次执行
以上是基于es6:异步流程控制思想的详细内容。更多信息请关注PHP中文网其他相关文章!

不同JavaScript引擎在解析和执行JavaScript代码时,效果会有所不同,因为每个引擎的实现原理和优化策略各有差异。1.词法分析:将源码转换为词法单元。2.语法分析:生成抽象语法树。3.优化和编译:通过JIT编译器生成机器码。4.执行:运行机器码。V8引擎通过即时编译和隐藏类优化,SpiderMonkey使用类型推断系统,导致在相同代码上的性能表现不同。

JavaScript在现实世界中的应用包括服务器端编程、移动应用开发和物联网控制:1.通过Node.js实现服务器端编程,适用于高并发请求处理。2.通过ReactNative进行移动应用开发,支持跨平台部署。3.通过Johnny-Five库用于物联网设备控制,适用于硬件交互。

我使用您的日常技术工具构建了功能性的多租户SaaS应用程序(一个Edtech应用程序),您可以做同样的事情。 首先,什么是多租户SaaS应用程序? 多租户SaaS应用程序可让您从唱歌中为多个客户提供服务

本文展示了与许可证确保的后端的前端集成,并使用Next.js构建功能性Edtech SaaS应用程序。 前端获取用户权限以控制UI的可见性并确保API要求遵守角色库

JavaScript是现代Web开发的核心语言,因其多样性和灵活性而广泛应用。1)前端开发:通过DOM操作和现代框架(如React、Vue.js、Angular)构建动态网页和单页面应用。2)服务器端开发:Node.js利用非阻塞I/O模型处理高并发和实时应用。3)移动和桌面应用开发:通过ReactNative和Electron实现跨平台开发,提高开发效率。

JavaScript的最新趋势包括TypeScript的崛起、现代框架和库的流行以及WebAssembly的应用。未来前景涵盖更强大的类型系统、服务器端JavaScript的发展、人工智能和机器学习的扩展以及物联网和边缘计算的潜力。

JavaScript是现代Web开发的基石,它的主要功能包括事件驱动编程、动态内容生成和异步编程。1)事件驱动编程允许网页根据用户操作动态变化。2)动态内容生成使得页面内容可以根据条件调整。3)异步编程确保用户界面不被阻塞。JavaScript广泛应用于网页交互、单页面应用和服务器端开发,极大地提升了用户体验和跨平台开发的灵活性。

Python更适合数据科学和机器学习,JavaScript更适合前端和全栈开发。 1.Python以简洁语法和丰富库生态着称,适用于数据分析和Web开发。 2.JavaScript是前端开发核心,Node.js支持服务器端编程,适用于全栈开发。


热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

AI Hentai Generator
免费生成ai无尽的。

热门文章

热工具

WebStorm Mac版
好用的JavaScript开发工具

SublimeText3汉化版
中文版,非常好用

Dreamweaver Mac版
视觉化网页开发工具

mPDF
mPDF是一个PHP库,可以从UTF-8编码的HTML生成PDF文件。原作者Ian Back编写mPDF以从他的网站上“即时”输出PDF文件,并处理不同的语言。与原始脚本如HTML2FPDF相比,它的速度较慢,并且在使用Unicode字体时生成的文件较大,但支持CSS样式等,并进行了大量增强。支持几乎所有语言,包括RTL(阿拉伯语和希伯来语)和CJK(中日韩)。支持嵌套的块级元素(如P、DIV),

Atom编辑器mac版下载
最流行的的开源编辑器