TypeScript-Lernprogramm: Kenntnisse über die Grundlagen von TypeScript

TypeScript ist eine stark typisierte Obermenge von das kompiliert zu einfachem JavaScript. Sie können diese Sprache für die JavaScript-Entwicklung im Anwendungsmaßstab verwenden. Es kann auch auf jedem Browser, jedem Host und jedem Betriebssystem ausgeführt werden. In diesem TypeScript-Tutorial werden wir uns mit der Tiefe von TypeScript befassen und die Grundlagen in der folgenden Reihenfolge verstehen:

• Einführung in TypeScript
• TypeScript-Typen
• Variablen
• Betreiber
• Schleifen
• Funktionen
• Saiten
• Arrays
• Schnittstellen
• Klassen
• Objekte
• TypeScript-Anwendungsfall

Einführung in TypeScript

TypeScript ist eine typisierte Obermenge von JavaScript, die zu einfachem JavaScript kompiliert wird. TypeScript ist rein objektorientiert mit Klassen, Schnittstellen und statisch typisierten Programmiersprachen wie C # oder . Zum Kompilieren und Generieren in einer JavaScript-Datei ist ein Compiler erforderlich. Grundsätzlich ist TypeScript die ES6-Version von JavaScript mit einigen zusätzlichen Funktionen.

Ein TypeScript-Code wird in eine Datei mit geschrieben .ts Erweiterung und dann mit dem Compiler in JavaScript kompiliert. Sie können die Datei in einem beliebigen Code-Editor schreiben und der Compiler muss auf Ihrer Plattform installiert sein. Nach der Installation den Befehl tsc .ts Kompiliert den TypeScript-Code in eine einfache JavaScript-Datei.

Syntax:

var message: string = 'Willkommen bei Edureka!' console.log (Nachricht)

Beim Kompilieren wird der folgende JavaScript-Code generiert:

// Erstellt von Typoskript 1.8.10 var message = 'Willkommen bei Edureka!' console.log (Nachricht)

Funktionen von TypeScript

• Plattformübergreifend: Der TypeScript-Compiler kann auf jedem Betriebssystem wie Windows, MacOS und Linux installiert werden.

  
  
  

• Objektorientierte Sprache : TypeScript bietet Funktionen wie Klassen , Schnittstellen und Module. Somit kann objektorientierter Code sowohl für die clientseitige als auch für die serverseitige Entwicklung geschrieben werden.

• Statische Typprüfung : TypeScript verwendet statische Typisierung und hilft bei der Typprüfung beim Kompilieren. So können Sie beim Schreiben des Codes Fehler finden, ohne das Skript auszuführen.

• Optionale statische Typisierung : TypeScript ermöglicht auch die optionale statische Eingabe, falls Sie die dynamische Eingabe von JavaScript verwenden.

• DOM-Manipulation : Mit TypeScript können Sie das DOM zum Hinzufügen oder Entfernen von Elementen bearbeiten.

• ES 6 Funktionen : TypeScript enthält die meisten Funktionen des geplanten ECMAScript 2015 (ES 6, 7) wie Klasse, Schnittstelle, Pfeilfunktionen usw.

Vorteile der Verwendung von TypeScript

• TypeScript ist schnell, einfach, leicht zu lernen und läuft auf jedem Browser oder jeder JavaScript-Engine.

• Es ist ähnlich zu JavaScript und verwendet die gleiche Syntax und Semantik.

• Dies hilft Backend-Entwicklern beim Schreiben des Frontends Code schneller .

• TypeScript-Code kann von einem aufgerufen werden vorhandener JavaScript-Code . Außerdem funktioniert es problemlos mit vorhandenen JavaScript-Frameworks und -Bibliotheken.

• Die Definitionsdatei mit der Erweiterung .d.ts bietet Unterstützung für vorhandene JavaScript-Bibliotheken wie Jquery, D3.js. usw. TypeScript-Code kann also hinzugefügt werden JavaScript-Bibliotheken Verwenden von Typdefinitionen, um die Vorteile der Typprüfung, der automatischen Vervollständigung von Code und der Dokumentation in vorhandenen dynamisch typisierten JavaScript-Bibliotheken zu nutzen.

