Typescript 返回類型 function 的自動完成

Question

我正在嘗試創建一個簡單的 function，它將按鍵返回 object 的值，如果它是 function，它將執行它並返回正確的類型，因此它可以由代碼編輯器自動完成。

type defaults = {
  a: "A" | "B" | (() => "A" | "B");
  b: "X" | "Y" | (() => "X" | "Y");
};

const myOpts: defaults = {
  a: () => "A",
  b: () => "X",
};

function option(name: string) {
  if (!myOpts[name]) {
    return null;
  }

  return typeof myOpts[name] === "function"
    ? myOpts[name].call()
    : myOpts[name];
}

console.log(myOpts.a);      // Autocomplete works
console.log(option("a"));   // Autocomplete does not work at all
console.log(option("xyz")); // Should warn that it does not exist!!!

那么，是否可以判斷出 function 的返回類型是在某些 object 中通過 key 找到的值的類型。

Answer 1

所以，我假設你只想自動完成任何可以從類型中推導出來的東西，在這種情況下，你可以只使用keyof 運算符

在您的場景中，您會將option function 更改為：

function option(name: keyof defaults): 'A' |'B' | 'X' | 'Y' | null {
  const prop = myOpts[name];
  if (!prop) {
    return null;
  }

  if (typeof prop === 'function') {
    return prop();
  }
  return prop;
}

如果您嘗試使用未知密鑰作為參數，這會給您一個警告。

現在需要的最后一個更改是更改潛在的 function 的調用方式。 您也可以在這里使用prop.call( null ) ，但為什么不直接調用它（如果您確定它是之前檢查過的 function ）

你可以在這里的操場上試試

作為評論，基於類型推斷，當前的 function 實際上不會return null; 現在在任何地方（它將始終是任何不可為空的屬性）但我添加了 null function 結果而不必更改大部分代碼:)

更改代碼的另一種選擇是使用一些更通用的選項，例如：

function option<T>( source: T, name: keyof T): any {
  const prop = source[name];
  if (!prop) {
    return null;
  }

  if (typeof prop === 'function') {
    return prop();
  }
  return prop;
}

這仍然會給你驗證，但結果類型可能需要是 any ，或者 string 如果你總是打算從它返回字符串值