Konvertieren Sie die Basisklasseninstanz in eine abgeleitete Klasse ohne Typumwandlung im Typoskript
P粉451614834
P粉451614834 2024-02-25 19:48:09
0
2
337

Ich habe eine neue Klasse aus der Basisklasse erweitert und einige Eigenschaften hinzugefügt. Wie erstelle ich eine Instanz einer abgeleiteten Klasse mithilfe einer bestimmten Basisklasse einschließlich angehängter Eigenschaften?

Dieser Code funktioniert, wandelt aber den Klassentyp um und ist nicht typsicher

Wie geht das ohne Typkonvertierung?

// Base class is imported from a package. Not editable
class BaseClass {
  public x: number;
  public power() {
    return this.x * 2;
  }
}

export interface CustomClass extends BaseClass {
  value: number;
}

function createCustomClass(base: BaseClass, myValue: number): CustomClass {

  // it's not type safe to cast this variable
  // How to do it the right way in Typescript?
  const result: CustomClass = base as CustomClass;
  result.value = myValue;
  return result;
}

P粉451614834
P粉451614834

Antworte allen(2)
P粉765570115

我认为使用您的方法不可能完全排除类型转换,但是如果您使用 type Guard 检查变量 result 是否有效 CustomClass (在我的实现中是 isCustomClass ),那将是安全的: p>

// Base class is imported from a package. Not editable
class BaseClass {
  public x: number;
  public power() {
    return this.x * 2;
  }
}

export interface CustomClass extends BaseClass {
  value: number;
}

function isCustomClass(classToCheck: any): classToCheck is CustomClass {
  return (
    typeof classToCheck?.value === "number" && classToCheck instanceof BaseClass
  );
}

function createCustomClass(base: BaseClass, myValue: number): CustomClass {
  const result = base;
  (result as CustomClass).value = myValue;
  if (!isCustomClass(result)) {
    throw new Error("Cannot create valid `CustomClass`");
  }

  return result;
}
P粉486138196

您可以使用 Object.assign () 方法 向目标对象添加属性。该方法返回目标对象,以及 其在 TypeScript 库中的调用签名输入类型的交集

这意味着你的 createCustomClass() 可以这样实现:

function createCustomClass(base: BaseClass, myValue: number): CustomClass {
  return Object.assign(base, { value: myValue });
}

返回类型为 BaseClass & {value: number},其结构与 CustomClass 相同,因此函数编译不会出错,且不存在 需要类型断言

Playground 代码链接 p>

Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!