Ein Tutorial zur Installation, Verwendung und automatischen Kompilierung von TypeScript

1. Einführung in TypeScript

Im vorherigen Artikel wurde die Installation, Verwendung und automatische Kompilierung von TypeScript vorgestellt. Klicken Sie hier, um den Artikel anzuzeigen, falls Sie ihn benötigen.

Einführung in TypeScript

TypeScript ist eine von Microsoft entwickelte, plattformübergreifende Open-Source-Programmiersprache. Es ist eine Obermenge von JavaScript und wird letztendlich in JavaScript-Code kompiliert.

Im Oktober 2012 veröffentlichte Microsoft die erste öffentliche Version von TypeScript. Am 19. Juni 2013 veröffentlichte Microsoft nach einer Vorschauversion offiziell die offizielle Version von TypeScript.

Der Autor von TypeScript ist Anders Hejlsberg, der Chefarchitekt von C#. Es ist eine Open Source und plattformübergreifende Programmiersprache.

TypeScript erweitert die Syntax von JavaScript, sodass jedes vorhandene JavaScript-Programm in einer TypeScript-Umgebung ausgeführt werden kann.

TypeScript ist für die Entwicklung umfangreicher Anwendungen konzipiert und kann in JavaScript kompiliert werden.

TypeScript ist eine Obermenge von JavaScript, die hauptsächlich ein Typsystem und Unterstützung für ES6+ bereitstellt. Es wurde von Microsoft entwickelt und der Code ist Open Source auf GitHub.

TypeScript ist eine Obermenge von JavaScript, die ein Typsystem und Unterstützung für ES6+ bietet. Es wurde von Microsoft entwickelt und sein Code ist Open Source auf GitHub (öffnet neues Fenster).

Funktionen von TypeScript

TypeScript hat drei Hauptfunktionen:

Von JavaScript zu JavaScript
TypeScript kann in reinen, prägnanten JavaScript-Code kompiliert werden und kann in jedem Browser, jeder Node.js-Umgebung und jeder JavaScript-Engine ausgeführt werden, die ECMAScript 3 (oder höher) unterstützt.

Starkes Typsystem
Das Typsystem ermöglicht JavaScript-Entwicklern die Verwendung effizienter Entwicklungstools und gängiger Vorgänge wie statischer Überprüfung und Code-Refactoring bei der Entwicklung von JavaScript-Anwendungen.

Fortgeschrittenes JavaScript
TypeScript bietet die neuesten und weiterentwickelten JavaScript-Funktionen, einschließlich der Funktionen von ECMAScript 2015 und zukünftigen Vorschlägen wie asynchrone Funktionen und Dekoratoren, um den Aufbau robuster Komponenten zu erleichtern.

Zusammenfassen

TypeScript erfreut sich in der Community immer größerer Beliebtheit. Es eignet sich sehr gut für einige große Projekte und einige grundlegende Bibliotheken, was uns dabei hilft, die Entwicklungseffizienz und -erfahrung erheblich zu verbessern.

2. TypeScript installieren

Führen Sie den folgenden Befehl in der Befehlszeile aus, um TypeScript global zu installieren:

npm install -g typescript

Führen Sie nach Abschluss der Installation den folgenden Befehl in der Konsole aus, um zu überprüfen, ob die Installation erfolgreich war (3.x):

tsc -V

3. Ihr erstes TypeScript-Programm

TS-Programme schreiben

src/hallowelt.ts

//Der Parameter str ist vom Typ string. function aa(str: string){
        return "Hallo" + str
    }
    let text = "kleine Süße"
    console.log(aa(Text))

Quelle/index.html

//Wenn die ts-Datei direkt importiert wird, meldet der Browser einen Fehler (wenn die ts-Datei nur die js-Syntax des Wortes enthält, kann sie normal importiert und verwendet werden)
  <script src="./helloworld.ts"></script>

Manuelles Kompilieren des Codes

Wir haben eine .ts-Erweiterung verwendet, aber dieser Code ist nur JavaScript.

Führen Sie in Ihrem Terminal den TypeScript-Compiler aus:

tsc hallowelt.ts

Die Ausgabe ist eine helloworld.js-Datei, die denselben JavaScript-Code wie die Eingabedatei enthält.

Führen Sie im Terminal diesen Code über Node.js aus:

Knoten hallo Welt.js

Ändern Sie src/index.html

<script src="./helloworld.js"></script>

Konsolenausgabe:

Hallo, Yee

Schauen wir uns den Code in helloworld.js an

 Funktion aa(str) {
        return "Hallo" + str;
    }
    var text = 'Kleine Süße';
    Konsole.log(aa(Text));

Zusammenfassen

• Wenn Sie JS-Syntaxcode direkt in die TS-Datei schreiben, können Sie die TS-Datei direkt in die HTML-Datei importieren und direkt im Browser von Google verwenden.
• Wenn die TS-Datei TS-Syntaxcode enthält, müssen Sie die TS-Datei in eine JS-Datei kompilieren und in der HTML-Datei auf die JS-Datei verweisen, um sie zu verwenden.
• Wenn ein Parameter in einer Funktion in einer TS-Datei mit einem bestimmten Typ geändert wird, gibt es diesen Typ nicht in der kompilierten JS-Datei.
• Die Variablen in der ts-Datei werden durch let geändert und die geänderten Variablen in der kompilierten js-Datei werden in var geändert.

automatische vscode-Kompilierung

1). Generieren Sie die Konfigurationsdatei tsconfig.json

Schritt:
Erstellen Sie einen neuen Ordner, öffnen Sie das Terminal, geben Sie den Befehl ein und die tsconfig.json-Konfiguration wird automatisch generiert.

tsc --init

2). Öffnen Sie die Datei und ändern Sie die tsconfig.json-Konfiguration

 "outDir": "./js",
    "streng": falsch, 

3). Überwachungsaufgabe starten:

Terminal -> Task ausführen -> Alle Tasks anzeigen -> tsconfig.json beobachten

Ändern und speichern Sie erneut, und die entsprechende js-Datei wird automatisch generiert.

Oben finden Sie den detaillierten Inhalt des Tutorials zur Installation, Verwendung und automatischen Kompilierung von TypeScript. Weitere Informationen zur Installation und Verwendung der automatischen Kompilierung von TypeScript finden Sie in den anderen verwandten Artikeln auf 123WORDPRESS.COM!