Warum Sie (wahrscheinlich) Typescript verwenden sollten
Dominik Grzedzielski
Senior Software Engineer
Jeder, der das JavaScript-Ökosystem nutzt, ist sich heutzutage der Bedeutung von Typescript bewusst. Typescript ist eine der beliebtesten Technologien* und ihre Nutzung nimmt ständig zu (der Nutzungsanteil stieg von 52% im Jahr 2018 auf 78% im Jahr 2020)*.
Die derzeitige Position von Typescript kommt nicht von ungefähr, denn diese Technologie ist in der Lage, die Erfahrung der Entwickler zu verbessern. Explizitere Kodierung erhöht die Kontrolle und Vorhersagbarkeit von Code. In diesem Artikel werde ich versuchen, Sie von der Verwendung von Typescript zu überzeugen.
Wenn Sie eine Anwendung in der Regel in JavaScriptkönnte Ihr Fluss sehen so aus:
Ändern Sie etwas,
Rufen Sie die App auf und sehen Sie sich den geänderten Teil / Run (related) tests an.
Finden Sie heraus, ob alles in Ordnung ist.
Mit Typescript können Sie die Änderung tatsächlich vornehmen, und wenn es irgendwelche Typfehler in Ihrem Code, werden Sie dank der Compiler-Fehlermeldung oder der Echtzeit-Rückmeldung der IDE sofort wissen. Natürlich wird der Typescript-Compiler nicht jedes Problem lösen und nicht vor allen Fehlern warnen, aber seine Hilfe kann von unschätzbarem Wert sein.
Bessere Syntaxvervollständigung in IDEs
Es ist wirklich einfach. Wenn Sie gute IDEs wie WebStorm oder VSCode verwenden, werden Sie bessere Syntaxvervollständigung mit Typescript. Vielleicht hört sich das nicht nach einer großen Verbesserung für die Entwickler an, aber letztendlich ist jede einzelne Verbesserung wichtig, da sie uns etwas Zeit ersparen und wiederum einen Tippfehler oder einen Fehler verhindern kann. Außerdem können wir unseren Typ oder unsere Schnittstelle einmal definieren; da wir uns nicht immer an die Struktur erinnern müssen, können wir uns auf das Schreiben der Geschäftslogik konzentrieren.
Weniger schmerzhaftes Refactoring
Stellen Sie sich vor, dass Sie aus irgendeinem Grund eine Umstrukturierung vornehmen müssen, z. B. weil Sie einer Projekt und Sie erhalten die Aufgabe, eine neue Funktion hinzuzufügen, aber diese Funktion ist in irgendeiner Weise mit altem Code verbunden. Mit Typescript ist es einfacher und weniger schmerzhaft, denn wenn Sie eine Änderung vornehmen und es eine weitere Stelle gibt, an der Sie eine weitere Änderung vornehmen müssen, wird der Compiler Sie davor warnen.
Zum Beispiel könnte es sich um eine geänderte Funktionssignatur handeln oder vielleicht nach der Änderung um eine Funktion wird etwas völlig anderes zurückgeben, so dass auch der zurückgegebene Typ unterschiedlich ist.
Mehr Vertrauen in die Codebase
JavaScript ist schwach und dynamisch typisiert, wenn Sie also eine Variable mit dem Wert let Abfrage = '' Später im Code kann der Entwickler aus Versehen etwas Irrationales tun, zum Beispiel Abfrage = trueund es wird gültiger JS-Code sein.
In einem gut geschriebenen Code sollte die Zuweisung eines booleschen Wertes an eine Variable, die zuvor eine Zeichenkette war, nicht vorkommen. Diese Zuweisung mit Typänderung ist also in der Regel auf einen Fehler zurückzuführen.
Bei der Verwendung von Typescript können wir den Typ der Variablen nicht ändern. Wenn wir also die Variable let Abfrage = '' variabel ist, wird sie String Typ und wir können den Typ nicht versehentlich ändern.
Wenn eine Variable mehr als einen Typ haben soll, müssen wir dies explizit mit union type tun, zum Beispiel Zeichenkette | Zahl.
Daher macht Typescript unseren Code vorhersehbarer und eindeutiger. Außerdem achtet Typescript bei der Kontrollflussanalyse auf Explizitheit und warnt Sie, wenn etwas schief gehen könnte.
Hier im Beispiel im ersten wenn Block erhalten wir eine Fehlermeldung:
TS2339: Die Eigenschaft 'battery' existiert nicht für den Typ 'ClothingProduct'. 2 Mal, für Batterieund ram Eigenschaften.
Im zweiten Block - sonsterhalten wir die Fehlermeldung für Größe Eigentum. Natürlich ist dies nur ein Beispiel, um Ihnen zu zeigen, wie diskriminierte Gewerkschaften und Kontrollflussanalyse arbeiten in Typescript, so dass wir mit diesem Code nichts allzu Kompliziertes anstellen werden.
Einfache, schrittweise Migration von JavaScript
Gültiger JavaScript-Code ist gleichzeitig auch gültiger Typescript-Code, so dass Sie Ihre Codebasis Schritt für Schritt migrieren können. Normalerweise ist die Verwendung des Strict-Modus in Typescript eine gute Praxis, aber in diesem Fall, müssen wir beginnen mit "strict": false in tsconfig.json und wir sollten auch 2 weitere Optionen einstellen.
"allowJs": true, // erlaubt die Verwendung von .js-Dateien und der Typ wird darin nicht überprüft
"skipLibCheck": true // überspringt die Überprüfung von Typen in Bibliotheken, die wir verwenden
Mit diesen Optionen können wir Schritt für Schritt von JS zu TS migrieren - Datei für Datei, indem wir einfach die Erweiterung von .js(x) zu .ts(x) und das Hinzufügen von Typen in den Dateien. Mit diesem Ansatz können wir Hunderte oder Tausende von erschreckenden Kompilierungsfehlern vermeiden.
Zusammenfassung
Ich denke, wir sollten die Typoskript so oft wie möglichweil es auf lange Sicht wirklich von Vorteil ist. Es hilft, Projekte zu pflegen, erhöht die Erfahrung der Entwickler und macht unsere Codebasis eindeutiger und zuverlässiger.
Aber wie immer gibt es Ausnahmen - zum Beispiel für eine einfache Landing Page wo JavaScript nur zum Umschalten der Klasse oder einem anderen einfachen Fall verwendet wird, macht Typescript keinen Sinn. Außerdem müssen wir bedenken, dass wir, um die Vorteile von Typescript voll ausschöpfen zu können, lernen müssen, es auf einem ausreichenden Niveau zu nutzen, und das kann einige Zeit dauern. Ich denke, es ist immer noch eine sehr lohnende Investition Ihrer Zeit.