Was ist TypeScript und warum sollte ich es anstelle von JavaScript verwenden? [geschlossen]

1695

Können Sie bitte beschreiben, was die TypeScript-Sprache ist?

Was kann es, was JavaScript oder verfügbare Bibliotheken nicht können, das würde mir Anlass geben, darüber nachzudenken?

Mohammed Thabet
quelle
11
Schauen Sie sich diesen Blog an: blogs.msdn.com/b/somasegar/archive/2012/10/01/…
Andreas
Hier sind einige Gedanken dazu: blog.priceandcost.com/development/…
Jefim

Antworten:

1299

Ich habe diese Antwort ursprünglich geschrieben, als TypeScript noch druckfrisch war. Fünf Jahre später ist dies eine gute Übersicht, aber schauen Sie sich Lodewijks Antwort unten an, um mehr Tiefe zu erhalten

1000ft Ansicht ...

TypeScript ist eine Obermenge von JavaScript, die hauptsächlich optionale statische Typisierung, Klassen und Schnittstellen bietet. Einer der großen Vorteile besteht darin, dass IDEs eine umfangreichere Umgebung zum Erkennen häufiger Fehler beim Eingeben des Codes bereitstellen können .

Sehen Sie sich das Einführungsvideo von Microsoft zur Sprache an, um eine Vorstellung davon zu bekommen, was ich meine .

Bei einem großen JavaScript-Projekt kann die Übernahme von TypeScript zu einer robusteren Software führen, die jedoch weiterhin dort eingesetzt werden kann, wo eine reguläre JavaScript-Anwendung ausgeführt wird.

Es ist Open Source, aber Sie erhalten das clevere Intellisense nur, wenn Sie eine unterstützte IDE verwenden. Anfangs war dies nur Microsoft Visual Studio (auch im Blogbeitrag von Miguel de Icaza erwähnt ). In diesen Tagen, andere IDEs bieten zu Typoskript zu unterstützen .

Gibt es ähnliche Technologien?

Es gibt CoffeeScript , aber das dient wirklich einem anderen Zweck. Meiner Meinung nach bietet CoffeeScript Lesbarkeit für Menschen, aber TypeScript bietet durch seine optionale statische Typisierung auch eine gute Lesbarkeit für Werkzeuge ( etwas mehr Kritik finden Sie in diesem aktuellen Blog-Beitrag ). Es gibt auch Dart, aber das ist ein vollständiger Ersatz für JavaScript (obwohl es JavaScript-Code erzeugen kann )

Beispiel

Hier ein Beispiel für TypeScript (Sie können damit auf dem TypeScript-Spielplatz spielen ).

class Greeter {
    greeting: string;
    constructor (message: string) {
        this.greeting = message;
    }
    greet() {
        return "Hello, " + this.greeting;
    }
}  

Und hier ist das JavaScript, das es produzieren würde

var Greeter = (function () {
    function Greeter(message) {
        this.greeting = message;
    }
    Greeter.prototype.greet = function () {
        return "Hello, " + this.greeting;
    };
    return Greeter;
})();

Beachten Sie, wie TypeScript den Typ der Elementvariablen und Klassenmethodenparameter definiert. Dies wird bei der Übersetzung in JavaScript entfernt, aber von der IDE und dem Compiler verwendet, um Fehler zu erkennen, z. B. das Übergeben eines numerischen Typs an den Konstruktor.

Es ist auch in der Lage, Typen abzuleiten, die nicht explizit deklariert sind. Beispielsweise würde es bestimmen, dass die greet()Methode eine Zeichenfolge zurückgibt.

Debuggen von TypeScript

Viele Browser und IDEs bieten direkte Debugging-Unterstützung über Sourcemaps. Weitere Informationen finden Sie in dieser Frage zum Stapelüberlauf: Debuggen von TypeScript-Code mit Visual Studio

Möchten Sie mehr wissen?

Ich habe diese Antwort ursprünglich geschrieben, als TypeScript noch druckfrisch war. Weitere aktuelle Details finden Sie in der Antwort von Lodewijk auf diese Frage.

