Vad är TypeScript Interface vs Type?

Vad Ar Typescript Interface Vs Type



TypeScript stöder anpassade typer, som kan definieras med antingen ' gränssnitt ' eller ' typ ”. Ett gränssnitt kan implementeras av en klass eller ett objekt, medan ett typalias endast kan användas för att skapa ett nytt namn för en befintlig typ eller för att definiera en förening av typer. Även om typer och gränssnitt ofta är utbytbara, finns det vissa skillnader i deras funktionalitet och syntax som gör dem mer lämpliga för särskilda scenarier.

Den här bloggen kommer att beskriva TypeScript-gränssnittet och typen och deras skillnad.







Vad är TypeScript Interface vs Type?

' Gränssnitt ' och ' typ ” används för att definiera anpassade typer i TypeScript. Men det finns vissa skillnader i deras funktionalitet och syntax. Huvudskillnaden mellan ett gränssnitt och en typ är att ett gränssnitt definierar en ny typ, medan ett typalias inte gör det.



Ett gränssnitt kan implementeras av en klass eller ett objekt, medan typer kan definiera mer komplexa typer med hjälp av funktioner som fackföreningar och korsningar. I allmänhet är gränssnitt vanligare för att definiera objektformer och API:er, medan typer är vanligare för att definiera komplexa datatyper och verktygstyper. Låt oss förstå båda dessa separat.



Vad är ett TypeScript-gränssnitt?

Ett TypeScript-gränssnitt är en teknik för att definiera formen på ett TypeScript-objekt. Den skapas med nyckelordet ' gränssnitt ” och den specificerar en uppsättning attribut och metoder som ett objekt kräver för att klassificeras som av den typen. Det motsvarar en klass i objektorienterad programmering; den definierar dock inte någon implementering. Gränssnitt används främst för typkontroll och för att säkerställa att ett objekt överensstämmer med en specifik struktur.





Innan du fortsätter, kom ihåg att för att köra en TypeScript-fil måste den överföras till en JavaScript-fil och sedan köra JavaScript-koden på terminalen med de givna kommandona:

tsc filnamn.ts
nod filnamn.js


Exempel



Skapa ett gränssnitt med namnet 'Användare' som definierar tre attribut och en metod ' få information() ”:

gränssnitt Användare {
förnamn: sträng;
efternamn: sträng;
ålder: nummer;
få information ( ) : tomhet;
}


Skapa en klass ' Studerande ” som ärvs med ett gränssnitt. Klassen definierar sina attribut, en konstruktor som kommer att tilldela värdena till attributen och en metod 'getInfo()' som visar värdena i förhållande till attributen:

klass Elev implementerar Användare {
förnamn: sträng;
efternamn: sträng;
ålder: nummer;

konstruktör ( förnamn: sträng, efternamn: sträng, ålder: nummer ) {
this.firstName = förnamn;
detta.efternamn = efternamn;
this.age = ålder;
}
få information ( ) : tomhet {
console.log ( 'Studentinformation:' )
console.log ( '- Namn: ' + this.firstName + ' ' + detta.efternamn ) ;
console.log ( '- Ålder: ' + denna.ålder ) ;
}
}


Skapa ett objekt av ' Studerande ' som heter ' std ' av ' Användare ' skriv genom att anropa konstruktorn med nyckelordet 'nya' och anropa sedan metoden getInfo() för att skriva ut data på konsolen:

const std: Användare = ny student ( 'Fladdermus' , 'Steve' , 17 ) ;
std.getInfo ( ) ;


Produktion

Vad är en TypeScript-typ?

TypeScript-typer används oftast för att skapa alias för befintliga typer samt för att skapa mer komplicerade typer. Det representerar en specifik form eller struktur av data. Det kan definieras/deklareras med ' typ ' nyckelord. TypeScripts typer kan användas för att göra koden mer begriplig och minska upprepning/duplicering.

Exempel

Definiera först en typ ' Användare ' använda ' typ ' nyckelord som anges med fem egenskaper, en av dem är ett valfritt attribut som är ' telefon ”:

typ Användare = {
förnamn: sträng;
efternamn: sträng;
ålder: nummer;
e-post: sträng;
telefon?: sträng;
} ;


Definiera en funktion som heter ' getFullName ', som tar en parameter av typen ' Användare ” och skriver ut data som består av personens information inklusive ” namn ”, “ ålder ”, “ e-post ' och ' telefonnummer ”:

fungera få information ( person: Användare ) : tomhet {
console.log ( 'Användar information:' )
console.log ( '- Namn: ' + person.firstName + ' ' + person.efternamn ) ;
console.log ( '- Ålder: ' + person.ålder ) ;
console.log ( '- E-post: ' + person.e-post ) ;
console.log ( '-Telefonnummer: ' + person.telefon ) ;
}


Skapa nu ett objekt ' person 'av typen' Användare ” med nyckel-värdepar:

const person: Användare = {
förnamn: 'Mily' ,
efternamn: 'Micheal' ,
ålder: 28 ,
e-post: 'mili124@yahoo.com' ,
telefon: '086-34581734'
} ;


Slutligen, skriv ut användarinformationen genom att anropa funktionen getInfo():

console.log ( få information ( person ) ) ;


Produktion


Det handlade om TypeScript-gränssnittet och typen.

Slutsats

I TypeScript, ' gränssnitt ' och ' typ ” används för att definiera anpassade typer. Ett gränssnitt kan implementeras av en klass eller ett objekt, medan typer kan definiera mer komplexa typer med hjälp av funktioner som fackföreningar och korsningar. Det här är de kraftfulla funktionerna som kan hjälpa till att skriva mer organiserad och skalbar kod. Den här bloggen beskrev TypeScript-gränssnittet och typen och deras skillnad.