A TypeScript felületeinek áttekintése

  • 5 perc

A TypeScript egyik alapelve, hogy a típusellenőrzés az értékek alakzatára összpontosít. Ezt néha "kacsagépelésnek" vagy "szerkezeti altipizálásnak" is nevezik. A TypeScriptben a felületek betöltik az ilyen típusok elnevezésének szerepét, és hatékony módszert jelentenek a kódon belüli "kódszerződések" és a projekten kívüli kódokkal rendelkező szerződések meghatározására.

Kezdjük az interfészek áttekintésével, beleértve azok használatát és használatát a TypeScript-kódban.

Mi az a felület?

Az interfészek segítségével leírhatja az objektumokat, elnevezheti és paraméterezheti az objektumtípusokat, és újakká alakíthatja a meglévő elnevezett objektumtípusokat.

Ez az egyszerű felület egy objektum két tulajdonságát és metódusát Employee határozza meg.

interface Employee {
    firstName: string;
    lastName: string;
    fullName(): string;
}

Figyelje meg, hogy a felület nem inicializálja vagy implementálja a benne deklarált tulajdonságokat. Ennek az az oka, hogy az interfészek egyetlen feladata egy típus leírása. Meghatározza, hogy a kódszerződés mit igényel, míg az interfészt megvalósító változó, függvény vagy osztály megfelel a szerződésnek a szükséges megvalósítási részletek megadásával.

A felület definiálása után típusként használhatja, és a típusellenőrzés és az Intellisense minden előnyét élvezheti.

Ez a példa egy ilyen típusú Employeeváltozó deklarálásával valósítja meg az interfészt. A szerződés teljesítéséhez adja meg a tulajdonságok és lastName a firstName tulajdonságok értékeit, és meghatározza, hogy a fullName metódusnak egyesítenie kell a firstName tulajdonságokat és lastName az eredményt.

let employee: Employee = {
    firstName : "Emil",
    lastName: "Andersson",
    fullName(): string {
        return this.firstName + " " + this.lastName;
    }
}

employee.firstName = 10;  //* Error - Type 'number' is not assignable to type 'string'

A típusellenőrzés biztosítja, hogy a szám 10 nem rendelhető hozzá employee.firstName , stringmert egy .

Mivel a TypeScript szerkezeti típusú rendszerrel rendelkezik, a rendszer egy adott tagkészlettel rendelkező felülettípust azonosnak tekint, és helyettesíthető egy másik illesztőtípussal vagy objektumtípus-literállal azonos tagkészlettel. Ha egy interfész és egy osztály ugyanazt a struktúrát valósítja meg, azok felcserélhetők. Példa: Szerkezeti gépelés a játszótéren.

A felületek nem rendelkeznek futásidejű ábrázolásokkal; ezek pusztán fordítási idejű szerkezetek. Az interfészek különösen hasznosak a szükséges tulajdonságok, paraméterekként átadott objektumok és függvényekből visszaadott objektumok dokumentálásához és érvényesítéséhez. Ez lehetővé teszi a hibák elfogását, és meggyőződhet arról, hogy a megfelelő paramétereket adja át fordításkor ahelyett, hogy futásidőben szeretné megtudni őket.

Az interfész TypeScriptben való használatának okai

Az interfészek gyakran a TypeScript-kód két darabja közötti kapcsolat kulcspontjai, különösen meglévő JavaScript-kódokkal vagy beépített JavaScript-objektumokkal való munka során.

Egy felülettel a következő műveletekhez használhatja:

  • Rövidített nevek létrehozása a gyakran használt típusokhoz. A korábbi példában deklarálthoz hasonló egyszerű felülettel továbbra is élvezheti az Intellisense előnyeit és a típusellenőrzést.
  • Konzisztenciát hajthat végre egy objektumkészleten, mert az interfészt megvalósító összes objektum ugyanazon típusdefiníciók szerint működik. Ez akkor lehet hasznos, ha fejlesztőkből álló csapattal dolgozik, és gondoskodni szeretne arról, hogy a megfelelő értékek átadva legyenek a tulajdonságoknak, konstruktoroknak vagy függvényeknek. Az interfészt megvalósító objektumoknak például implementálniuk kell a felület összes szükséges tagját. Ha tehát nem adja meg a megfelelő típusú összes szükséges paramétert, a TypeScript fordító hibát jelez.
  • Ismertesse a meglévő JavaScript API-kat, és tisztázza a függvényparamétereket és a visszatérési típusokat. Ez különösen akkor hasznos, ha Olyan JavaScript-kódtárakkal dolgozik, mint a jQuery. Az interfészek segítségével egyértelmű képet kaphat arról, hogy egy függvény mire számít, és mit fog visszaadni a dokumentáció ismételt felkeresése nélkül.

Miben különbözik egy felület a típus aliasától?

A Employee fenti felület típus aliasként is kifejezhető a type kulcsszó használatával:

type Employee = {
    firstName: string;
    lastName: string;
    fullName(): string;
}

A típus aliasa egy adattípus definíciója, például egyesítő, primitív, metszet, metszéspont vagy bármilyen más típus. Az interfészek viszont adatalakzatok, például objektumok leírására használhatók. A típus-aliasok úgy viselkedhetnek, mint az interfészek; azonban van néhány apró különbség. A fő különbség az, hogy egy típus aliasa nem nyitható meg újra új tulajdonságok hozzáadásához, míg a felület mindig bővíthető. Egy egyesítést vagy egyesítést csak típus alias használatával írhat le.