详谈Generator

Generator究竟有什么样的做用呢????

• 他是ES6提出的一个解决异步问题方案

  先看一段代码, 感觉一下generator函数和普通函数的区别

function* test(){
        yield 2;
        yield 3;
        yield 5;
    }
    var app = test()            // 此时代码不会执行
    var a = app.next()          // 这个时候代码才开始真正开始执行 
    console.log(a)              // {value:2,done:false}
    var b = app.next()          // 继续执行
    console.log(b)              // {value:3,done:false}
    var b = app.next()          // 最后一步
    console.log(b)              // {value:5,done:true}

从上面的代码能够看出来,generator可让函数在写的时候中止运行,就比如咱们在打断点的时候,那么我就在想,若是我写异步函数是否是也可让他中止呢,激动的我赶忙试了一下

function* getTime(){
    //这里我就用axios打个比方,就不写一段promise了,你们理解这里能够放一个promise就行
    yield axios.get('xxxxx')
}
var app = getTime()
app.next()     //  {value,done}  这里面的value就是返回的axios数据

• 总结一下,那么generator就是针对异步的一种解决方法
• 既然了解了他的用处,那么咱们就来好好学习一下如何去使用他

使用Promise

• Promise的书写规范是什么

// 在写函数的时候必须用一个*  
function* add(){}
function *add(){}
// 那么在es6以后函数能够写成
get(){
    ...
}
//因此还有另一种写法
*get(){
    
}

• Promise如何使用

  这时候须要了解一个关键字 yield 这个关键字必须在generator函数内,就比如await必须用在async内部同样

var app = test()  //test是一个generator函数
app.next()        //会把程序中的yield后面的值拿出来,而且吧yield后面的数据传递给返回的对象的value中
//例如
function *test(){
    yield 2
}
test().next()     //test()自己不会执行,当调用next的时候才会执行,就是返回一个对象 {value:2,done:true}
//再理解一下,yield后面的值赋给了value,done是指generator函数后面还存在return或者yield等程序,就是后面时候还有代码段

• 那么咱们会写generator函数了,而且也会调用了
• 若是还能传递参数了,那么咱们这个函数岂不是用起来很完美么

function* test(){
    console.log('程序开始了')
    console.log(`1.${yield}`)  //这里面咱们使用es6的字符串插值方式
    console.log(`2.${yield}`)  //这里面咱们调用
}
var app = test()                //这个时候只是让app变成一个指向generator函数的指针,并不会打印出值来
app.next()                     
app.next('第一步')             
app.next('第二步')             
//接下来就是打印的结果了
程序开始执行了
1.第一步
2.第二步

• 分享不易,感谢star