Was ist TypeScript Interface vs. Type?

Was Ist Typescript Interface Vs Type



TypeScript unterstützt benutzerdefinierte Typen, die entweder mit „ Schnittstelle ' oder ' Typ “. Eine Schnittstelle kann durch eine Klasse oder ein Objekt implementiert werden, während ein Typalias nur zum Erstellen eines neuen Namens für einen vorhandenen Typ oder zum Definieren einer Vereinigung von Typen verwendet werden kann. Obwohl Typen und Schnittstellen häufig austauschbar sind, gibt es bestimmte Unterschiede in ihrer Funktionalität und Syntax, die sie für bestimmte Szenarien geeigneter machen.

In diesem Blog werden die TypeScript-Schnittstelle und -Typen sowie deren Unterschiede beschrieben.







Was ist TypeScript Interface vs. Type?

Schnittstelle ' Und ' Typ “ werden zum Definieren benutzerdefinierter Typen in TypeScript verwendet. Es gibt jedoch einige Unterschiede in ihrer Funktionalität und Syntax. Der Hauptunterschied zwischen einer Schnittstelle und einem Typ besteht darin, dass eine Schnittstelle einen neuen Typ definiert, während ein Typalias dies nicht tut.



Eine Schnittstelle kann durch eine Klasse oder ein Objekt implementiert werden, während Typen komplexere Typen mithilfe von Funktionen wie Vereinigungen und Schnittmengen definieren können. Im Allgemeinen werden Schnittstellen häufiger zum Definieren von Objektformen und APIs verwendet, während Typen häufiger zum Definieren komplexer Datentypen und Hilfstypen verwendet werden. Lassen Sie uns beide getrennt verstehen.



Was ist eine TypeScript-Schnittstelle?

Eine TypeScript-Schnittstelle ist eine Technik zum Definieren der Form eines TypeScript-Objekts. Es wird mit dem Schlüsselwort „ Schnittstelle “ und es gibt eine Reihe von Attributen und Methoden an, die ein Objekt benötigt, um als von diesem Typ klassifiziert zu werden. Es ist äquivalent zu einer Klasse in der objektorientierten Programmierung; es definiert jedoch keine Implementierung. Schnittstellen werden hauptsächlich zur Typprüfung verwendet und stellen sicher, dass ein Objekt einer bestimmten Struktur entspricht.





Bevor Sie fortfahren, denken Sie daran, dass eine TypeScript-Datei zum Ausführen in eine JavaScript-Datei transpiliert und dann der JavaScript-Code mit den angegebenen Befehlen auf dem Terminal ausgeführt werden muss:

tsc Dateiname.ts
Knoten Dateiname.js


Beispiel



Erstellen Sie eine Schnittstelle namens „Benutzer“, die drei Attribute und eine Methode „ Informationen bekommen() “:

Schnittstelle Benutzer {
Vorname: Zeichenkette;
Nachname: Zeichenkette;
Alter: Zahl;
Informationen bekommen ( ) : Leere;
}


Erstellen Sie eine Klasse “ Student “, die mit einer Schnittstelle vererbt wird. Die Klasse definiert ihre Attribute, einen Konstruktor, der den Attributen die Werte zuweist, und eine Methode „getInfo()“, die die Werte relativ zu den Attributen anzeigt:

Klasse Student implementiert User {
Vorname: Zeichenkette;
Nachname: Zeichenkette;
Alter: Zahl;

Konstrukteur ( Vorname: Zeichenkette, Nachname: Zeichenkette, Alter: Zahl ) {
this.firstName = firstName;
this.lastName = lastName;
this.age = Alter;
}
Informationen bekommen ( ) : Leere {
Konsole.log ( 'Schüler Informationen:' )
Konsole.log ( '- Name: ' + dieser.vorname + ' ' + this.nachname ) ;
Konsole.log ( '- Alter: ' + dieses.alter ) ;
}
}


Erstellen Sie ein Objekt von „ Student ' genannt ' Standard ' von ' Benutzer “, indem Sie den Konstruktor mit dem Schlüsselwort „new“ aufrufen und dann die Methode getInfo() aufrufen, um die Daten auf der Konsole auszugeben:

const std: Benutzer = neuer Student ( 'Schläger' , 'Steve' , 17 ) ;
std.getInfo ( ) ;


Ausgang

Was ist ein TypeScript-Typ?

TypeScript-Typen werden hauptsächlich zum Erstellen von Aliasen für vorhandene Typen sowie zum Erstellen komplizierterer Typen verwendet. Es stellt eine bestimmte Form oder Struktur von Daten dar. Es kann mit dem „ Typ ' Stichwort. Die Typen von TypeScript können verwendet werden, um Code verständlicher zu machen und Wiederholungen/Duplikate zu reduzieren.

Beispiel

Definieren Sie zunächst einen Typ „ Benutzer ' Verwendung der ' Typ ” Schlüsselwort mit fünf Eigenschaften angegeben, eine davon ist ein optionales Attribut, das “ Telefon “:

Typ Benutzer = {
Vorname: Zeichenkette;
Nachname: Zeichenkette;
Alter: Zahl;
E-Mail: Zeichenkette;
Telefon?: Zeichenkette;
} ;


Definieren Sie eine Funktion mit dem Namen „ getFullName “, die einen Parameter vom Typ „ Benutzer “ und druckt die Daten, die aus den Informationen der Person bestehen, einschließlich „ Name “, „ Alter “, „ Email ' Und ' Telefonnummer “:

Funktion Informationen bekommen ( Person: Benutzer ) : Leere {
Konsole.log ( 'Nutzerinformation:' )
Konsole.log ( '- Name: ' + person.vorname + ' ' + person.nachname ) ;
Konsole.log ( '- Alter: ' + Person.Alter ) ;
Konsole.log ( '- Email: ' + Person.E-Mail ) ;
Konsole.log ( '-Telefon #: ' + Person.Telefon ) ;
}


Erstellen Sie nun ein Objekt „ Person „vom Typ“ Benutzer ” mit Schlüssel-Wert-Paaren:

konstante Person: Benutzer = {
Vorname: 'Mily' ,
Familienname, Nachname: 'Michael' ,
Alter: 28 ,
Email: 'mili124@yahoo.com' ,
Telefon: '086-34581734'
} ;


Drucken Sie zuletzt die Benutzerinformationen, indem Sie die Funktion getInfo() aufrufen:

Konsole.log ( Informationen bekommen ( Person ) ) ;


Ausgang


Das war alles über die TypeScript-Schnittstelle und den Typ.

Abschluss

In TypeScript „ Schnittstelle ' Und ' Typ “ werden zum Definieren benutzerdefinierter Typen verwendet. Eine Schnittstelle kann durch eine Klasse oder ein Objekt implementiert werden, während Typen komplexere Typen mithilfe von Funktionen wie Vereinigungen und Schnittmengen definieren können. Dies sind die leistungsstarken Funktionen, die dabei helfen können, besser organisierten und skalierbaren Code zu schreiben. In diesem Blog wurden die TypeScript-Schnittstelle und -Typen sowie deren Unterschiede beschrieben.