Paul Dixon
quelle
103
WebStorm bietet jetzt schönes IntelliSense für TypeScript und ist plattformübergreifend.
Radek
26
Das Problem mit diesen Tools ist, dass Sie mit Javascript nie die volle Leistung erzielen. Ja, es bietet eine gute Lesbarkeit, aber der kompilierte Code ist manchmal sehr klobig. Sie verlassen sich auf ein Drittanbieter-Tool, um natives Javascript zu schreiben. Ich denke, dies ist nicht der richtige Weg, es ist, als würde man eine Sprache in eine andere Sprache umwandeln. Wenn Sie eine Sprache ändern möchten, die keine andere Sprache ist, um sich wie eine andere Sprache zu verhalten, die Sie mögen, ist das dumm und albern. ...... (Ende von Teil 1) ......
Codebeat
56
@Erwinus: Hast du noch mit Assembler programmiert?
VikciaR
11
@Erwinus Sie machen Annahmen darüber, wie TypeScript funktioniert. Sie können einfaches JavaScript als TypeScript schreiben und den Compiler nur die Typprüfung zur Kompilierungszeit durchführen lassen. Dadurch entsteht kein Leistungsverlust.
Gedankenrepo
41
@Erwinus Der Sinn von TypeScript besteht darin, die Typprüfung zur Kompilierungszeit bereitzustellen. Wenn Sie den Wert darin nicht sehen, ist das vollkommen in Ordnung. TypeScript wurde als "Ihr erster Komponententest" bezeichnet. Es gibt viele Ressourcen, die diskutieren, ob die optionale Typprüfung einen Wert hat oder nicht, und die detaillierter sind als das, was wir hier tun können. Ich versuche nicht, Sie von irgendetwas zu überzeugen, sondern nur ein Missverständnis zu korrigieren.
Gedankenrepo
1052

Die Beziehung von TypeScript zu JavaScript

TypeScript ist eine typisierte Obermenge von JavaScript, die zu einfachem JavaScript kompiliert wird - typescriptlang.org .

JavaScript ist eine Programmiersprache, die vom Technischen Komitee 39 der EMCA entwickelt wurde , einer Gruppe von Personen, die sich aus vielen verschiedenen Interessengruppen zusammensetzt. TC39 ist ein von der ECMA veranstaltetes Komitee : eine interne Normungsorganisation. JavaScript hat viele verschiedene Implementierungen von vielen verschiedenen Anbietern (z. B. Google, Microsoft, Oracle usw.). Das Ziel von JavaScript ist es, die Verkehrssprache des Webs zu sein.

TypeScript ist eine Obermenge der JavaScript-Sprache, die über einen einzigen Open-Source-Compiler verfügt und hauptsächlich von einem einzigen Anbieter entwickelt wird: Microsoft. Das Ziel von TypeScript ist es, Fehler frühzeitig durch ein Typensystem zu erkennen und die JavaScript-Entwicklung effizienter zu gestalten.

Im Wesentlichen erreicht TypeScript seine Ziele auf drei Arten:

  1. Unterstützung für moderne JavaScript-Funktionen - Die JavaScript-Sprache (nicht die Laufzeit) ist durch die ECMAScript- Standards standardisiert. Nicht alle Browser und JavaScript-Laufzeiten unterstützen alle Funktionen aller ECMAScript-Standards (siehe diese Übersicht ). TypeScript ermöglicht die Verwendung vieler der neuesten ECMAScript-Funktionen und übersetzt sie in ältere ECMAScript-Ziele Ihrer Wahl (siehe Liste der Kompilierungsziele unter der --targetCompileroption). Dies bedeutet, dass Sie neue Funktionen wie Module, Lambda-Funktionen, Klassen, den Spread-Operator und die Destrukturierung sicher verwenden können, während Sie mit älteren Browsern und JavaScript-Laufzeiten abwärtskompatibel bleiben.

  2. Erweitertes Typsystem - Die Typunterstützung ist nicht Teil des ECMAScript-Standards und wird wahrscheinlich niemals auf die interpretierte Natur anstatt auf die kompilierte Natur von JavaScript zurückzuführen sein. Das Typsystem von TypeScript ist unglaublich umfangreich und umfasst: Schnittstellen, Aufzählungen, Hybridtypen, Generika, Vereinigungs- / Schnittpunkttypen, Zugriffsmodifikatoren und vieles mehr. Die offizielle Website von TypeScript bietet einen Überblick über diese Funktionen. Das Typensystem von Typescript ist den meisten anderen typisierten Sprachen ebenbürtig und in einigen Fällen wohl leistungsfähiger.

  3. Unterstützung für Entwicklertools - Der TypeScript-Compiler kann als Hintergrundprozess ausgeführt werden, um sowohl die inkrementelle Kompilierung als auch die IDE-Integration zu unterstützen, sodass Sie einfacher navigieren, Probleme identifizieren, Möglichkeiten prüfen und Ihre Codebasis umgestalten können.

