TS 中函数缺少结束返回语句错误

作者

函数缺少结束返回语句错误在 TS

Function lacks ending return statement Error in TS

当并非具有显式返回类型的函数的所有代码路径都返回值时，会发生“函数缺少结束返回语句并且返回类型不包括未定义”错误。要解决该错误，请从所有代码路径返回一个值或包含undefined在函数的返回类型中。

以下是错误发生方式的 3 个常见示例。

索引.ts
// ⛔  Error:️ Function lacks ending return statement
// and return type does not include 'undefined'.ts(2366)
const getNumber = (): number => {
  if (Math.random() > 0.5) {
    return 100;
  }
  // 👇️ No return value here 👇️
};

const getPromise = async (): Promise<number> => {
  try {
    const result = await Promise.resolve(42);
    return result;
  } catch (err) {
    console.log(err);
    // 👇️ No return value here 👇️
    // TypeScript expects that all calls to function
    // return number (even erroneous ones)
  }
};

const getString = (): string => {
  if ('hello'.length === 5) {
    return 'hello';
  } else if ('hello'.length === 6) {
    return 'hello';
  }
  // 👇️ TypeScript doesn't know that 👇️
  // getting here is impossible
};

让我们看看3错误原因的解决方案。

在第一个示例中，我们已明确将函数的返回类型设置为
number，但并非所有代码路径都返回一个值。

要解决此错误，请确保从函数的所有代码路径返回一个值。

索引.ts
// ✅ Works now
const getNumber = (): number => {
  if (Math.random() > 0.5) {
    return 100;
  }

  return 50; // 👈️ all code paths return a value
};

第二个示例显示了try/catch在函数中使用语句时错误是如何发生的，我们为此设置了返回类型Promise<number>.

索引.ts
// ⛔  Error:️ Function lacks ending return statement
// and return type does not include 'undefined'.ts(2366)
const getPromise = async (): Promise<number> => {
  try {
    const result = await Promise.resolve(42);
    return result;
  } catch (err) {
    console.log(err);
    // 👇️ no return value here 👇️
  }
};

这里的问题是我们已经将函数键入 return Promise<number>，所以 TypeScript 期望对函数的所有调用都返回
Promise<number>，即使是那些出错的调用。

要解决此问题，请使用
联合类型
将函数的返回类型设置为Promise<number | undefined>.

索引.ts
// ✅ Works now
const getPromise = async (): Promise<number | undefined> => {
  try {
    const result = await Promise.resolve(42);
    return result;
  } catch (err) {
    console.log(err);
  }
};

现在 TypeScript 知道函数返回类型为numberor
的 Promise undefined，这是函数返回类型的准确表示。

当您获得函数的返回值时，使用
类型保护来确定它是numberor undefined。

索引.ts
const getPromise = async (): Promise<number | undefined> => {
  try {
    const result = await Promise.resolve(42);
    return result;
  } catch (err) {
    console.log(err);
  }
};

getPromise().then((value) => {
  if (typeof value === 'number') {
    // ✅ We know that value is number
    console.log(value.toFixed());
  }
});

我们在其中使用typeof 运算符的简单if语句

用作类型保护。

TypeScript 知道块中的类型是valuea ，因此我们可以安全地访问与数字相关的内置方法。numberif

第三个例子展示了 TypeScript 并不总是能够准确地确定函数的流程。

索引.ts
// ⛔  Error:️ Function lacks ending return statement
// and return type does not include 'undefined'.ts(2366)
const getString = (): string => {
  if ('hello'.length === 5) {
    return 'hello';
  } else if ('hello'.length === 6) {
    return 'hello';
  }
  // 👇️ TypeScript doesn't know that 👇️
  // getting here is impossible
};

字符串hello的长度为5，因此我们知道该if块将运行并且我们将始终返回值hello，但 TypeScript 不知道。

要解决这个问题，我们必须else if用 an 替换结束语句else或简单地删除条件。

下面2个例子是一样的。

索引.ts
// ✅ Works now
const getString = (): string => {
  if ('hello'.length === 5) {
    return 'hello';
  } else {
    return 'bye';
  }
};

或者完全移除else块。

索引.ts
// ✅ Works now

const getString = (): string => {
  if ('hello'.length === 5) {
    return 'hello';
  }
  return 'bye';
};

无论哪种方式，TypeScript 现在都能够确定函数的所有代码路径都返回 type 的值string。

错误的一个常见原因是 – 我们从内部函数或回调返回一个值，并认为该值也从外部函数返回。

索引.ts
// ⛔  Error:️ Function lacks ending return statement
// and return type does not include 'undefined'.ts(2366)
const getString = (): string => {
  if ('hello'.length === 5) {
    return 'hello';
  }

  function inner() {
    return 'bye';
  }

  inner();
};

请注意，该inner函数也返回 a string，但从嵌套函数返回值并不意味着该值是从外部函数返回的。

如果您遇到类似情况，请确保返回调用内部函数的结果。

索引.ts
// ✅ Works now
const getString = (): string => {
  if ('hello'.length === 5) {
    return 'hello';
  }

  function inner() {
    return 'bye';
  }

  return inner();
};

结论

当并非具有显式返回类型的函数的所有代码路径都返回值时，会发生“函数缺少结束返回语句并且返回类型不包括未定义”错误。要解决该错误，请从所有代码路径返回一个值或包含undefined在函数的返回类型中。

–