https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise

http://www.ruanyifeng.com/blog/2015/04/generator.html

https://blog.oyanglul.us/javascript/functional-javascript.html#sec-2-2

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/async_function

http://es6.ruanyifeng.com/#docs/async

  普通函数嵌套,多层异步嵌套,加上错误处理,代码很乱,不好看。

  然后迎来了Promise和generator,promise中执行异步逻辑,然后执行reject或者resolve来改变promise的状态,接着promise外通过then或catch注册的回调函数就会执行,相比普通的函数嵌套,这里就相当于把结果处理的函数放到了外面,从而减少了嵌套的层数。回调函数中也可以返回promise,这样外面then返回的promise的状态就会跟随里面的promise,也就是说里面的promise的处理也可以放到最外面去,也可以减少嵌套的层数,看上去就很像同步函数了。

  接着generator也可以配合promise来使用,它可以实现一些类似于状态机的效果,generator内部yield多个值,外部通过next来控制内部代码段的执行。用它还可以实现一些无限长的序列。除此之外它还有一些比较灵活的自动执行方面的技巧(co库),涉及到函数式编程、柯里化之类的概念。

  最后,终极的解决方案就是ES7里面的async函数。是generator的升级版,generator需要调用next,代码才会往下执行,但async函数自带执行器,内部的代码会自动往下执行,很方便。自动执行的原理:http://es6.ruanyifeng.com/#docs/async#async-函数的实现原理

  大概就是,把await全部变成yield,然后获取generator,执行一个函数如step,里面调用一次next,获取到第一个值,通过Promise.resolve转为一个promise,然后再上面用then注册回调方法,回调方法里继续调用step。递归调用

  

事件绑定和异步的对比

$btn.on('click', function (e) {
console.log('你点击了按钮')
})
fs.readFile('data1.json', function (err, data) {
// 获取数据
})

两者都是运行在事件循环中,但是回调函数的调用源不一样,异步的调用源是系统,而事件绑定须要通过用户去触发

自己实现一个Promise:https://github.com/geekinpink/GPromise

js 异步编程方案的更多相关文章

  1. JS魔法堂:深究JS异步编程模型

    前言  上周5在公司作了关于JS异步编程模型的技术分享,可能是内容太干的缘故吧,最后从大家的表情看出"这条粉肠到底在说啥?"的结果:(下面是PPT的讲义,具体的PPT和示例代码在h ...

  2. js异步编程

    前言 以一个煮饭的例子开始,例如有三件事,A是买菜.B是买肉.C是洗米,最终的结果是为了煮一餐饭.为了最后一餐饭,可以三件事一起做,也可以轮流做,也可能C需要最后做(等A.B做完),这三件事是相关的, ...

  3. 深究JS异步编程模型

    前言  上周5在公司作了关于JS异步编程模型的技术分享,可能是内容太干的缘故吧,最后从大家的表情看出"这条粉肠到底在说啥?"的结果:(下面是PPT的讲义,具体的PPT和示例代码在h ...

  4. node.js异步编程的几种模式

    Node.js异步编程的几种模式 以读取文件为例: 1.callback function const fs = require('fs'); //callback function fs.readF ...

  5. 前端分享----JS异步编程+ES6箭头函数

    前端分享----JS异步编程+ES6箭头函数 ##概述Javascript语言的执行环境是"单线程"(single thread).所谓"单线程",就是指一次只 ...

  6. JS异步编程 (2) - Promise、Generator、async/await

    JS异步编程 (2) - Promise.Generator.async/await 上篇文章我们讲了下JS异步编程的相关知识,比如什么是异步,为什么要使用异步编程以及在浏览器中JS如何实现异步的.最 ...

  7. JS异步编程 (1)

    JS异步编程 (1) 1.1 什么叫异步 异步(async)是相对于同步(sync)而言的,很好理解. 同步就是一件事一件事的执行.只有前一个任务执行完毕,才能执行后一个任务.而异步比如: setTi ...

  8. node.js异步编程解决方案之Promise用法

    node.js异步编程解决方案之Promise var dbBase = require('../db/db_base'); var school_info_db = require('../db/s ...

  9. 一个例子读懂 JS 异步编程: Callback / Promise / Generator / Async

    JS异步编程实践理解 回顾JS异步编程方法的发展,主要有以下几种方式: Callback Promise Generator Async 需求 显示购物车商品列表的页面,用户可以勾选想要删除商品(单选 ...

随机推荐

  1. bzoj 3667: Rabin-Miller算法【Miller-Rabin】

    Miller-Rabin模板 #include<iostream> #include<cstdio> #include<algorithm> using names ...

  2. UVA1328 Period【KMP/周期串/循环节】By cellur925

    鲜有的在luogu发题解以及使用LaTex??? 就丢链接跑了.

  3. SpringMVC + ajax

    1.ajax 返回汉字乱码 解决方法: http://blog.sina.com.cn/s/blog_5f39177b0101it7h.html //方案一 response.setCharacter ...

  4. c 浮点科学计数法

    浮点数 比喻1e1 e后面跟的是10的指数(也就是1的10次方,e表示10次方),f表示浮点数 1e1表示1×10¹,其实就是10 再例如5e2f,表示5×10²,也就是500 =========== ...

  5. bzoj 4542 [Hnoi2016]大数 (坑)

    题面 https://www.lydsy.com/JudgeOnline/problem.php?id=4542 题解 Code #include<bits/stdc++.h> using ...

  6. 525 Contiguous Array 连续数组

    给定一个二进制数组, 找到含有相同数量的 0 和 1 的最长连续子数组.示例 1:输入: [0,1]输出: 2说明: [0, 1] 是具有相同数量0和1的最长连续子数组. 示例 2:输入: [0,1, ...

  7. cmd命令下执行jar包程序

     在cmd中使用指令来执行jar包 概述: 今天有一个需求,要在cmd中执行.jar文件 实践: 1.新建你的Hello world 2.导出到jar包 3.打开你的成功导出的jar包 4.打开文件夹 ...

  8. c#很好用的定时器Quartz--含附件

    1.引用附件中的两个DLL 2.创建类 public class QuartzJob:IStatefulJob { private static ISchedulerFactory factory = ...

  9. mvc报( 检测到有潜在危险的 request.form 值 )错的解决方案

    今天在做项目中遇到了报( 检测到有潜在危险的 request.form 值 )错,百度过后解决了该问题,出此问题主要还是因为提交的Form中有HTML字符串,例如你在TextBox中输入了html标签 ...

  10. java实现汉诺塔算法

    package com.ywx.count; import java.util.Scanner; /** * @author Vashon * date:20150410 * * 题目:汉诺塔算法(本 ...