Die Beziehung von TypeScript zu anderen JavaScript-Zielsprachen

TypeScript hat eine einzigartige Philosophie im Vergleich zu anderen Sprachen, die mit JavaScript kompiliert werden. JavaScript-Code ist gültiger TypeScript-Code. TypeScript ist eine Obermenge von JavaScript. Sie können Ihre .jsDateien fast in .tsDateien umbenennen und TypeScript verwenden (siehe "JavaScript-Interoperabilität" weiter unten). TypeScript-Dateien werden zu lesbarem JavaScript kompiliert, sodass eine Rückmigration möglich ist und das Verständnis des kompilierten TypeScript überhaupt nicht schwierig ist. TypeScript baut auf den Erfolgen von JavaScript auf und verbessert seine Schwächen.

Einerseits verfügen Sie über zukunftssichere Tools, die moderne ECMAScript-Standards verwenden und diese auf ältere JavaScript-Versionen kompilieren, wobei Babel die beliebteste ist. Auf der anderen Seite gibt es Sprachen, die sich möglicherweise vollständig von JavaScript unterscheiden und auf JavaScript abzielen, z. B. CoffeeScript, Clojure, Dart, Elm, Haxe, Scala.js und eine ganze Reihe weiterer Hosts (siehe diese Liste)). Obwohl diese Sprachen möglicherweise besser sind als die Zukunft von JavaScript, besteht ein höheres Risiko, dass sie nicht genügend Akzeptanz finden, damit ihre Zukunft garantiert werden kann. Möglicherweise haben Sie auch größere Probleme, erfahrene Entwickler für einige dieser Sprachen zu finden, obwohl diejenigen, die Sie finden, oft enthusiastischer sind. Interop mit JavaScript kann auch etwas komplizierter sein, da sie weiter von dem entfernt sind, was JavaScript eigentlich ist.

TypeScript liegt zwischen diesen beiden Extremen und gleicht so das Risiko aus. TypeScript ist in keiner Weise eine riskante Wahl. Es ist sehr mühelos, sich daran zu gewöhnen, wenn Sie mit JavaScript vertraut sind, da es sich nicht um eine völlig andere Sprache handelt, eine hervorragende Unterstützung für die Interoperabilität von JavaScript bietet und in letzter Zeit viel Akzeptanz gefunden hat.

Optional statische Typisierung und Typinferenz

JavaScript wird dynamisch eingegeben. Dies bedeutet, dass JavaScript nicht weiß, um welchen Typ es sich bei einer Variablen handelt, bis sie zur Laufzeit tatsächlich instanziiert wird. Dies bedeutet auch, dass es möglicherweise zu spät ist. TypeScript erweitert JavaScript um Typunterstützung. Fehler, die durch falsche Annahmen einer Variablen eines bestimmten Typs verursacht werden, können vollständig beseitigt werden, wenn Sie Ihre Karten richtig spielen (wie streng Sie Ihren Code eingeben oder ob Sie Ihren Code überhaupt eingeben, liegt bei Ihnen).

TypeScript macht das Schreiben durch die Verwendung von Typinferenz etwas einfacher und weniger explizit. Zum Beispiel: var x = "hello"in TypeScript ist das gleiche wie var x : string = "hello". Der Typ wird einfach aus seiner Verwendung abgeleitet. Auch wenn Sie die Typen nicht explizit eingeben, sind sie immer noch vorhanden, um Sie davor zu bewahren, etwas zu tun, das sonst zu einem Laufzeitfehler führen würde.

TypeScript wird optional standardmäßig eingegeben. Zum Beispiel function divideByTwo(x) { return x / 2 }ist eine gültige Funktion in TypeScript, die mit jeder Art von Parameter aufgerufen werden kann, obwohl das Aufrufen mit einer Zeichenfolge offensichtlich zu einem Laufzeitfehler führt. Genau wie Sie es in JavaScript gewohnt sind. Dies funktioniert, da TypeScript den Typ implizit zuweist, wenn kein Typ explizit zugewiesen wurde und der Typ nicht abgeleitet werden konnte, wie im Beispiel dividierenByTwo any. Dies bedeutet, dass die Typensignatur der Funktion dividByTwo automatisch wird function divideByTwo(x : any) : any. Es gibt ein Compiler-Flag, das dieses Verhalten nicht zulässt : --noImplicitAny. Das Aktivieren dieses Flags bietet Ihnen ein höheres Maß an Sicherheit, bedeutet aber auch, dass Sie mehr tippen müssen.

