typescript - Slå samman två gränssnitt

Söker bekräftelse eller förtydligande

Om jag har två gränssnitt. Vad är det "rätta" sättet att skapa en sammanslagning av dessa två gränssnitt?

IFoo {
  // some stuff
}


IBar {
  // some stuff
}


IFooBar extends IFoo, IBar {
 // Empty
}

Det fungerar men det känns konstigt, som om jag gör fel med den tomma IFooBar.

Gör jag det här rätt?

Jag märkte också att detta också fungerar:

type IFooBar = IFoo & IBar;

Jag har en illogisk aversion mot att använda type, ändå är det mycket renare.

Svar #1

Den här artikeln förklarar relationen mellan gränssnitt och typalias mycket väl, den här delen fokuserar på små skillnader mellan dem.

Båda

interface IFooBar extends IFoo, IBar {}

och

type IFooBar = IFoo & IBar;

är vanliga sätt att göra detta och kommer att bete sig identiskt i de flesta fall. Eftersom type tar färre tecken att skriva kan det väljas av den anledningen.

Den inkonsekvens som orsakas av blandning av interface och type bör inte vara ett problem; de är bara lämpliga funktioner för att uppnå målet. Om const BarClass=FooClass gör jobbet, bör inte class BarClass extends FooClass {} föredras bara för att det konsekvent använder class överallt (detta exempel används för illustrativa syften, det finns en betydande skillnad mellan dessa tillvägagångssätt).

Även om interface och type kan bete sig på liknande sätt, finns det en skillnad i fallet med sammanfogad interface (även täckt i länkad artikel). Detta kommer att fungera:

interface FooBar extends IFoo, IBar {}
class FooBar { ... }

Och detta kommer att orsaka typfel:

type FooBar = IFoo & IBar;
class FooBar { ... }

Svar #2

Om du vill sammanfoga 2 gränssnitt som innehåller medlemmar mer än 1 nivå djupt:

export interface TypeOne  {
  one: {
    two: {
      hello: string;
    }[]
  }
}

export type TypeTwo = {
  one: {
    two: {
      world: string;
    }[]
  }
} & TypeOne;

const x: TypeTwo;
x.one.two[0]. // autocomplete options are 'hello' / 'world'

Relaterade artiklar