• Es enthält Funktionen von ES6 und ES7 das kann in ES5-Level-JavaScript-Engines wie laufen Node.js .

Nachdem Sie verstanden haben, was TypeScript ist, fahren wir mit diesem TypeScript-Lernprogramm fort und sehen uns die verschiedenen Typen an.

TypeScript-Typen

Das Typsystem repräsentiert die verschiedenen Arten von Werten, die von der Sprache unterstützt werden. Es prüft die Gültigkeit der gelieferten Werte bevor sie vom Programm gespeichert oder bearbeitet werden.

Es kann in zwei Typen eingeteilt werden, wie zum Beispiel:

• Eingebaut : Dies beinhaltet number, string, boolean, void, null und undefined.
• Benutzerdefinierte : Es enthält Aufzählungen, Klassen, Schnittstellen, Arrays und Tupel.

Fahren wir nun mit diesem TypeScript-Lernprogramm fort und erfahren mehr über Variablen.

TypeScript Tutorial: Variablen

Eine Variable ist ein benannter Bereich im Speicher, in dem Werte gespeichert werden.

Die Typensyntax zum Deklarieren einer Variablen in TypeScript enthält einen Doppelpunkt (:) nach dem Variablennamen, gefolgt von ihrem Typ. Ähnlich wie bei JavaScript verwenden wir die var Schlüsselwort eine Variable deklarieren.

Es gibt vier Optionen, wenn wir eine Variable deklarieren:

var [Bezeichner]: [Typanmerkung] = Wert

var [Bezeichner]: [Typanmerkung]

var [Bezeichner] = Wert

var [identifizieren]

Beispiel:

var name: string = 'Daisy' var empid: number = 1001 console.log ('name' + name) console.log ('employee id' + empid)

Beim Kompilieren wird folgender JavaScript-Code generiert:

// Erstellt durch Typoskript 1.8.10 var name = 'Daisy' var empid = 1001 console.log ('name' + name) console.log ('employee id:' + empid)

Ausgabe:

Name: Daisy
Mitarbeiter-ID: 1001

Fahren wir nun mit dem nächsten Thema unseres TypeScript-Tutorials fort.

Betreiber

Ein Operator wird verwendet, um Funktionen zu definieren, die für die Daten ausgeführt werden. Die Daten, mit denen Operatoren arbeiten, werden als Operanden bezeichnet. Es gibt verschiedene Arten von Betreiber in TypeScript wie:

• Rechenzeichen
• Logische Operatoren
• Vergleichsoperatoren
• Bitweise Operatoren
• Zuweisungsoperatoren

Rechenzeichen

Beispiel:

var num1: number = 10 var num2: number = 2 var res: number = 0 res = num1 + num2 console.log ('Summe:' + res) res = num1 - num2 console.log ('Unterschied:' + res) res = num1 * num2 console.log ('Produkt:' + res)

Ausgabe:

Summe: 12
Unterschied: 8
Produkt: 20

Logische Operatoren

Beispiel:

var avg: number = 20 var Prozent: number = 90 console.log ('Wert von avg:' + avg + ', Wert von Prozent:' + Prozentsatz) var res: boolean = ((avg> 50) && (Prozentsatz> 80) )) console.log ('(Durchschnitt> 50) && (Prozentsatz> 80):', res)

Ausgabe:

Wert des Durchschnitts: 20, Wert des Prozentsatzes: 90
(Durchschnitt> 50) && (Prozentsatz> 80): falsch

Vergleichsoperatoren

Beispiel:

var num1: number = 10 var num2: number = 7 console.log ('Wert von num1:' + num1) console.log ('Wert von num2:' + num2) var res = num1> num2 console.log ('num1 größer als num2: '+ res) res = num1
 Ausgabe: 
Wert von num1: 10 
 Wert von num2: 7 
 num1 größer als num2: true 
 num1 kleiner als num2: falsch
 Bitweise Operatoren 
 Betreiber 
 Beschreibung 
 Bitweises UND (&) 
führt eine boolesche UND-Operation für jedes Bit seiner ganzzahligen Argumente aus.
 Bitweises ODER (|) 
Es führt eine boolesche ODER-Operation für jedes Bit seiner ganzzahligen Argumente aus.
 Bitweises XOR (^) 