Mit Typen sind Kosten verbunden. Erstens gibt es eine Lernkurve, und zweitens kostet es Sie natürlich etwas mehr Zeit, eine Codebasis mit der richtigen strengen Eingabe einzurichten. Nach meiner Erfahrung sind diese Kosten für jede ernsthafte Codebasis, die Sie mit anderen teilen, absolut wert. Eine groß angelegte Studie über Programmiersprachen und Codequalität in Github legt nahe, dass "statisch typisierte Sprachen im Allgemeinen weniger fehleranfällig sind als dynamische Typen und dass eine starke Typisierung in derselben Hinsicht besser ist als eine schwache Typisierung".

Es ist interessant festzustellen, dass in diesem Artikel festgestellt wird, dass TypeScript weniger fehleranfällig ist als JavaScript:

Für diejenigen mit positiven Koeffizienten können wir erwarten, dass die Sprache ceteris paribus mit einer größeren Anzahl von Fehlerkorrekturen assoziiert ist. Diese Sprachen umfassen C, C ++, JavaScript , Objective-C, PHP und Python. Die Sprachen Clojure, Haskell, Ruby, Scala und TypeScript weisen alle negative Koeffizienten auf, was bedeutet, dass diese Sprachen weniger wahrscheinlich als der Durchschnitt zu Fehlern bei der Fehlerbehebung führen.

Erweiterte IDE-Unterstützung

Die Entwicklungserfahrung mit TypeScript ist eine große Verbesserung gegenüber JavaScript. Die IDE wird vom TypeScript-Compiler in Echtzeit über ihre umfangreichen Typinformationen informiert. Dies bietet einige wesentliche Vorteile. Mit TypeScript können Sie beispielsweise sicher Refactorings wie Umbenennungen in Ihrer gesamten Codebasis durchführen. Durch die Vervollständigung des Codes erhalten Sie Inline-Hilfe zu den Funktionen, die eine Bibliothek möglicherweise bietet. Sie müssen sich nicht mehr an sie erinnern oder sie in Online-Referenzen nachschlagen. Kompilierungsfehler werden direkt in der IDE mit einer roten, schnörkellosen Linie gemeldet, während Sie mit dem Codieren beschäftigt sind. Alles in allem ermöglicht dies einen erheblichen Produktivitätsgewinn im Vergleich zur Arbeit mit JavaScript. Man kann mehr Zeit mit Codieren und weniger Zeit mit Debuggen verbringen.

Es gibt eine Vielzahl von IDEs, die TypeScript hervorragend unterstützen, wie Visual Studio Code, WebStorm, Atom und Sublime.

Strenge Nullprüfungen

Laufzeitfehler des Formulars cannot read property 'x' of undefinedoder undefined is not a functionwerden sehr häufig durch Fehler im JavaScript-Code verursacht. Standardmäßig reduziert TypeScript bereits die Wahrscheinlichkeit, dass solche Fehler auftreten, da keine Variable verwendet werden kann, die dem TypeScript-Compiler nicht bekannt ist (mit Ausnahme der Eigenschaften anytypisierter Variablen). Es ist jedoch immer noch möglich, fälschlicherweise eine Variable zu verwenden, die auf eingestellt ist undefined. Mit der 2.0-Version von TypeScript können Sie diese Art von Fehlern jedoch durch die Verwendung von nicht nullbaren Typen beseitigen. Dies funktioniert wie folgt:

Wenn strenge Nullprüfungen aktiviert sind ( --strictNullChecksCompiler-Flag), kann der TypeScript-Compiler undefinedeiner Variablen nur zugewiesen werden, wenn Sie sie ausdrücklich als nullbar deklarieren. Zum Beispiel let x : number = undefinedwird in einem Compiler - Fehlern führen. Dies passt perfekt zur Typentheorie, da undefinedes sich nicht um eine Zahl handelt. Man kann definieren x, um ein Summentyp zu sein numberund dies undefinedzu korrigieren : let x : number | undefined = undefined.

