yield*

**yield*** 运算符用于委托给另一个 可迭代 对象，例如 Generator。

试一试

语法

js
yield* expression

参数

expression 可选

一个可迭代对象。

返回值

当迭代器关闭时（当 done 为 true 时），返回该迭代器返回的值。

描述

yield* 表达式迭代操作数并生成它返回的每个值。它将当前生成器的迭代委托给底层迭代器——我们分别将其称为“生成器”和“迭代器”。yield* 首先通过调用后者的 [Symbol.iterator]() 方法从操作数获取迭代器。然后，每次调用生成器的 next() 方法时，yield* 都会调用迭代器的 next() 方法，并将生成器的 next() 方法接收到的参数传递给它（对于第一次调用，始终为 undefined），并生成与迭代器的 next() 方法返回的结果对象相同的结果对象。如果迭代器结果具有 done: true，则 yield* 表达式停止执行并返回该结果的 value。

yield* 运算符也将当前生成器的 throw() 和 return() 方法转发到底层迭代器。如果当前生成器通过其中一种方法过早关闭，则会通知底层迭代器。如果调用生成器的 throw()/return() 方法，则使用相同的参数调用底层迭代器的 throw()/return() 方法。throw()/return() 的返回值像 next() 方法的结果一样处理，如果该方法抛出异常，则异常将从 yield* 表达式传播。

如果底层迭代器没有 return() 方法，则 yield* 表达式将变成 return 语句，就像调用挂起的 yield 表达式的 return() 一样。

如果底层迭代器没有 throw() 方法，这会导致 yield* 抛出一个 TypeError——但在抛出错误之前，如果存在，则会调用底层迭代器的 return() 方法。

示例

委托给另一个生成器

在以下代码中，g1() 生成的值像 g2() 生成的值一样从 next() 调用中返回。

js
function* g1() {
  yield 2;
  yield 3;
  yield 4;
}

function* g2() {
  yield 1;
  yield* g1();
  yield 5;
}

const gen = g2();

console.log(gen.next()); // {value: 1, done: false}
console.log(gen.next()); // {value: 2, done: false}
console.log(gen.next()); // {value: 3, done: false}
console.log(gen.next()); // {value: 4, done: false}
console.log(gen.next()); // {value: 5, done: false}
console.log(gen.next()); // {value: undefined, done: true}

其他可迭代对象

除了生成器对象之外，yield* 还可以生成其他类型的可迭代对象（例如，数组、字符串或 arguments 对象）。

js
function* g3(...args) {
  yield* [1, 2];
  yield* "34";
  yield* args;
}

const gen = g3(5, 6);

console.log(gen.next()); // {value: 1, done: false}
console.log(gen.next()); // {value: 2, done: false}
console.log(gen.next()); // {value: "3", done: false}
console.log(gen.next()); // {value: "4", done: false}
console.log(gen.next()); // {value: 5, done: false}
console.log(gen.next()); // {value: 6, done: false}
console.log(gen.next()); // {value: undefined, done: true}

yield* 表达式本身的值

yield* 是一个表达式，而不是一个语句，因此它会计算出一个值。

js
function* g4() {
  yield* [1, 2, 3];
  return "foo";
}

function* g5() {
  const g4ReturnValue = yield* g4();
  console.log(g4ReturnValue); // 'foo'
  return g4ReturnValue;
}

const gen = g5();

console.log(gen.next()); // {value: 1, done: false}
console.log(gen.next()); // {value: 2, done: false}
console.log(gen.next()); // {value: 3, done: false} done is false because g5 generator isn't finished, only g4
console.log(gen.next()); // {value: 'foo', done: true}

方法转发

当前生成器的 next()、throw() 和 return() 方法都转发到底层迭代器。

js
const iterable = {
  [Symbol.iterator]() {
    let count = 0;
    return {
      next(v) {
        console.log("next called with", v);
        count++;
        return { value: count, done: false };
      },
      return(v) {
        console.log("return called with", v);
        return { value: "iterable return value", done: true };
      },
      throw(v) {
        console.log("throw called with", v);
        return { value: "iterable thrown value", done: true };
      },
    };
  },
};

function* gf() {
  yield* iterable;
  return "gf return value";
}

const gen = gf();
console.log(gen.next(10));
// next called with undefined; the argument of the first next() call is always ignored
// { value: 1, done: false }
console.log(gen.next(20));
// next called with 20
// { value: 2, done: false }
console.log(gen.return(30));
// return called with 30
// { value: 'iterable return value', done: true }
console.log(gen.next(40));
// { value: undefined, done: true }; gen is already closed

const gen2 = gf();
console.log(gen2.next(10));
// next called with undefined
// { value: 1, done: false }
console.log(gen2.throw(50));
// throw called with 50
// { value: 'gf return value', done: true }
console.log(gen.next(60));
// { value: undefined, done: true }; gen is already closed

如果底层迭代器的 return()/throw() 方法返回 done: false，则当前生成器继续执行，并且 yield* 继续委托到底层迭代器。

js
const iterable = {
  [Symbol.iterator]() {
    let count = 0;
    return {
      next(v) {
        console.log("next called with", v);
        count++;
        return { value: count, done: false };
      },
      return(v) {
        console.log("return called with", v);
        return { value: "iterable return value", done: false };
      },
    };
  },
};

function* gf() {
  yield* iterable;
  return "gf return value";
}

const gen = gf();
console.log(gen.next(10));
// next called with undefined
// { value: 1, done: false }
console.log(gen.return(20));
// return called with 20
// { value: 'iterable return value', done: false }
console.log(gen.next(30));
// { value: 2, done: false }; gen is not closed

如果底层迭代器没有 throw() 方法并且调用了生成器的 throw()，则 yield* 会抛出错误。

js
const iterable = {
  [Symbol.iterator]() {
    let count = 0;
    return {
      next(v) {
        count++;
        return { value: count, done: false };
      },
    };
  },
};

function* gf() {
  yield* iterable;
  return "gf return value";
}

const gen = gf();
gen.next(); // First next() starts the yield* expression
gen.throw(20); // TypeError: The iterator does not provide a 'throw' method.

规范

规范
ECMAScript 语言规范
# sec-generator-function-definitions-runtime-semantics-evaluation

浏览器兼容性

BCD 表仅在启用 JavaScript 的浏览器中加载。

另请参阅