网站建设的报告,中国最大的网站排名,企业邮箱查询,学编程哪个机构好javascript -- 深度解析异步解决方案 高级语言层出不穷, 然而唯 js 鹤立鸡群, 这要说道js的设计理念, js天生为异步而生, 正如布道者朴灵在 node深入浅出--(有兴趣的可以读一下, 很有意思^_^) , 异步很早就存在于操作系统的底层, 意外的是#xff0c;在绝大多数高级编程语言中… javascript -- 深度解析异步解决方案 高级语言层出不穷, 然而唯 js 鹤立鸡群, 这要说道js的设计理念, js天生为异步而生, 正如布道者朴灵在 node深入浅出--(有兴趣的可以读一下, 很有意思^_^) , 异步很早就存在于操作系统的底层, 意外的是在绝大多数高级编程语言中异步并不多见疑似被屏蔽了一搬. 造成这个现象的原因或许令人惊讶, 程序员不太适合通过异步来实现进行程序设计 ^_^.异步的理念是很好的, 然而在程序员编程过程中确实会出现一些问题, 并不是这种理念不容以让人接受, 而是当有大量的异步操作时会让你的代码可读性降低, 其中回调函数异步编程容易产生毁掉陷阱, 即 callback hell--(不要急, 后面会详细讲解) 然而 js 社区从为停止其脚步, 最新的 ES7 所推出的 async/await 终极异步解决方案, 说终极可能有所不严禁, 然而它确实已经完全将原来通过模块侵入式的异步编程解脱出来, 可以让程序员以接近传统意义上的函数调用实现异步编程, 这是 js 里程碑式变革中极其重要的一部分. Javascript异步编程解决方案历史与方法 ES 6以前 回调函数回调函数是最原始的异步编程方案, 上篇文章已经讲述, 这里不再累赘, 这里给出传送门 回调函数之美 然而如果业务逻辑过多时, 回调函数会产生深层嵌套, 对程序员极不友好, 如下代码所示有一个业务逻辑, 需要对a, b, c三个文件一次读取 var fs require(fs);fs.readFile(./a.txt, function(err1, data1) {fs.readFile(./b.txt, function(err2, data2) {fs.writeFile(./ab.txt, data1 data2, function(err) {console.log(read and write done!);});});}); 三个异步函数嵌套看起来挺简单的, 这里知识简单假设, 抛砖引玉, 如果有5个10个甚至更多的异步函数要顺序执行那要嵌套大家都不喜欢身材横着长吧哈哈说实话相当恐怖代码会变得异常难读难调试难维护。这就是所谓的回调地狱或者callback hell。正是为了解决这个问题才有了后面两节要讲的内容用promise或generator进行异步流程管理。异步流程管理说白了就是为了解决回调地狱的问题。所以说任何事情都有两面性异步编程有它独特的优势却也同时遇到了同步编程根本不会有的代码组织难题。 事件监听(事件发布/订阅)事件监听模式是一种广泛应用于异步编程的模式, 是回调函数的事件化,即发布/订阅模式, var util require(util);var events require(events);function Stream() {events.EventEmitter.call(this);}util.inherits(Stream, events.EventEmitter)let got new Stream();got.on(done, function (params) {console.log(params);});got.on(done, function (params) {console.log(QWER);});got.emit(done, diyige);console.log(-----------------);var emitter new events.EventEmitter();emitter.on(done, function (params) {console.log(params);});emitter.on(done, function (params) {console.log(ZXCV);});emitter.emit(done, dierge);// diyige// QWER// dierge// ZXCV Promise对象Promise 是异步编程的一种解决方案它是比传统的解决方案——回调函数和事件——更合理和更强大, 它的目的是替换以前回调函数的比不编程方案, 也是后续介绍的异步解决方案的基础, 它由社区最早提出和实现ES6 将其写进了语言标准统一了用法原生提供了Promise对象, 现在的 js库几乎都支持这种异步方案 promise对象有以下特点 对象的状态不受外界影响。Promise对象代表一个异步操作有三种状态pending进行中、fulfilled已成功和rejected已失败。只有异步操作的结果可以决定当前是哪一种状态任何其他操作都无法改变这个状态。这也是Promise这个名字的由来它的英语意思就是“承诺”表示其他手段无法改变一旦状态改变就不会再变任何时候都可以得到这个结果。Promise对象的状态改变只有两种可能从pending变为fulfilled和从pending变为rejected。只要这两种情况发生状态就凝固了不会再变了会一直保持这个结果这时就称为 resolved已定型。如果改变已经发生了你再对Promise对象添加回调函数也会立即得到这个结果。这与事件Event完全不同事件的特点是如果你错过了它再去监听是得不到结果的。 下面为单个promise对象应用方法 var promise new Promise(function(resolve,reject){// ... some codeif(/* 异步操作成功 */){resolve(value);}else{reject(error);}}); 通常用promise 的时候我们一般把它相应的业务包装起来下图所示模拟了一个读取文件的异步 promise 函数, var readFile function (params) {return new Promise(function(resolve, reject){setTimeout(function(){resolve(params);}, 2000);});}readFile(file1).then(function (data) {console.log(data);return readFile(file2)}).then(function (data) {console.log(data);return readFile(file3)}).then(function (data) {console.log(data);return readFile(file4)}).then(function (data) {console.log(data);return readFile(file5)}).then(function (data) {console.log(data);})//file1//file2//file3//file4//file5 流程控制库还有一种需要手工调用采能够处理后续任务的, 在这里只简单介绍一种, 我们称之为尾触发, 常用的关键字为 next , 为什么要讲到它是因为它是 node 神级框架 express中采用的模式, 这里可能要涉及一些后端node的内容在 node 搭建服务器时需要面向 切面编程 ,这就需要各种各样的中间件 var app connect();// Middlewareapp.use(connect.staticCache());app.use(connect.static(__dirname /public));app.use(connect.cookieParser());app.use(connect.session());app.use(connect.query());app.use(connect.bodyParser());app.use(connect.csrf());app.listen(3001); 在通过 use() 方法监听好一系列中间件后, 监听端口上的请求, 中间件采用的是尾触发的机制, 下面是个一个简单的中间件 function (req, res, next) {// express中间件} 每个中间件传递请求对象, 响应对象, 和尾触发函数, 通过队列形成一个处理流, 如下图中间件机制使得在处理网络请求时, 可以像面向切面编程一样进行过滤, 验证, 日志等功能. ES 6 Generator函数(协程coroutine)Generator 函数有多种理解角度。语法上Generator 函数是一个状态机封装了多个内部状态。执行 Generator 函数会返回一个遍历器对象也就是说Generator 函数除了状态机还是一个遍历器对象生成函数。执行函数后返回的是一个遍历器对象可以依次遍历 Generator 函数内部的每一个状态。 function* helloWorldGenerator() {yield hello;yield world;return ending;}var hw helloWorldGenerator();hw.next()// { value: hello, done: false }hw.next()// { value: world, done: false }hw.next()// { value: ending, done: true }hw.next()// { value: undefined, done: true } 下一步必须调用遍历器对象的next方法使得指针移向下一个状态。也就是说每次调用next方法内部指针就从函数头部或上一次停下来的地方开始执行直到遇到下一个yield表达式或return语句为止。换言之Generator 函数是分段执行的yield表达式是暂停执行的标记而next方法可以恢复执行。 基于 Promise 对象的自动执行generater/yield函数还无法真正解决异步方案的问题, 需要配合额外的执行模块 如 TJ Holowaychuk 的 co 模块, 在这里用promise模块进行generater函数的自动执行; var fs require(fs);var readFile function (fileName){return new Promise(function (resolve, reject){fs.readFile(fileName, function(error, data){if (error) return reject(error);resolve(data);});});};var gen function* (){var f1 yield readFile(/etc/fstab);var f2 yield readFile(/etc/shells);console.log(f1.toString());console.log(f2.toString());};
/*****************************************var g gen();g.next().value.then(function(data){g.next(data).value.then(function(data){g.next(data);});});
*****************************************/// 自动执行函数 function run(gen){var g gen();function next(data){var result g.next(data);if (result.done) return result.value;result.value.then(function(data){next(data);});}next();}run(gen); ES 7: async/await终于来到了我们梦寐以求的的终极异步解决方案, 或许你有些失望, 当然这种失望是async/await 仅仅是语法糖, async/await 就是 generater/yield/promise 自动执行模块的封装.相对于前辈 async 函数可以自动执行 并且 await 关键字后面则只能带promise队形--这里注意 await 后面支持其他数据类型, 但是底层也会将其转化为promise对象 async函数对 Generator 函数的改进体现在以下四点。 内置执行器。 Generator 函数的执行必须靠执行器所以才有了co模块而async函数自带执行器,这完全不像 Generator 函数需要调用next方法或者用co模块才能真正执行得到最后结果。更好的语义。 async和await比起星号和yield语义更清楚了。async表示函数里有异步操作await表示紧跟在后面的表达式需要等待结果。更广的适用性。 co模块约定yield命令后面只能是 Thunk 函数或 Promise 对象而async函数的await命令后面可以是 Promise 对象和原始类型的值数值、字符串和布尔值但这时等同于同步操作 返回值是 Promise。 async函数的返回值是 Promise 对象这比 Generator 函数的返回值是 Iterator 对象方便多了。你可以用then方法指定下一步的操作。进一步说async函数完全可以看作多个异步操作包装成的一个 Promise 对象而await命令就是内部then命令的语法糖。 function name(params) {return new Promise(function (resolve, reject) {setTimeout(() {resolve(params)}, 3000);});}async function myf () {let gf await name(xiaohua);let gf2 await name(xiaohong);return gf gf2 }async function myf3 (params) {let aaa await myf();return aaa;}myf3().then(function (params) {console.log(params);});// xiaohuaxiaohong async/await 对前者的generater/yield 进行了高度的封装配合那些支持 promise 实现的库可以完美的像普通函数一样调用, 并且async函数与其他async函数也可以完美无缝连接, 堪称终极方案koa2已经支持 async/await 但是最新的 express框架依然没有支持这种写法, async/await 是大势所趋, 或许不久的将来 express也会支持它, 我们拭目以待