Sobald bekannt ist, dass ein Typ nullwertfähig ist, dh von einem Typ, der auch den Wert haben kann, nulloder undefinedder TypeScript-Compiler kann durch eine auf dem Kontrollfluss basierende Typanalyse bestimmen, ob Ihr Code eine Variable sicher verwenden kann oder nicht. Mit anderen Worten, wenn Sie überprüfen, ob eine Variable undefinedbeispielsweise eine ifAnweisung durchläuft, schließt der TypeScript-Compiler, dass der Typ in diesem Zweig des Kontrollflusses Ihres Codes nicht mehr nullwertfähig ist und daher sicher verwendet werden kann. Hier ist ein einfaches Beispiel:

let x: number | undefined;
if (x !== undefined) x += 1; // this line will compile, because x is checked.
x += 1; // this line will fail compilation, because x might be undefined.

Während des Builds gab der Co-Designer der Konferenz 2016 von TypeScript Anders Hejlsberg eine detaillierte Erklärung und Demonstration dieser Funktion: Video (von 44:30 bis 56:30).

Zusammenstellung

Um TypeScript verwenden zu können, benötigen Sie einen Erstellungsprozess zum Kompilieren in JavaScript-Code. Der Erstellungsprozess dauert in der Regel nur einige Sekunden, abhängig von der Größe Ihres Projekts. Der TypeScript-Compiler unterstützt die inkrementelle Kompilierung ( --watchCompiler-Flag), sodass alle nachfolgenden Änderungen schneller kompiliert werden können.

Der TypeScript-Compiler kann Quellzuordnungsinformationen in die generierten .js-Dateien einbinden oder separate .map-Dateien erstellen. Quellzuordnungsinformationen können durch Debuggen von Dienstprogrammen wie Chrome DevTools und anderen IDEs verwendet werden, um die Zeilen im JavaScript mit denen zu verknüpfen, die sie im TypeScript generiert haben. Auf diese Weise können Sie Haltepunkte festlegen und Variablen zur Laufzeit direkt in Ihrem TypeScript-Code überprüfen. Quellkarteninformationen funktionieren ziemlich gut, es gab sie schon lange vor TypeScript, aber das Debuggen von TypeScript ist im Allgemeinen nicht so gut wie bei direkter Verwendung von JavaScript. Nehmen Sie thiszum Beispiel das Schlüsselwort. Aufgrund der thisseit ES2015 geänderten Semantik des Schlüsselworts um Schließungen thiskann es tatsächlich zur Laufzeit als aufgerufene Variable existieren _this(siehe diese Antwort). Dies kann Sie beim Debuggen verwirren, ist jedoch im Allgemeinen kein Problem, wenn Sie davon wissen oder den JavaScript-Code überprüfen. Es sollte beachtet werden, dass Babel genau das gleiche Problem hat.

Der TypeScript-Compiler kann noch einige andere Tricks ausführen, z. B. das Generieren von Abfangcode basierend auf Dekoratoren , das Generieren von Modulladecode für verschiedene Modulsysteme und das Parsen von JSX . Neben dem Typescript-Compiler benötigen Sie jedoch wahrscheinlich ein Build-Tool. Wenn Sie beispielsweise Ihren Code komprimieren möchten, müssen Sie Ihrem Erstellungsprozess andere Tools hinzufügen, um dies zu tun.

Es gibt TypeScript-Kompilierungs-Plugins für Webpack , Gulp , Grunt und so ziemlich jedes andere JavaScript-Build-Tool. Die TypeScript-Dokumentation enthält einen Abschnitt zur Integration in Build-Tools , der alle Aspekte abdeckt. Ein Linter ist auch verfügbar, falls Sie noch mehr Bauzeit prüfen möchten. Es gibt auch eine große Anzahl von Seed-Projekten, mit denen Sie mit TypeScript in Kombination mit einer Reihe anderer Technologien wie Angular 2, React, Ember, SystemJS, Webpack, Gulp usw. beginnen können.

JavaScript-Interoperabilität

Da TypeScript so eng mit JavaScript verwandt ist, verfügt es über hervorragende Interoperabilitätsfunktionen. Für die Arbeit mit JavaScript-Bibliotheken in TypeScript ist jedoch zusätzliche Arbeit erforderlich. Typoskript Definitionen sind erforderlich , damit das Typoskript Compiler versteht , dass Funktionsaufrufe wie _.groupByoder angular.copyoder $.fadeOutsind nicht in der Tat illegal Aussagen. Die Definitionen für diese Funktionen werden in .d.tsDateien abgelegt.

