提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档
文章目录
- 前言
- 一、promise使用及实现、async,await、generator函数的概念
- 二、使用
-
- 1.Promise
- 2.async,await
- generator函数
- 总结
前言
这节课给大家介绍一下promise使用及实现、async,await、generator函数（详解）,具体见下文
提示：以下是本篇文章正文内容，下面案例可供参考
一、promise使用及实现、async,await、generator函数的概念
Promise概念：
promise（首字母小写）对象指的是“Promise实例对象”
Promise首字母大写且单数形式，表示“Promise构造函数”
Promises首字母大写且复数形式，用于指代“Promises规范”
Promise，简单说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果。
从语法上说，promise 是一个对象，从它可以获取异步操作的的最终状态（成功或失败）。
Promise是一个构造函数，对外提供统一的 API，自己身上有all、reject、resolve等方法，原型上有then、catch等方法。
async,await概念：
async+await是es7提出来的概念，它也是为了解决回调地狱的问题，它只是一种语法糖，从本质上讲，await函数仍然是promise，
值得注意的是，async和await必须要一起使用。
用法：首先在 function 前面加 async 用来说明这个函数是一个异步函数
generator函数的概念：
Generator函数是ES6提供的一种异步编程解决方案，语法行为与传统函数完全不同。
Generator函数有多种理解角度。从语法上，首先可以把它理解成，Generator函数一个状态机，封装了多个内部状态。
执行Generator函数会返回一个遍历器对象，也就是说，Generator函数除了状态机，还是一个遍历器对象生成函数。
形式上，Generator函数是一个普通函数，但是有两个特征。一是，function关键字与函数名之间有一个星号，二是，函数体内部使用yield语句，定义不同的内部状态。(yield语句在英语里的意思就是“产出”)
二、使用
1.Promise
怎么回答mromise问题或者从哪几个方面回答？0.promise写法上的体现
1.什么是promise
2.解决地狱回调
3.可以链式调用
4.有三种状态。
5.promise有哪些API.
6.应用场景：封装ajax,axios的get,post封装，微信小程序中封装wx.request()，uniapp开发中uni.request()
1.写法上=====================================================
promise（首字母小写）对象指的是“Promise实例对象”Promise首字母大写且单数形式，表示“Promise构造函数”Promises首字母大写且复数形式，用于指代“Promises规范”
2.是什么？=====================================================
Promise，简单说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果。
从语法上说，promise 是一个对象，从它可以获取异步操作的的最终状态（成功或失败）。
Promise是一个构造函数，对外提供统一的 API，自己身上有all、reject、resolve等方法，原型上有then、catch等方法。
3.**不讲武德了啊，在这么写，我就去世了,简单说说吧**。。。。。。。。。。
4.特点1）pending 初始状态2）fulfilled 成功状态3）rejected 失败状态
5.api=====================================================
then()方法then 方法就是把原来的回调写法分离出来，在异步操作执行完后，用链式调用的方式执行回调函数。而 Promise 的优势就在于这个链式调用。我们可以在 then 方法中继续写 Promise 对象并返回，然后继续调用 then 来进行回调操作。可有两个参数，第一个是成功 resolve 调用的方法，第二个是失败 reject 调用的方法
reject()方法：上面样例我们通过 resolve 方法把 Promise 的状态置为完成态（Resolved），这时 then 方法就能捕捉到变化，并执行“成功”情况的回调。
而 reject 方法就是把 Promise 的状态置为已失败（Rejected），这时 then 方法执行“失败”情况的回调（then 方法的第二参数）
catch()方法：它可以和 then 的第二个参数一样，用来指定 reject 的回调
它的另一个作用是，当执行 resolve 的回调（也就是上面 then 中的第一个参数）时，如果抛出异常了（代码出错了），那么也不会报错卡死 js，而是会进到这个 catch 方法中。
all()方法：Promise 的 all 方法提供了并行执行异步操作的能力，并且在所有异步操作执行完后才执行回调。比如下面代码，两个个异步操作是并行执行的，等到它们都执行完后才会进到 then 里面。同时 all 会把所有异步操作的结果放进一个数组中传给 then。
race()方法：
race 按字面解释，就是赛跑的意思。race 的用法与 all 一样，只不过 all 是等所有异步操作都执行完毕后才执行 then 回调。而 race 的话只要有一个异步操作执行完毕，就立刻执行 then 回调。注意：其它没有执行完毕的异步操作仍然会继续执行，而不是停止。
6.应用场景=====================================================
传统回调模式
promise模式
Promise 写法2.async,await
代码如下（示例）：速记吧，嘻嘻================================================
async/await:异步等待（优化promise）
async函数返回一个promise对象
1.async放函数前
2.调用方法和普通函数一样
3.阻塞式（async await会阻止代码往下执行）
//我们来详细说明一下async/await的作用。await操作符后面可以是任意值，当是Promise对象的时候，会暂停async function执行。也就是说，必须得等待await后面的Promise处理完成才能继续：function testAsy(x){
return new Promise(resolve=>{
setTimeout(() => {
resolve(x);}, 3000)})
}
async function testAwt(){
let result = await testAsy('hello world');console.log(result); // 3秒钟之后出现hello world
}
testAwt();
//阻塞式理解
function testAsy(x){
return new Promise(resolve=>{
setTimeout(() => {
resolve(x);}, 3000)})
}
async function testAwt(){
let result = await testAsy('hello world');console.log(result); // 3秒钟之后出现hello worldconsole.log('tangj') // 3秒钟之后出现tangj
}
testAwt();
console.log('tangSir') //立即输出tangSir
generator函数
fGenerator 函数组成
Generator 有两个区分于普通函数的部分：
一是在 function 后面，函数名之前有个 * ；
函数内部有 yield 表达式。
其中 * 用来表示函数为 Generator 函数，yield 用来定义函数内部的状态。
function* func(){
console.log("one");yield '1';console.log("two");yield '2'; console.log("three");return '3';
}
执行机制
调用 Generator 函数和调用普通函数一样，在函数名后面加上()即可，但是 Generator 函数不会像普通函数一样立即执行，而是返回一个指向内部状态对象的指针，所以要调用遍历器对象Iterator 的 next 方法，指针就会从函数头部或者上一次停下来的地方开始执行。
f.next();
// one
// {value: "1", done: false}f.next();
// two
// {value: "2", done: false}f.next();
// three
// {value: "3", done: true}f.next();
// {value: undefined, done: true}
第一次调用 next 方法时，从 Generator 函数的头部开始执行，先是打印了 one ,执行到 yield 就停下来，并将yield 后边表达式的值 ‘1’，作为返回对象的 value 属性值，此时函数还没有执行完， 返回对象的 done 属性值是 false。
第二次调用 next 方法时，同上步 。
第三次调用 next 方法时，先是打印了 three ，然后执行了函数的返回操作，并将 return 后面的表达式的值，作为返回对象的 value 属性值，此时函数已经结束，多以 done 属性值为true 。
第四次调用 next 方法时， 此时函数已经执行完了，所以返回 value 属性值是 undefined ，done 属性值是 true 。如果执行第三步时，没有 return 语句的话，就直接返回 {value: undefined, done: true}。
函数返回的遍历器对象的方法
next 方法
一般情况下，next 方法不传入参数的时候，yield 表达式的返回值是 undefined 。当 next 传入参数的时候，该参数会作为上一步yield的返回值。
function* sendParameter(){
console.log("start");var x = yield '2';console.log("one:" + x);var y = yield '3';console.log("two:" + y);console.log("total:" + (x + y));
}
next不传参
var sendp1 = sendParameter();
sendp1.next();
// start
// {value: "2", done: false}
sendp1.next();
// one:undefined
// {value: "3", done: false}
sendp1.next();
// two:undefined
// total:NaN
// {value: undefined, done: true}
next传参
var sendp2 = sendParameter();
sendp2.next(10);
// start
// {value: "2", done: false}
sendp2.next(20);
// one:20
// {value: "3", done: false}
sendp2.next(30);
// two:30
// total:50
// {value: undefined, done: true}
除了使用 next ，还可以使用 for… of 循环遍历 Generator 函数生产的 Iterator 对象。
return 方法
return 方法返回给定值，并结束遍历 Generator 函数。
return 方法提供参数时，返回该参数；不提供参数时，返回 undefined 。
yield* 表达式
yield* 表达式表示 yield 返回一个遍历器对象，用于在 Generator 函数内部，调用另一个 Generator 函数。
Reflect.ownKeys() 返回对象所有的属性，不管属性是否可枚举，包括 Symbol。
jane 原生是不具备 Iterator 接口无法通过 for… of遍历。这边用了 Generator 函数加上了 Iterator 接口，所以就可以遍历 jane 对象了。