generator的next传参注意点

1. 返回多个结果：
一般一个函数只能返回一个结果，generator可以使得函数返回多个结果。
用法：function*定义，函数中可以用return语句，可以用yield返回多次。

function* foo(x) {
    yield x + 1;
    yield x + 2;
    return x + 3;
}

foo(1) //表示创建了一个generator对象，但是还没有执行，若要执行则如下写

var a=foo(1); //表示创建了一个generator对象并且赋值给了变量a
a.next(); //表示调用执行generator对象。
注意：如果generator函数里返回值有三个，那么调用一次返回第一次结果，调用两次返回第二次结果，调用第三次返回第三次结果，再调用就会是undefined。打印的结果是按照yield语句声明的顺序进行的

返回情况如下：
在这里插入图片描述
{value：2，done：false/true} value是yield返回的值，done表示generator是否已经执行完毕，false表示没有执行完，true表示已经执行完毕。

2. 异步代码执行
书写的时候可以将异步代码变为书写时的“同步样式”的代码。

例子如下：

function* G() {
    const a = yield 100
    console.log('a', a)  // a aaa
    const b = yield 200
    console.log('b', b)  // b bbb
    const c = yield 300
    console.log('c', c)  // c ccc
}
const g = G()
g.next()    // value: 100, done: false
g.next('aaa') // a aaa   value: 200, done: false   
g.next('bbb') //   b bbb  value: 300, done: false
g.next('ccc') //c ccc  value: undefined, done: true

console输出语句为a aaa/b bbb/ c ccc/
原因：第一句g.next()执行了yield100；第二句g.next(‘aaa’)中的参数赋值给了第一个yield前面的变量，即a。然后再输出console.log(‘a’, a) // 此时的a值为 aaa。然后执行了yield200，再赋值给b=bbb。
若没有g.next()；那么输出的语句就不一样了，看下面的实例

const g = G()
g.next('aaa')   //此时的语句执行后的结果为{value: 100, done: false}
g.next('bbb')   //{value: 200, done: false}
g.next('ccc')    //{value: 300, done: false}

那么console的输出结果呢？a bbb / b ccc
原因：第一句为g.next(‘aaa’)，这句之前没有执行yield，所以即使带参数也不会赋值，在g.next(‘bbb’)时，会将bbb赋值给a然后执行console.log(a)；next参数只赋值给已经执行完毕的yield语句左边的变量

generator的next传参注意点

猜你喜欢