ES6—Generator
什么是Generator
Generator 主要是异步编程,用来封装一个异步任务,是一个异步任务的容器。
特点:交出普通函数的执行权(可以让函数在调用的时候按照我们的需要执行或者是暂停)
普通函数:在调用的时候函数中的内容会全部执行,如下面的普通。
<script>
function fun(){
console.log(1)
console.log(2)
console.log(3)
}
fun()
</script>
es6 Generator
1、特点:generator函数 可以让函数体内的内容随着我们的需要走走停停
2、语法:在声明函数的function=关键字和函数名之间有一个*号(用于区别普通函数),yield(是异步不同阶段的分割线)在generator函数体内进行使用,可以定义不同的内部状态。
3、调用:将generator函数赋值给一个变量,用这个变量.next()进行调用。
普通函数调用,在函数名后面加上一对圆括号,不同的是,调用Generator函数后,该函数并不执行,返回的也不是函数运行的结果,而是一个指向内部状态的指针对象;
下一步,必须调用遍历器对象的next方法,使得指向移向下一个状态,也就是说每次调用next方法,内部指针就从函数头部或上一次停下来的地方开始执行,直到遇到下一个yield表达式(或return语句)为止。
也就是说,Generator函数是分段执行的,yield表达式是暂时执行的标记,而next方法可以恢复执行。
<script>
function *fun(){
console.log(1)
yield
console.log(2)
yield
console.log(3)
}
let demo=fun()
demo.next()//1
demo.next()//2
demo.next()//3
</script>
es6 Generator传参
因为Generator函数返回的遍历器对象,只有调用next方法才会遍历下一个内部状态,所以其实提供了一种可以暂停执行的函数,yield表达式就是暂停标志。
遍历器对象的next方法的运行逻辑如下:
(1)遇到yield表达式,是暂停执行后面的操作,并将紧跟在yield后面的那个表达式的值,作为返回的对象的value属性值;
(2)下一次调用next方法时,再继续往下执行,直到遇到下一个yield表达式;
(3)如果没有遇到新的yield表达式,就一直运行到函数结束,直到return语句为止,并将return语句后面的表达式的值,作为返回的对象的value属性值;
(4)如果该函数没有return语句,则返回的对象的value属性值为undefined;
yield表达式只能用在 Generator 函数里面,用在其他地方都会报错。
next方法的参数
yield表达式本身没有返回值,或者说返回值为undefined,next方法可以带一个参数,该参数会被当做下一个yield表达式的返回值。
<script>
function *fun(){
console.log(1)
let a=yield
console.log(a)
let b=yield
console.log(b)
}
let demo=fun()
demo.next()//1
demo.next("222")//222
demo.next("333")//333
</script>