The yield*
expression is used to delegate to another generator
or iterable object.
The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
Syntax
yield* expression;
expression
- The expression which returns an iterable object.
Description
The yield*
expression iterates over the operand and yield
s each value returned by it.
The value of yield*
expression itself is the value returned by that iterator when it's closed (i.e., when done
is true
).
Examples
Delegating to another generator
In following code, values yielded by g1()
are returned from next()
calls just like those which are yielded by g2()
.
function* g1() { yield 2; yield 3; yield 4; } function* g2() { yield 1; yield* g1(); yield 5; } const iterator = g2(); console.log(iterator.next()); // {value: 1, done: false} console.log(iterator.next()); // {value: 2, done: false} console.log(iterator.next()); // {value: 3, done: false} console.log(iterator.next()); // {value: 4, done: false} console.log(iterator.next()); // {value: 5, done: false} console.log(iterator.next()); // {value: undefined, done: true}
Other Iterable objects
Besides generator objects, yield*
can also yield
other kinds of iterables (e.g., arrays, strings, or arguments
objects).
function* g3() { yield* [1, 2]; yield* '34'; yield* Array.from(arguments); } const iterator = g3(5, 6); console.log(iterator.next()); // {value: 1, done: false} console.log(iterator.next()); // {value: 2, done: false} console.log(iterator.next()); // {value: "3", done: false} console.log(iterator.next()); // {value: "4", done: false} console.log(iterator.next()); // {value: 5, done: false} console.log(iterator.next()); // {value: 6, done: false} console.log(iterator.next()); // {value: undefined, done: true}
The value of yield*
expression itself
yield*
is an expression, not a statement—so it evaluates to a value.
function* g4() { yield* [1, 2, 3]; return 'foo'; } function* g5() { const g4ReturnValue = yield* g4(); console.log(g4ReturnValue) // 'foo' return g4ReturnValue; } const iterator = g5(); console.log(iterator.next()); // {value: 1, done: false} console.log(iterator.next()); // {value: 2, done: false} console.log(iterator.next()); // {value: 3, done: false} done is false because g5 generator isn't finished, only g4 console.log(iterator.next()); // {value: 'foo', done: true}
Specifications
Specification |
---|
ECMAScript (ECMA-262) The definition of 'Yield' in that specification. |
Browser compatibility
Desktop | Mobile | Server | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|
yield* | Chrome Full support 39 | Edge Full support 12 | Firefox
Full support
27
| IE No support No | Opera Full support 26 | Safari Full support 10 | WebView Android Full support 39 | Chrome Android Full support 39 | Firefox Android
Full support
27
| Opera Android Full support 26 | Safari iOS Full support 10 | Samsung Internet Android Full support 4.0 | nodejs
Full support
4.0.0
|
Legend
- Full support
- Full support
- No support
- No support
- See implementation notes.
- See implementation notes.
- User must explicitly enable this feature.
- User must explicitly enable this feature.