yield需要配合Generator使用。
我总结了一下,一共两个特性。
- 直接调用Generator函数时不会执行任何操作需要配合
next()
使用 - 在Generator函数中会分段执行。
一个简单的小栗子,解释的明明白白。
let go = function* (x) {
console.log('1', x);
let a = yield x;
console.log('3', x);
console.log('4', a);
let b = yield (x + 1) + a;
return a + b;
}
go(10);
let g = go(10);
console.log(g.next());
console.log(g.next(100));
console.log(g.next(1000));
打印输出为
image.png运行顺序:
-
go(10)
没有执行任何操作 -
console.log(g.next());
执行了
console.log('1', x);
let a = yield x;
并且在let a = yield x;
处暂停住,并且返回yield后面的值x
,并放入返回对象的value
中。
yield
会返回一个对象{value:1,done:false}
value
表示yield
后面的值,done
表示是否已经完成了Generator函数。
x
由go(10)
传入了10
所以打印出来前两部是 10
和 {value:10,done:false}
-
console.log(g.next(100));
继续执行
let a = yield x;
console.log('3', x);
console.log('4', a);
let b = yield (x + 1) + a;
从let a = yield x;
处继续向下执行,a = yield x
的值从g.next(100)
传入100
,因此a=100
。
x
值不变依然为10
。
打印 3 10
和4 100
执行到 let b = yield (x + 1) + a;
,准确的说应该是yield (x + 1) + a
。
返回{value: 111, done: false}
-
console.log(g.next(1000));
执行最后一个yield
。
b
等于g.next(1000)
传入的1000
Generator函数返回a+b
等于1100
所以答应{value: 1100, done: true}
仔细看完,yield基础用法没问题了。
网友评论