TypeScript 中 Property does not exist on type void 错误

当我们尝试访问不返回任何内容的函数的返回值上的属性时，会发生“Property does not exist on type void”错误。 要解决该错误，需要确保从函数的所有代码路径返回正确的值。

以下是错误发生方式的示例：

const getPromise = () => {
  Promise.resolve(42);
};

// ⛔️ Error: Property 'then' does not
// exist on type 'void'.ts(2339)
getPromise().then((value) => {
  console.log(value);
});

getPromise 函数不返回值，因此 TypeScript 将其返回类型设置为 void。

// ?️ const getPromise: () => void
const getPromise = () => {
  Promise.resolve(42);
};

该函数隐式返回 undefined，因此我们无法访问未定义值的属性。

要解决该错误，请确保在访问特定属性之前更正函数的返回值。

// ?️ const getPromise: () => Promise<number>
const getPromise = () => {
  return Promise.resolve(42);
};

// ✅ Works
getPromise().then((value) => {
  console.log(value); // ?️ 42
});

我们使用 return 关键字显式地从函数返回一个值。

现在我们可以访问函数的 then() 方法，因为它返回一个有效的承诺。

如果我们忘记从函数返回对象，我们也可能会遇到此错误。

const getObj = () => {
  const obj = { name: 'Tom' };
};

// ⛔️ Error: Property 'name' does
// not exist on type 'void'.ts(2339)
getObj().name

解决方案是相同的 – 我们必须从函数返回特定值。

const getObj = () => {
  const obj = { name: 'Tom' };

  return obj;
};

console.log(getObj().name); // ?️ "Tom"

有时很难看出缺少的 return 语句到底在哪里。 在某些情况下，我们有许多代码路径（嵌套条件等），但错误意味着我们的函数返回 undefined，因此我们知道要查找的内容。

调试时一个好的解决方案是显式键入函数的返回类型。

// ⛔️ Error: A function whose declared type
// is neither 'void' nor 'any' must return a value.ts(2355)
const getPromise = (): Promise<number> => {
   Promise.resolve(42);
};

这是发现我们的应用程序中存在错误的简单方法。

函数的所有代码路径都应返回一个值。

// ⛔️ Function lacks ending return statement and
// return type does not include 'undefined'.ts(2366)
const getPromise = (): Promise<number> => {
  if (Math.random()) {
    return Promise.resolve(42);
  }

  Promise.resolve(33);
};

我们已将函数的返回类型明确指定为 Promise<number>，但我们仅在 if 语句中返回一个 promise。

如果不满足条件，则 if 块将不会运行，函数将隐式返回 undefined。 要解决这个问题，请确保从函数的所有代码路径中显式返回一个值。

const getPromise = (): Promise<number> => {
  if (Math.random()) {
    return Promise.resolve(42);
  }

  return Promise.resolve(33);
};

总结

当我们尝试访问不返回任何内容的函数的返回值上的属性时，会发生“Property does not exist on type void”错误。 要解决该错误，需要确保从函数的所有代码路径返回正确的值。

火焰兔

海报 链接