Typescript：如何查看接口類型

Question

我有一個 getUniqueId 方法，它接受下面兩種接口，它將根據傳遞的接口類型返回 uniqueId：

interface ReadOnlyInfo {
    itemId: string;
    ....
}

interface EditInfo {
    formId: number; 
    ....
}

function getUniqueId (info: ReadOnlyInfo | EditInfo) {
   if (info instanceof ReadOnlyInfo) {
       return info.itemId;
   }
   return info.formId;
}

我想知道在這里使用 instanceof 是否是一個好習慣。 我擔心的是我可能有許多其他類似於 getUniqueId 的方法，它們也接受“ReadOnlyInfo | EditInfo”類型，因此我必須在各處重復“ReadOnlyInfo | EditInfo”。

我沒有這樣做，而是嘗試使用類型：

type CommonInfo = | ReadOnlyInfo | EditInfo;

所以，我可以保存一些代碼（只做 CommondInfo），如下所示，但那樣的話，我無法分辨 CommonInfo 是哪種類型，instanceof 不再有效並給我編譯器錯誤。

function getUniqueId (info: CommonInfo) {
     if (info instanceof ReadOnlyInfo) {
           return info.itemId;
       }
       return info.formId;   
}

所以，我想知道在這種情況下設計接口/方法的最佳實踐是什么。 提前致謝！

Answer 1

Typescript 中的接口只是 ide 的語法糖。 不可能像其他語言一樣檢查接口類型。 以 C# 為例。

但是使用類型保護，您可以識別正在使用的接口。

interface ReadOnlyInfo {
    itemId: string;
    ....
}

interface EditInfo {
    formId: number; 
    ....
}

function getUniqueId (info: ReadOnlyInfo | EditInfo) {
    if (isReadOnlyInfo(info)) return info.itemId;
    if (isEditInfo(info)) return info.formId;
}

function isReadOnlyInfo(item: any): item is ReadOnlyInfo {
    return 'itemId' in item;
}

function isEditInfo(item: any): item is EditInfo {
    return 'formId' in item;
}

通過這種方式，您可以獲得更好的 ide 支持

Answer 2

In TypeScript, you can use the getPrototypeOf operator to check the type of an interface object. For example:

interface MyInterface {
  prop1: string;
  prop2: number;
}

const myObject: MyInterface = { prop1: 'hello', prop2: 42 };

console.log(myObject && (Object.getPrototypeOf(myObject) === MyInterface.prototype)) 
// true