ES6-Generator可暂停函数

Generator函数

ES6提供的解决异步编程的方案之一 Generator函数是一个状态机，内部封装了不同状态的数据， 用来生成遍历器对象(指针对象)
可暂停函数(惰性求值函数), 碰到yield暂停，调用next方法再次启动。每次返回的是yield后的表达式结果

特点：
  1、function 与函数名之间有一个星号
  2、内部用yield表达式来定义不同的状态
    例如：
      function* generatorExample(){
        let result = yield 'hello';  // 状态值为hello
        yield 'generator'; // 状态值为generator
      }
  3、generator函数返回的是指针对象(iterator)，而不会执行函数内部逻辑
  4、调用next方法函数内部逻辑开始执行，遇到yield表达式停止，返回{value: yield后的表达式结果/undefined, done: false/true}
  5、再次调用next方法会从上一次停止时的yield处开始，直到下个yield,或者走到最后
  6、yield语句返回结果通常为undefined， 当调用next方法时传参内容会作为启动时yield语句的返回值。

<script>
  function* myGenerator(){
    console.log('开始执行')
    //调用next开始执行函数时 ,如果遇到yield关键字会暂停函数的执行 同时将yield后面的 值或表达式的结果以 指针对象的形式 返回
    let result = yield 'hello'//#1
    console.log('再次执行 , next调用时传入的参数作为上一次暂停时yield的返回值: '+result) //abcd
    yield 'world'// #2
    console.log('执行结束')
    //当函数体的内容执行完毕后, 指针对象的value默认为undefined , 手动指定return可以修改 ,但只有一次,后续的next() 还是返回undefined
    return '最后的结果'//#3
  }

  let mg = myGenerator()
  console.log(mg.next()) //{value: "hello", done: false}//#1
  console.log(mg.next('abcd')) //{value: "world", done: false}#2
  console.log(mg.next()) //{value: 最后的结果, done: true}//#3
  console.log(mg.next()) //{value: undefined, done: true}


</script>

案例

<script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
 /*
    * 需求：
    * 1、发送ajax请求获取新闻内容
    * 2、新闻内容获取成功后再次发送请求，获取对应的新闻评论内容
    * 3、新闻内容获取失败则不需要再次发送请求。
*/ 
function getNews(url){

    $.get(url, function (data) {
      // 调用next传参会作为上次暂停是yield的返回值
      SX.next(data)
    })

  
}
function* sendXml(){
  let newsData = yield getNews('http://localhost:3000/news?id=2') 

  // 当获取新闻内容成功，发送请求获取对应的评论内容
  let url = newsData.commentsUrl;
  let commentsData = yield getNews('http://localhost:3000'+url)

  console.log(commentsData)
}
let SX = sendXml() 
SX.next() 

</script>