Es führt eine boolesche exklusive ODER-Operation für jedes Bit seiner ganzzahligen Argumente aus.
 Bitweise NICHT (~) 
Dies ist ein unärer Operator, bei dem alle Bits im Operanden umgekehrt werden.
 Linksverschiebung (<<) 
Es verschiebt alle Bits in seinem ersten Operanden um die im zweiten Operanden angegebene Anzahl von Stellen nach links.
 Rechtsverschiebung (>>) 
Der Wert des linken Operanden wird um die vom rechten Operanden angegebene Anzahl von Bits nach rechts verschoben.
 Rechtsverschiebung mit Null (>>>) 
Es ähnelt dem Operator >>, außer dass die links verschobenen Bits immer Null sind.
 Beispiel: 
var a: number = 2 // Bitpräsentation 10 var b: number = 3 // Bitpräsentation 11 var result result = (a & b) console.log ('(a & b) =>', result) result = ( a | b) console.log ('(a | b) =>', Ergebnis)
 Ausgabe: 
(a & b) => 2 
 (a | b) => 3
 Zuweisungsoperatoren 
 Betreiber 
 Beschreibung 
 Einfache Zuordnung (=) 
Weist dem linken Operanden Werte vom rechten Operanden zu
 Hinzufügen und Zuweisen (+ =) 
Es fügt dem linken Operanden den rechten Operanden hinzu und weist das Ergebnis dem linken Operanden zu.
 Subtrahieren und zuordnen (- =) 
Es subtrahiert den rechten Operanden vom linken Operanden und weist das Ergebnis dem linken Operanden zu.
 Multiplizieren und zuordnen (* =) 
Es multipliziert den rechten Operanden mit dem linken Operanden und weist das Ergebnis dem linken Operanden zu.
 Teilen und Zuweisen (/ =) 
Es teilt den linken Operanden mit dem rechten Operanden und weist das Ergebnis dem linken Operanden zu.
 Beispiel: 
var a: number = 12 var b: number = 10 a = b console.log ('a = b:' + a) a + = b console.log ('a + = b:' + a) a - = b console .log ('a- = b:' + a)
 Ausgabe: 
a = b: 10 
 a + = b: 20 
 a - = b: 10
Dies waren die verschiedenen Betreiber. Fahren wir nun mit unserem TypeScript-Lernprogramm fort und lernen Sie Schleifen kennen.
 Schleifen 
Es kann Situationen geben, in denen ein Codeblock mehrmals ausgeführt werden muss. EIN Schleife Mit der Anweisung können wir eine Anweisung oder eine Gruppe von Anweisungen mehrmals ausführen.
Die TypeScript-Schleifen können wie folgt klassifiziert werden:
 Für Schleife 
Das für Schleife ist eine Implementierung einer bestimmten Schleife.
 Syntax: 
