Yield 表达式隐含地导致 TS 中的“任何”类型

Yield 表达式在 TS 中隐式地产生一个 ‘any’ 类型

Yield expression implicitly results in an ‘any’ type in TS

要解决错误“’Yield’ expression implicitly results in an ‘any’ type”，请使用泛型显式键入生成器函数Generator。

yield 表达式隐式具有任何类型

下面是错误如何发生的示例。

索引.ts


function* generator() {
  // ⛔️ Error: 'yield' expression implicitly results in an 'any' type
  // because its containing generator lacks a return-type annotation.ts(7057)
    // 👇️ const result: any
  const result = yield 'bobby';

  yield 'hadz';
  yield 'com';
}

发生错误是因为 TypeScript 无法推断变量的类型
result，因为我们没有显式设置生成器函数的返回类型。

变量result被隐式类型化为any，这导致了错误。

关闭类型检查以消除错误

解决该错误的一种快速方法是将生成器函数的返回类型设置为any.

索引.ts


function* generator(): any {
  const result = yield 'bobby';

  yield 'hadz';
  yield 'com';
}

现在该result变量被显式键入为any，因此我们不再收到错误。但是，这可能不是您想要的，因为any关闭了类型检查。

提供返回类型注解

另一种方法是为生成器提供返回类型注释。

索引.ts


function* generator(): Generator<string, number, string> {
  // 👇️ const result: string;
  const result = yield 'bobby';

  yield 'hadz';
  yield 'com';

  return 10000;
}

Generator
我们传递给泛型的第一个类型是我们想要的类型
yield。

我们在示例生成器中生成 stringsbobby和hadz。com

泛型采用的第二种类型Generator是生成器函数的返回类型。

第三种类型是由 yield 表达式赋值的类型。

所以Generator泛型采用以下形式：
Generator<YieldType, ReturnType, AssignmentType>。

在示例中，我们将的结果分配yield 'bobby'给一个变量，因此我们将 astring作为第三种类型提供给泛型。 Generator

现在 TypeScript 知道变量的类型result将是 astring
并且它不再隐式类型为any。

如果我们尝试分配类型为的 yield 表达式的结果
number，我们会得到一个错误。

索引.ts


function* generator(): Generator<string, number, string> {
  const result = yield 'bobby';

  // ⛔️ Error: Type 'number' is not assignable to type 'string'.ts(2322)
  const result2 = yield 100;

  yield 'hadz';
  yield 'com';

  return 10000;
}

类似地，如果我们试图返回一个非数字值，或产生一个非字符串值，我们会得到一个错误。

这是使用生成器函数的完整示例。

索引.ts


function* generator(): Generator<string, number, string> {
  const result = yield 'bobby';

  yield 'hadz';
  yield 'com';

  return 10000;
}

const gen = generator();

console.log(gen.next().value); // 👉️ "bobby"
console.log(gen.next().value); // 👉️ "hadz"
console.log(gen.next().value); // 👉️ "com"
console.log(gen.next().value); // 👉️ 10000
console.log(gen.next().value); // undefined

额外资源

您可以通过查看以下教程来了解有关相关主题的更多信息：