Die einfachste Form, die eine Definition annehmen kann, besteht darin, die Verwendung eines Bezeichners in irgendeiner Weise zuzulassen. Wenn Sie beispielsweise Lodash verwenden , können Sie mit einer einzelnen Zeilendefinitionsdateideclare var _ : any jede gewünschte Funktion aufrufen _, aber dann können Sie natürlich auch noch Fehler machen: _.foobar()Dies wäre ein legaler TypeScript-Aufruf, ist es aber natürlich , ein illegaler Anruf zur Laufzeit. Wenn Sie eine ordnungsgemäße Typunterstützung und Code-Vervollständigung wünschen, muss Ihre Definitionsdatei genauer sein ( ein Beispiel finden Sie unter lodash-Definitionen ).

Npm-Module , die mit ihren eigenen Typdefinitionen vorgepackt sind, werden vom TypeScript-Compiler automatisch verstanden (siehe Dokumentation ). Für so ziemlich jede andere halbpopuläre JavaScript-Bibliothek, die keine eigenen Definitionen enthält, hat jemand bereits Typdefinitionen über ein anderes npm-Modul verfügbar gemacht. Diesen Modulen wird "@ types /" vorangestellt und sie stammen aus einem Github-Repository namens DefinitelyTyped .

Es gibt eine Einschränkung: Die Typdefinitionen müssen mit der Version der Bibliothek übereinstimmen, die Sie zur Laufzeit verwenden. Wenn dies nicht der Fall ist, können Sie mit TypeScript möglicherweise keine Funktion aufrufen oder eine vorhandene Variable dereferenzieren oder eine Funktion aufrufen oder eine nicht vorhandene Variable dereferenzieren, einfach weil die Typen zur Kompilierungszeit nicht mit der Laufzeit übereinstimmen . Stellen Sie daher sicher, dass Sie die richtige Version der Typdefinitionen für die richtige Version der von Ihnen verwendeten Bibliothek laden.

Um ehrlich zu sein, ist dies ein wenig problematisch, und dies kann einer der Gründe sein, warum Sie sich nicht für TypeScript entscheiden, sondern sich für etwas wie Babel entscheiden, das überhaupt nicht unter Typdefinitionen leiden muss. Wenn Sie jedoch wissen, was Sie tun, können Sie problemlos alle Probleme lösen, die durch falsche oder fehlende Definitionsdateien verursacht werden.

Konvertieren von JavaScript in TypeScript

Jede .jsDatei kann in eine .tsDatei umbenannt und über den TypeScript-Compiler ausgeführt werden, um syntaktisch denselben JavaScript-Code wie eine Ausgabe zu erhalten (sofern dieser überhaupt syntaktisch korrekt war). Selbst wenn der TypeScript-Compiler Kompilierungsfehler erhält, wird dennoch eine .jsDatei erstellt. Es kann sogar .jsDateien als Eingabe mit dem --allowJsFlag akzeptieren . Auf diese Weise können Sie sofort mit TypeScript beginnen. Leider treten am Anfang wahrscheinlich Kompilierungsfehler auf. Man muss bedenken, dass dies keine Show-Stop-Fehler sind, wie Sie es von anderen Compilern gewohnt sind.

Die Kompilierungsfehler, die am Anfang beim Konvertieren eines JavaScript-Projekts in ein TypeScript-Projekt auftreten, sind von Natur aus unvermeidbar. TypeScript überprüft den gesamten Code auf Gültigkeit und muss daher alle verwendeten Funktionen und Variablen kennen. Daher müssen für alle Typdefinitionen vorhanden sein, da sonst zwangsläufig Kompilierungsfehler auftreten. Wie im obigen Kapitel erwähnt, gibt es für so ziemlich jedes JavaScript-Framework .d.tsDateien, die mit der Installation von DefinitelyTyped-Paketen leicht abgerufen werden können. Es kann jedoch sein, dass Sie eine obskure Bibliothek verwendet haben, für die keine TypeScript-Definitionen verfügbar sind, oder dass Sie einige JavaScript-Grundelemente mehrfach ausgefüllt haben. In diesem Fall müssen Sie Typdefinitionen für diese Bits angeben, damit die Kompilierungsfehler verschwinden. Erstellen Sie einfach eine .d.tsDatei und fügen Sie sie in das filesArray von tsconfig.json ein , damit sie vom TypeScript-Compiler immer berücksichtigt wird. Deklarieren Sie darin die Bits, die TypeScript nicht als Typ kennt any. Sobald Sie alle Fehler beseitigt haben, können Sie diese Teile nach Ihren Wünschen schrittweise eingeben.

