TypeScript Types in object destructuring

[Hendoul]

Hi

Ich werde noch wahnsinnig bei Types und object destructuring.

interface IAddress {
    xyz: string,
    label?: { key: number; value: string };
}


function showXyz({ label: { key } = {}}: IAddress) {
    //noop
}

Hier bemängelt TS folgendes:
Type '{}' is missing the following properties from type '{ key: number; value: string; }': key, value(2739)


Das = {} habe ich eingefügt, dass es nicht zu einer Exception kommt wenn das 'label' undefined ist auf dem Adress-Objekt.
Ok und jetzt möchte TS gerne, dass das leere Objekt irgendwie typisiert wird. Nur habe ich keinen Schimmer wie und wo ich das da bewerkstelligen könnte.

Habe auch scho ein wenig gegoogled und das hier gefunden:
https://mariusschulz.com/blog/typing-destructured-object-parameters-in-typescript

Ich weiss aber immer noch nicht wie das anwenden in meinem Fall.

Kann mir jemand weiterhelfen?

 

[Dalek]

So wäre es korrekt, auch wenn mir der Sinn noch nicht völlig klar ist:

interface IAddress {
  label?: { key: number; value: string };
}

function showXyz({ label }: IAddress = {}) {
  //noop
}

Der Code gibt dir ein leeres Objekt wenn die Funktion ohne parameter aufgerufen wird, ich bin mir nicht sicher ob das das ist was Du erreichen willst. Dem label ein leeres Object zuzuordnen geht nicht da key und value nicht-nullbar sind.

Die Funktion hat nur einen Parameter, Du musst dann auch den default parameter außerhalb des destructuring setzen.

Das hier wäre die Variante für die destructured Variablen defaults zu setzen:

function showXyz({ label = {key: 0, value: "foo"} }: IAddress ) {
  //noop
}

Ich würde grundsätzlich diese Art von Fall aber eher mit optional chaining handhaben als mit einem default Parameter. Kommt aber natürlich auf den Code an der hier nicht gezeigt ist.

 

[Hendoul]

Ich möchte aber nur den 'key' destructuren und nicht das label. Mit deinem zweiten Code-Schnippsel wird das label zugewiesen und nicht der key?

Es geht darum, dass evtl. das 'label' property nicht gesetzt ist auf dem Adress-Objekt und ich dann ein Fehler bekomme wenn ich 'key' auf undefined aufrufen möchte.

Habe das Interface noch erweitert um zu zeigen, dass es da mehrere properties hat.

 

[Dalek]

Ich möchte aber nur den 'key' destructuren und nicht das label. Mit deinem zweiten Code-Schnippsel wird das label zugewiesen und nicht der key?

Ich glaube nicht das das geht da der Typ nicht garantiert das es "key" gibt. Das muss man vermutlich außerhalb des destructuring handeln. Mir ist auch nicht klar welchen default "key" bekommen soll, das darf ja nicht undefined sein.

Ich würde einfach nur "label" destructuren und dann mit label?.key auf den key zugreifen. Destructuring wird auch unlesbar wenn man es zuweit treibt.

 

[Bagbag]

Du gehst das falsch rum an. Wenn Label nicht undefined sein darf, dann definiere den Typ nicht mit ?, sondern so, dass die function des bekommt, was sie braucht.

 

[Hendoul]

Wer sagt denn, dass es nicht undefined sein darf? Das wird noch an anderen Orten verwendet und in gewissen Fällen ist es gesetzt und in anderen nicht Ich muss einfach entsprechend reagieren können wenn es undefined ist.

 

[Bagbag]

Du:

Es geht darum, dass evtl. das 'label' property nicht gesetzt ist auf dem Adress-Objekt und ich dann ein Fehler bekomme wenn ich 'key' auf undefined aufrufen möchte.

Das hört sich daher mehr nach Symptombehandlung an. Ansonsten wäre "if" das richtige oder "?.". Da du es aber im functionsaufruf default auf {} haben willst (wenn undefined), hast du in der Funktion kein Fall mit undefined.