TypeScript - Typy pri deštrukturalizácii objektu


Toto

const { foo: IFoo[] } = bar;

a toto

const { foo: Array<IFoo> } = bar;

rozumne spôsobí chybu.

A toto

const { foo: TFoo } = bar;

bude len deštrukturalizovať vlastnosť TFoo.

Ako je možné špecifikovať typy pre deštrukturalizované vlastnosti objektu?

Odpoveď č. 1

Ukazuje sa, že je možné určiť typ po : pre celý deštrukturačný vzor:

const {foo}: {foo: IFoo[]} = bar;

Čo v skutočnosti nie je nijako lepšie než obyčajné staré

const foo: IFoo[] = bar.foo;

Odpoveď č. 2

Ak vám nevadí používať rozhranie pri deštrukturalizácii:

interface User {
  name: string;
  age: number;
}

const obj: any = { name: 'Johnny', age: 25 };
const { name, age }: User = obj;

Typy vlastností name a age by mali byť správne odvodzované ako string a number.

Odpoveď č. 3

Príklad Next.js v TypeScripte

Mal som takéto scenáre:

const { _id } = req.query
if (_id.substr(2)) { 🚫
 ...
}

v ktorom bol req.query napísaný ako

type ParsedUrlQuery = { [key: string]: string | string[] }

takto to fungovalo:

const { _id } = req.query as { _id: string }
if (_id.substr(2)) { 🆗
 ...
}

Ironiou na tom je, že TypeScript mal pravdu a mal som urobiť:

const _id = String(req.query._id) ✅

Odpoveď č. 4

Nasledovanie mojej vlastnej otázky.

Typy nie je potrebné špecifikovať pre vlastnosti objektu, pretože sú odvodené z deštrukturovaného objektu.

Vzhľadom na to, že bar bol správne zadaný, typ foo bude odvodený:

const bar = { foo: [fooValue], ... }; // bar type is { foo: IFoo[], ... }
...
const { foo } = bar; // foo type is IFoo[]

Aj keď bar nebolo správne typované (any alebo unknown), jeho typ možno potvrdiť:

const { foo } = bar as { foo: IFoo[] }; // foo type is IFoo[]

Odpoveď č. 5

Ak chcete zničiť a premenovať:

const {foo: food}: {foo: IFoo[]} = bar;

Trvalo mi sekundu, kým som to vyššie zvládol správne.

Súvisiace články