Einige Arbeiten zur (Neu-) Konfiguration Ihrer Build-Pipeline sind ebenfalls erforderlich, um TypeScript in die Build-Pipeline zu integrieren. Wie im Kapitel über die Kompilierung erwähnt, gibt es viele gute Ressourcen, und ich empfehle Ihnen, nach Startprojekten zu suchen, die die Kombination von Tools verwenden, mit denen Sie arbeiten möchten.

Die größte Hürde ist die Lernkurve. Ich ermutige Sie, zunächst mit einem kleinen Projekt herumzuspielen. Schauen Sie, wie es funktioniert, wie es erstellt, welche Dateien es verwendet, wie es konfiguriert ist, wie es in Ihrer IDE funktioniert, wie es strukturiert ist, welche Tools es verwendet usw. Wenn Sie wissen, ist es möglich, eine große JavaScript-Codebasis in TypeScript zu konvertieren was machst du. Lesen Sie diesen Blog zum Beispiel über die Konvertierung von 600.000 Zeilen in Typoskript in 72 Stunden . Stellen Sie einfach sicher, dass Sie die Sprache gut verstehen, bevor Sie den Sprung machen.

Annahme

TypeScript ist Open Source (Apache 2 lizenziert, siehe GitHub ) und wird von Microsoft unterstützt. Anders Hejlsberg , der leitende Architekt von C #, leitet das Projekt. Es ist ein sehr aktives Projekt; Das TypeScript-Team hat in den letzten Jahren viele neue Funktionen veröffentlicht, und es sind noch viele großartige geplant (siehe Roadmap ).

Einige Fakten zu Adoption und Popularität:

  • In der StackOverflow-Entwicklerumfrage 2017 war TypeScript der beliebteste JavaScript-Transpiler (9. Platz insgesamt) und gewann den dritten Platz in der beliebtesten Programmiersprachenkategorie.
  • In der Umfrage zum Stand von js im Jahr 2018 wurde TypeScript als einer der beiden großen Gewinner in der Kategorie JavaScript-Aromen deklariert (wobei ES6 der andere ist).
  • In der StackOverlow-Deverloper-Umfrage 2019 stieg TypeScript unter professionellen Entwicklern auf den 9. Platz der beliebtesten Sprachen und überholte sowohl C als auch C ++. Es belegte erneut den dritten Platz unter den beliebtesten Sprachen.
Lodewijk Bogaards
quelle
25
"JavaScript-Code ist gültiger TypeScript-Code" - das ist eigentlich nicht immer wahr. Ich meine Code wie if (1 === '1') {} gibt Ihnen einen Fehler in TS und in JS nicht. Aber meistens ist es wahr, wenn JS-Code gut geschrieben ist.
Maciej Bukowski
3
Wenn Sie Ihre kostbare produktive Zeit verloren haben, weil Sie sich über ein fehlendes Semikolon Sorgen gemacht haben, ist das Schreiben in Typescript ein Lebensretter.
SoSufi
3
Typisierungen wurden veraltet, und die derzeitige bewährte Methode besteht darin, nur npm(oder yarn) install @types/foo. Können Sie Ihre Antwort aktualisieren?
Jed Fox
13
TL; DR würde in dieser Antwort
sparen
8
@MaciejBukowski Auch wenn sich TypeScript in diesem Fall tatsächlich beschwert, erhalten Sie dennoch eine gültige JS-Ausgabe (dies ist der JS-Code, den Sie mit TypeScript kompiliert / transpiliert haben). Es handelt sich also um eine "Kompilierung mit Fehler" und nicht um ungültiges TypeScript. In der TypeScript-Spezifikation steht, dass jeder gültige JS-Code ein gültiger TS-Code sein muss.
Pac0
83

TypeScript macht etwas Ähnliches wie weniger oder sass für CSS. Sie sind super Mengen davon, was bedeutet, dass jeder JS-Code, den Sie schreiben, gültiger TypeScript-Code ist. Außerdem können Sie die anderen Extras verwenden, die der Sprache hinzugefügt werden, und der transpilierte Code ist gültig. Sie können sogar die JS-Version festlegen, für die der resultierende Code verwendet werden soll.

Derzeit ist TypeScript ein Super-Set von ES2015, daher ist es möglicherweise eine gute Wahl, die neuen js-Funktionen zu erlernen und auf den für Ihr Projekt erforderlichen Standard umzustellen.