für (erster Ausdruck zweiter Ausdruck dritter Ausdruck) {// Anweisungen, die wiederholt ausgeführt werden sollen}
Hier wird der erste Ausdruck ausgeführt, bevor die Schleife beginnt. Der zweite Ausdruck ist die Bedingung für die Ausführung der Schleife. Und der dritte Ausdruck wird nach der Ausführung jedes Codeblocks ausgeführt.
 Beispiel: 
für (sei i = 0 i<2 i++) { console.log ('Execute block statement' + i) }
 Ausgabe: 
Blockanweisung 0 ausführen 
Blockanweisung 1 ausführen
 While-Schleife 
Die while-Schleife führt die Anweisungen jedes Mal aus, wenn die angegebene Bedingung als wahr ausgewertet wird.
 Syntax: 
while (Bedingungsausdruck) {// auszuführender Codeblock}
 Beispiel: 
sei i: number = 1 while (i<3) { console.log( 'Block statement execution no.' + i ) i++ }
 Ausgabe: 
Blockanweisungsausführung Nr.1 
Blockanweisungsausführung Nr. 2
 Do..While Loop 
Die do & hellipwhile-Schleife ähnelt der while-Schleife, außer dass sie die Bedingung nicht zum ersten Mal auswertet, wenn die Schleife ausgeführt wird.
 Syntax: 
do {// auszuführender Codeblock} while (Bedingungsausdruck)
 Beispiel: 
  
let i: number = 1 do {console.log ('Blockanweisungsausführungsnummer' + i) i ++} while (i<3)
 Ausgabe: 
Blockanweisungsausführung Nr.1 
Blockanweisungsausführung Nr. 2
Abgesehen davon gibt es in TypeScript die Anweisungen break und continue, die in einer Schleife verwendet werden.
 Break Statement 
Die break-Anweisung wird verwendet, um die Kontrolle über ein Konstrukt zu übernehmen. Die Verwendung der break-Anweisung in einer Schleife hilft dem Programm beim Verlassen der Schleife.
 Beispiel: 
var i: number = 1 while (i<=10) { if (i % 5 == 0) { console.log ('The first multiple of 5 between 1 and 10 is : '+i) break //exit the loop if the first multiple is found } i++ } //outputs 5 and exits the loop
 Ausgabe: 
Das erste Vielfache von 5 zwischen 1 und 10 ist: 5
 Erklärung fortsetzen 
Die continue-Anweisung überspringt die nachfolgenden Anweisungen in der aktuellen Iteration und bringt die Steuerung zurück zum Anfang der Schleife.
 Beispiel: 
var num: number = 0 var count: number = 0 für (num = 0num<=10num++) { if (num % 2==0) { continue } count++ } console.log (' The count of odd values between 0 and 10 is: '+count)
 Ausgabe: 
Die Anzahl der ungeraden Werte zwischen 0 und 10 beträgt: 5
Dies waren die verschiedenen Schleifen in TypeScript. Fahren wir nun mit unserem TypeScript-Lernprogramm fort und verstehen die Funktionen.
 Funktionen 
In JavaScript Funktionen sind einer der wichtigsten Teile, da es sich um eine funktionale Programmiersprache handelt. Funktionen stellen sicher, dass das Programm wartbar und wiederverwendbar ist und in lesbaren Blöcken organisiert ist. Während TypeScript das Konzept von Klassen und Modulen bereitstellt, sind Funktionen immer noch ein wesentlicher Bestandteil der Sprache.
 Benannte Funktionen 
Eine benannte Funktion wird verwendet, um eine Funktion unter ihrem Vornamen zu deklarieren und aufzurufen.
 Beispiel: 
Funktionsanzeige () {console.log ('TypeScript-Funktion')} Anzeige ()
 Ausgabe: 
TypeScript-Funktion
 Anonyme Funktion 
Eine anonyme Funktion ist eine Funktion, die als Ausdruck definiert ist. Dieser Ausdruck wird in einer Variablen gespeichert. Diese Funktionen werden mit dem Variablennamen aufgerufen, in dem die Funktion gespeichert ist.
 Beispiel: 
let greeting = function () {console.log ('TypeScript Function')} greeting ()
 Ausgabe: 
TypeScript-Funktion
 Pfeilfunktion 
Fettpfeilnotationen werden für anonyme Funktionen verwendet, d. H. Für Funktionsausdrücke. Sie werden in anderen Sprachen auch als Lambda-Funktionen bezeichnet.
 Syntax: 
(param1, param2, ..., paramN) => Ausdruck
Wenn Sie den fetten Pfeil (=>) verwenden, müssen Sie nicht mehr das Schlüsselwort 'function' verwenden. Parameter werden in eckigen Klammern übergeben, und der Funktionsausdruck wird in die geschweiften Klammern {} eingeschlossen.
 Beispiel: 
let sum = (x: number, y: number): number => {return x + y} sum (10, 30) // gibt 40 zurück
 Funktionsüberladung 
TypeScript bietet das Konzept der Funktionsüberladung. Somit können Sie mehrere Funktionen mit demselben Namen, aber unterschiedlichen Parametertypen und Rückgabetypen haben.
 Beispiel: 
Funktion add (a: string, b: string): string function add (a: number, b: number): number return a + b} add ('Hallo', 'Edureka') // gibt 'Hello Edureka' zurück add ( 10, 10) // gibt 20 zurück
Im obigen Beispiel haben wir dieselbe Funktion add () mit zwei Funktionsdeklarationen und einer Funktionsimplementierung. Die erste Signatur enthält zwei Parameter der Typzeichenfolge, während die zweite Signatur zwei Parameter der Typennummer enthält.
Dies sind die verschiedenen Arten von Funktionen. Fahren wir nun mit unserem TypeScript-Lernprogramm fort und verstehen die Zeichenfolgen in TypeScript.
 TypeScript Tutorial: Strings 
Das  ist ein weiterer primitiver Datentyp, der zum Speichern von Textdaten verwendet wird. Zeichenfolgenwerte werden von einfachen oder doppelten Anführungszeichen umgeben.
wie man Power in Python macht
 Syntax: 
var var_name = neuer String (String)
Im String-Objekt stehen verschiedene Eigenschaften von Methoden zur Verfügung, z.
 Baumeister - Es wird ein Verweis auf die String-Funktion zurückgegeben, mit der das Objekt erstellt wurde
 Länge - Dies gibt die Länge der Zeichenfolge zurück
 Prototyp - Mit dieser Eigenschaft können Sie einem Objekt Eigenschaften und Methoden hinzufügen
 Beispiel: 
let name = new String ('Willkommen bei Edureka!') console.log ('Nachricht:' + Name) console.log ('Länge:' + Name.Länge)
 Ausgabe: 
Nachricht: Willkommen bei Edureka! 
 Länge: 19
 String-Methoden 
Die Liste der Methoden im String-Objekt enthält:
 Methode 
 Beschreibung 
 charAt () 
Es gibt das Zeichen am angegebenen Index zurück
 charCodeAt () 
Es wird eine Zahl zurückgegeben, die den Unicode-Wert des Zeichens am angegebenen Index angibt
 concat () 
Kombiniert den Text zweier Zeichenfolgen und gibt eine neue Zeichenfolge zurück
 Index von() 
Gibt den Index innerhalb des aufrufenden String-Objekts des ersten Auftretens des angegebenen Werts zurück
 lastIndexOf () 
Es gibt den Index innerhalb des aufrufenden String-Objekts des letzten Auftretens des angegebenen Werts zurück
 Spiel() 
Wird verwendet, um einen regulären Ausdruck mit einer Zeichenfolge abzugleichen
 localeCompare () 
Gibt eine Zahl zurück, die angibt, ob eine Referenzzeichenfolge vor oder nach der angegebenen Zeichenfolge in Sortierreihenfolge steht oder mit dieser übereinstimmt
 Suche() 
Dadurch wird die Suche nach einer Übereinstimmung zwischen einem regulären Ausdruck und einer angegebenen Zeichenfolge ausgeführt
 ersetzen() 
Wird verwendet, um eine Übereinstimmung zwischen einem regulären Ausdruck und einer Zeichenfolge zu finden und die übereinstimmende Teilzeichenfolge durch eine neue Teilzeichenfolge zu ersetzen
 Scheibe() 
Es extrahiert einen Abschnitt einer Zeichenfolge und gibt eine neue Zeichenfolge zurück
 Teilt() 
Teilt ein String-Objekt in ein Array von Strings auf, indem der String in Teilzeichenfolgen aufgeteilt wird
 substr () 
Gibt die Zeichen in einer Zeichenfolge zurück, die an der angegebenen Stelle durch die angegebene Anzahl von Zeichen beginnt
 Teilzeichenfolge () 
Es gibt die Zeichen in einer Zeichenfolge zwischen zwei Indizes in die Zeichenfolge zurück
 toLocaleLowerCase () 
Die Zeichen in einer Zeichenfolge werden unter Berücksichtigung des aktuellen Gebietsschemas in Kleinbuchstaben konvertiert
 toLocaleUpperCase () 
Die Zeichen in einer Zeichenfolge werden unter Berücksichtigung des aktuellen Gebietsschemas in Großbuchstaben konvertiert
 toLowerCase () 
Es gibt den aufrufenden Zeichenfolgenwert zurück, der in Kleinbuchstaben konvertiert wurde
 toUpperCase () 
Es gibt den aufrufenden Zeichenfolgenwert zurück, der in Großbuchstaben konvertiert wurde
 toString () 
Gibt eine Zeichenfolge zurück, die das angegebene Objekt darstellt
 Wert von() 
Gibt den Grundwert des angegebenen Objekts zurück
 Beispiel: 
let str: string = 'Willkommen bei Edureka' str.charAt (0) // gibt 'w' zurück str.charAt (2) // gibt 'l' zurück 'Willkommen bei Edureka'.charAt (2) gibt' l 'zurück, lass str1 : string = 'welcome' let str2: string = 'Edureka' str1.concat (str2) // gibt 'welcomeEdureka' zurück str1.concat ('', str2) // gibt 'welcome Edureka' str1.concat ('' to 'zurück) ') // gibt' Willkommen bei 'zurück
Nachdem Sie sich mit Strings vertraut gemacht haben, fahren wir mit diesem TypeScript-Tutorial fort und verstehen Arrays.
 Arrays in TypeScript 
Ein Array ist ein spezieller Datentyp, der mehrere Werte verschiedener Datentypen nacheinander unter Verwendung einer speziellen Syntax speichert. Array-Elemente werden durch eine eindeutige Ganzzahl identifiziert, die als Index oder Index des Elements bezeichnet wird.
 Syntax: 
var array_name [: datatype] // Deklaration array_name = [val1, val2, valn ..] // Initialisierung
 Beispiel: 
let names: Array names = ['John', 'Daisy', 'Rachel'] let ids: Array ids = [101, 700, 321]
 Array-Methoden 
Hier ist eine Liste verschiedener Array-Methoden, die für verschiedene Zwecke verwendet werden können:
 Methode 
 Beschreibung 
 Filter() 
Erstellt ein neues Array mit allen Elementen dieses Arrays, für das die bereitgestellte Filterfunktion true zurückgibt
 jeder() 
Gibt true zurück, wenn jedes Element in diesem Array die bereitgestellte Testfunktion erfüllt
 concat () 
Gibt ein neues Array zurück, das aus diesem Array besteht und mit anderen Arrays verbunden ist
 Index von() 
Gibt den ersten oder kleinsten Index eines Elements innerhalb des Arrays zurück, der dem angegebenen Wert entspricht
 für jede() 
Ruft eine Funktion für jedes Element im Array auf
 beitreten() 
Verbindet alle Elemente eines Arrays zu einer Zeichenfolge
 lastIndexOf () 
Gibt den letzten oder größten Index eines Elements innerhalb des Arrays zurück, der dem angegebenen Wert entspricht
 Karte() 
Erstellt ein neues Array mit den Ergebnissen des Aufrufs einer bereitgestellten Funktion für jedes Element in diesem Array
 drücken() 
Fügt ein oder mehrere Elemente am Ende eines Arrays hinzu und gibt die neue Länge des Arrays zurück
 pop () 
Entfernt das letzte Element aus einem Array und gibt dieses Element zurück
 reduzieren() 
Wenden Sie eine Funktion gleichzeitig von links nach rechts auf zwei Werte des Arrays an, um sie auf einen einzigen Wert zu reduzieren
 reduRight () 
Wenden Sie eine Funktion gleichzeitig auf zwei Werte des Arrays von rechts nach links an, um sie auf einen einzelnen Wert zu reduzieren
 umkehren() 
Kehrt die Reihenfolge der Elemente eines Arrays um
 Verschiebung() 
Entfernt das erste Element aus einem Array und gibt dieses Element zurück
 Scheibe() 
Extrahiert einen Abschnitt eines Arrays und gibt ein neues Array zurück
 etwas() 
Es gibt true zurück, wenn mindestens ein Element in diesem Array die bereitgestellte Testfunktion erfüllt
 Sortieren() 
Es sortiert die Elemente eines Arrays
 toString () 
Gibt eine Zeichenfolge zurück, die das Array und seine Elemente darstellt
 spleißen() 
Es fügt Elemente zu einem Array hinzu und / oder entfernt sie
 nicht verschieben () 
Fügt ein oder mehrere Elemente an der Vorderseite eines Arrays hinzu und gibt die neue Länge des Arrays zurück
 Beispiel: 
var name: Array = ['John', 'Daisy', 'Tara'] name.sort () console.log (name) // Ausgabe: ['Daisy', 'John', 'Tara'] console.log ( name.pop ()) // Ausgabe: Tara name.push ('Rachel') console.log (Name) // Ausgabe: ['John', 'Daisy', 'Rachel']
Lassen Sie uns nun mit diesem TypeScript-Tutorial fortfahren und mehr über Schnittstellen erfahren.
 TypeScript-Schnittstellen 
Die Schnittstelle ist eine Struktur, die den Vertrag in Ihrer Anwendung definiert. Es definiert die Syntax für die folgenden Klassen. Es enthält nur die Deklaration der Mitglieder und es liegt in der Verantwortung der ableitenden Klasse, die Mitglieder zu definieren.
 Beispiel: 
Schnittstelle Mitarbeiter {empID: Nummer empName: Zeichenfolge getSalary: (Nummer) => Nummer // Pfeilfunktion getManagerName (Nummer): Zeichenfolge}
Im obigen Beispiel ist die Mitarbeiter Schnittstelle enthält zwei Eigenschaften empID und empName . Es enthält auch eine Methodendeklaration getSalaray mit einem Pfeilfunktion Dies beinhaltet einen Zahlenparameter und einen Zahlenrückgabetyp. Das getManagerName Methode wird mit einer normalen Funktion deklariert.
 Typoskript  Klassen 
TypeScript führte Klassen ein, damit sie die Vorteile objektorientierter Techniken wie Kapselung und Abstraktion nutzen können. Die Klasse in TypeScript wird vom TypeScript-Compiler zu einfachen JavaScript-Funktionen kompiliert, um plattform- und browserübergreifend zu arbeiten.
Eine Klasse enthält Folgendes:
 Baumeister 
 Eigenschaften 
 Methoden 
 Beispiel: 
Klasse Mitarbeiter {empID: Nummer empName: Zeichenfolgenkonstruktor (ID: Nummer, Name: Zeichenfolge) {this.empName = Name this.empID = ID} getSalary (): Nummer {return 40000}}
 Erbe 
TypeScript unterstützt Erbe da es die Fähigkeit eines Programms ist, neue Klassen aus einer vorhandenen Klasse zu erstellen. Die Klasse, die erweitert wird, um neuere Klassen zu erstellen, wird als übergeordnete Klasse oder Superklasse bezeichnet. Die neu erstellten Klassen werden als untergeordnete Klassen oder Unterklassen bezeichnet.
Eine Klasse erbt von einer anderen Klasse mit dem Schlüsselwort 'erweitert'. Untergeordnete Klassen erben alle Eigenschaften und Methoden außer privaten Mitgliedern und Konstruktoren von der übergeordneten Klasse. TypeScript unterstützt jedoch keine Mehrfachvererbung.
 Syntax: 
Die Klasse child_class_name erweitert parent_class_name
 Beispiel: 
Klasse Person {Name: Zeichenfolgenkonstruktor (Name: Zeichenfolge) {this.name = Name}} Klasse Mitarbeiter erweitert Person {empID: Zahlenkonstruktor (empID: Nummer, Name: Zeichenfolge) {super (Name) this.empID = empid} displayName (): void {console.log ('Name =' + this.name + ', Mitarbeiter-ID =' + this.empID)}} let emp = neuer Mitarbeiter (701, 'Jason') emp.displayName () // Name = Jason, Mitarbeiter-ID = 701
Nachdem Sie sich mit Klassen auskennen, können Sie mit diesem TypeScript-Lernprogramm fortfahren und mehr über Objekte erfahren.
 Objekte in TypeScript 
Ein Objekt ist eine Instanz, die einen anderen Satz von Schlüssel-Wert-Paaren enthält. Die Werte können skalare Werte oder Funktionen oder sogar ein Array anderer Objekte sein.
 Syntax: 
var object_name = {key1: 'value1', // skalarer Wert key2: 'value', key3: function () {// functions}, key4: ['content1', 'content2']
Ein Objekt kann skalare Werte, Funktionen und Strukturen wie Arrays und Tupel enthalten.
 Beispiel: 
var person = {Vorname: 'Danny', Nachname: 'Grün'} // Zugriff auf die Objektwerte console.log (person.firstname) console.log (person.lastname)
Beim Kompilieren wird derselbe Code in JavaScript generiert.
 Ausgabe: 
Danny 
 Grün
Dies waren die verschiedenen wichtigen Elemente von TypeScript. Fahren wir nun mit diesem TypeScript-Lernprogramm fort und sehen uns ein Beispiel an, um den Anwendungsfall zu verstehen.
 TypeScript Tutorial: Anwendungsfall 
Hier lernen wir, wie man ein vorhandenes konvertiert  zu TypeScript.
Wenn wir eine TypeScript-Datei kompilieren, wird eine entsprechende JavaScript-Datei mit demselben Namen erstellt. Hier müssen wir sicherstellen, dass sich unsere ursprüngliche JavaScript-Datei, die als Eingabe fungiert, nicht im selben Verzeichnis befinden kann, damit TypeScript sie nicht überschreibt.
Der Prozess zur Migration von JavaScript zu TypeScript umfasst die folgenden Schritte:
 1. Fügen Sie dem Projekt die Datei tsconfig.json hinzu 
Sie müssen dem Projekt eine tsconfig.json-Datei hinzufügen. TypeScript verwendet eine tsconfig.json-Datei zum Verwalten der Kompilierungsoptionen des Projekts, z. B. welche Dateien Sie ein- und ausschließen möchten.
{'compilerOptions': {'outDir': './built', 'allowJs': true, 'target': 'es5'}, 'include': ['./src/**/*']}
 2. Integrieren Sie in ein Build-Tool 
Die meisten JavaScript-Projekte verfügen über ein integriertes Build-Tool wie gulp oder webpack. Sie können Projekte auf folgende Weise in das Webpack integrieren:
Führen Sie den folgenden Befehl auf dem Terminal aus:
$ npm installiere awesome-typescript-loader Quell-Map-Loader
Bei der Webpack-Integration verwenden Sie den awesome-typescript-loader in Kombination mit dem source-map-loader, um das Debuggen des Quellcodes zu vereinfachen.
Zweitens führen Sie die Modulkonfigurationseigenschaft in unserer Datei webpack.config.js zusammen, um Loader einzuschließen.
 3. Verschieben Sie alle .js-Dateien in .ts-Dateien 
In diesem Schritt müssen Sie die .js-Datei in .ts-Datei umbenennen. Wenn die Datei JSX verwendet, müssen Sie sie ebenfalls in .tsx umbenennen. Wenn wir diese Datei jetzt in einem Editor öffnen, der TypeScript unterstützt, können einige der Codes Kompilierungsfehler verursachen. Durch das Konvertieren von Dateien nacheinander können Kompilierungsfehler einfacher behandelt werden. Wenn TypeScript während der Konvertierung Kompilierungsfehler feststellt, kann der Code dennoch übersetzt werden.
 4. Auf Fehler prüfen 
Nach dem Verschieben der js-Datei in die ts-Datei startet TypeScript sofort die Typprüfung unseres Codes. Daher können Diagnosefehler im JavaScript-Code auftreten.
 5. Verwenden Sie JavaScript-Bibliotheken von Drittanbietern 
JavaScript-Projekte verwenden Bibliotheken von Drittanbietern wie  oder Lodash. Um Dateien kompilieren zu können, muss TypeScript die Typen aller Objekte in diesen Bibliotheken kennen. Die TypeScript-Typdefinitionsdateien für JavaScript-Bibliotheken sind bereits bei DefinitelyTyped verfügbar. Es ist also nicht erforderlich, diesen Typ extern zu installieren. Sie müssen nur die Typen installieren, die in unserem Projekt verwendet werden.
Für jQuery können Sie die Definition installieren:
$ npm install @ types / jquery
Nehmen Sie danach die Änderungen am JavaScript-Projekt vor und führen Sie das Build-Tool aus. Jetzt sollten Sie das TypeScript-Projekt in einfaches JavaScript kompilieren lassen, das im Browser ausgeführt werden kann.
Damit sind wir am Ende dieses TypeScript-Tutorials angelangt. Ich hoffe, Sie haben alle wichtigen Elemente von TypeScript verstanden.
 Besuche die     von Edureka.  Mit dem Web Development Certification Training erfahren Sie, wie Sie beeindruckende Websites mit HTML5-, CSS3-, Twitter Bootstrap 3-, jQuery- und Google-APIs erstellen und für Amazon Simple Storage Service (S3) bereitstellen. 
 Hast du eine Frage an uns? Bitte erwähnen Sie es im Kommentarbereich von 'TypeScript Tutorial' und wir werden uns bei Ihnen melden.