lebobbi
quelle
4
Beste TL; DR ist die Seite von TS: "TypeScript ist eine typisierte Obermenge von JavaScript, die zu einfachem JavaScript kompiliert wird."
Juan Mendes
1
Es beantwortet jedoch nicht das "Warum sollte ich es verwenden". Hier wäre das tl; dr: 1) Hinzufügen optionaler statischer Typen zu JavaScript. Typen können helfen, Fehler beim Kompilieren zu erkennen und Ihr Programm besser zu dokumentieren. 2) Sie können das neue JavaScript (ES6 / ES7 / ESnext) schreiben und es wieder in ES5 kompilieren, was zur Unterstützung älterer Browser erforderlich ist. Ich habe ein bisschen mehr unter tsmean.com/articles/vs/typescript-vs-javascript für diejenigen ausgearbeitet, die an mehr als einem tl; dr
bersling
1
"Der transpilierte Code ist ein gültiger JS" - und das ist die Achillesferse von TypeScript, wenn Sie mich fragen. Dies bedeutet, dass sie JS nicht mehrere sehr nützliche Funktionen hinzufügen können. vor allem Laufzeit- Typprüfung. Es ist etwas ärgerlich, Sicherheit vom Typ Compiler-Zeit zu haben, nur um sie für Laufzeitdaten zu verlieren, die von E / A eingelesen werden, oder wenn Ihr transpilierter Code von anderen JS unsicher aufgerufen wird.
Jez
44

" TypeScript Fundamentals " - ein Pluralsight-Videokurs von Dan Wahlin und John Papa ist ein wirklich guter, derzeit (25. März 2016) aktualisierter TypeScript 1.8, eine Einführung in Typescript.

Für mich sind die wirklich guten Funktionen neben den netten Möglichkeiten für Intellisense die Klassen , Schnittstellen , Module , die einfache Implementierung von AMD und die Möglichkeit, den Visual Studio Typescript-Debugger zu verwenden, wenn er mit IE aufgerufen wird.

Zusammenfassend : Bei bestimmungsgemäßer Verwendung kann Typescript die JavaScript-Programmierung zuverlässiger und einfacher machen. Dies kann die Produktivität des JavaScript-Programmiergeräts gegenüber dem gesamten SDLC erheblich steigern.

Dimitre Novatchev
quelle
9
Was ist SDLC? AMD?
Oooogi
15
@Oooogi, SDLC == Lebenszyklus der Softwareentwicklung. AMD == Asynchrone Moduldefinition. Letzteres ist spezifisch für JavaScript, während Ersteres eher allgemein gehalten ist.
Dimitre Novatchev
2
"Einfache Implementierung von AMD, ..." - Ich habe das gelesen und dachte, es sei eine Art Threadripper-Optimierung oder so.
jrh
15

Ecma-Skript 5 (ES5), das alle Browser unterstützen und vorkompilieren. ES6 / ES2015 und ES / 2016 haben dieses Jahr viele Änderungen vorgenommen. Um diese Änderungen anzuzeigen, gibt es etwas dazwischen, das sich um TypeScript kümmern sollte.

• TypeScript ist Types -> Bedeutet, dass wir den Datentyp jeder Eigenschaft und Methode definieren müssen. Wenn Sie C # kennen, ist Typescript leicht zu verstehen.

• Der große Vorteil von TypeScript besteht darin, dass wir typbezogene Probleme frühzeitig identifizieren, bevor wir zur Produktion gehen. Auf diese Weise können Komponententests fehlschlagen, wenn eine Typinkongruenz vorliegt.

Mayank Jain
quelle
2
Es ist nicht jedes Jahr Kumpel! .. sie haben die Spezifikation nach sehr langem Warten
geändert
... und diese Änderungen können Sie damit korrelieren, dass Microsoft seine Finger darauf legt. ;-)
Trober
2
@SubhamTripathi Es ist sehr viel ist jedes Jahr. ES2015, ES2016, ES2017 und von nun an bis die Sprache stirbt. Es war nicht jedes Jahr vor 2015, aber jetzt. Suchen Sie nach "TC39-Prozess", um mehr zu erfahren.
Daemonexmachina
1
Gab es eine große Nachfrage nach Typprüfungen in der Javascript-Community? Ich hatte nur nicht viele Fehler im Zusammenhang mit der Typprüfung.
Box und Cox