Heim >Web-Frontend >js-Tutorial >Warum sollten Sie TypeScript lernen und JavaScript aufgeben? TypeScript vs. JavaScript

Warum sollten Sie TypeScript lernen und JavaScript aufgeben? TypeScript vs. JavaScript

Barbara Streisand
Barbara StreisandOriginal
2024-11-15 00:53:02541Durchsuche

Sie sind nicht mit JavaScript verheiratet, egal wie sehr Sie es lieben, Sie müssen es mit TypeScript versuchen. Vielleicht haben Sie keinen Grund umzuziehen, aber ich nehme Sie mit auf eine Reise, auf der Sie TypeScript ein wenig ausprobieren möchten. Ich kann Ihnen mehr als 13 Gründe nennen, warum Sie auf TypeScript umsteigen sollten, aber zunächst werde ich versuchen, Sie in 5 Punkten davon zu überzeugen, auf TypeScript umzusteigen. Dabei werde ich Ihnen erklären, warum TypeScript für die Entwicklung viel besser ist als JavaScript Warum Sie TypeScript für Ihr nächstes Projekt wählen sollten.

Streng typisiertes JavaScript

Why you should learn TypeScript and ditch JavaScript? TypeScript vs JavaScript

TypeScript ist nichts anderes als nur ein streng typisiertes Javascript. Einer der Gründe, warum ich JavaScript hasse (ja, ich hasse es), ist, dass die Sprache so flexibel ist, dass es keine Regeln und Vorschriften gibt, man jeden Mist schreiben kann und es keinen Fehler gibt (Ausnahmen gibt es). Wenn Sie beispielsweise eine Variable erstellt und ihr eine Zahl als Wert zugewiesen haben, beispielsweise 6, können Sie später derselben Variablen eine Funktion zuweisen und diese Variable sogar aufrufen. Das kommt mir auf jeden Fall etwas komisch vor, mal sehen, was TypeScript hat damit zu tun es.

Wenn Sie in Typoskript eine Variable definieren, müssen Sie ihren Typ angeben, so wie die Variable eine Zahl, ein Array, eine Zeichenfolge oder irgendetwas anderes speichert. Sobald Sie dies getan haben, können Sie nichts mehr darin speichern, sonst lässt TypeScript Sie nicht weiter, und TypeScript ist dabei streng.

let age: number;
age = 25;

Selbst wenn Sie den Typ der Variablen nicht angeben und ihr keinen Wert zuweisen, ist es zu intelligent, dass es den Typ automatisch anhand des angegebenen Werts ermittelt und sich daran erinnert.

let age = 10;

age = "Donald Trump"
~~~
// Type '"Donald Trump"' is not assignable to type 'number'.(2322)

Wenn Sie Sprachen wie C/C kennen, ist der Typ dort als int age definiert; In ähnlicher Weise definieren wir in TypeScript den Typ nach dem Namen der Variablen, gefolgt von einem Doppelpunkt, etwa so: let age: number;. Auf diese Weise haben wir TypeScript einfach vollgestopft, ohne die JavaScript-Syntax zu ändern. Das habe ich Ihnen am Anfang gesagt: TypeScript ist nichts anderes als JavaScript, nur mit Typen. Ich werde mich nicht auf die Syntax von Typoskript konzentrieren, sie ist nicht Gegenstand dieses Artikels.

Wenn es nun JS wäre, könnten Sie mit dem Alter alles machen, ihm Ihren Namen oder ein Array oder sogar eine Funktion zuweisen, aber in TS bleibt es eine Zahl, sobald es als Zahl geboren ist , sonst nichts. Wenn Sie dies tun, erhalten Sie sofort eine Fehlermeldung, aber in JS wird dies toleriert, solange Sie nicht etwas Illegales tun, z. B. age aufrufen, ohne ihm eine Funktion zuzuweisen, oder auf die .length-Eigenschaft zugreifen, wenn dies der Fall ist eine Funktion.

Auf den ersten Blick mag es Ihnen vielleicht nicht lohnenswert erscheinen, von JS zu TS zu wechseln, aber sobald Sie es vollständig verstanden haben, wollten Sie wegen dieser Funktion nie mehr in JS programmieren.

Weil Sie Fehler brauchen.

Why you should learn TypeScript and ditch JavaScript? TypeScript vs JavaScript

Wenn ich sage, dass Sie Fehler brauchen, heißt das nicht, dass ich möchte, dass Sie fehlerhafte Codes schreiben, aber der Code, den Sie geschrieben haben, muss fehlerfrei sein, und dafür ist es die Aufgabe Ihrer Entwicklungsumgebung, Ihnen dies zu geben Fehler. Und bei JS ist das einfach nicht der Fall, das ist einer der Gründe, warum die Leute es lieben und es gleichzeitig auch hassen. Wenn ich Fehler sage, meine ich alles außer Syntaxfehlern. JS gibt keine Fehlermeldung aus, wenn Sie etwas Falsches schreiben, aber es gibt eine Fehlermeldung aus, wenn etwas Falsches passiert. Wenn also ein Teil Ihres Codes zum Zeitpunkt des Tests nicht ausgeführt wird, müssen Sie sich auf einige Probleme bei der Produktion einstellen. :)
Sehen wir uns ein Beispiel an

Ich schreibe einen Code zum Multiplizieren zweier Zahlen. Ich mache das sowohl in JS als auch in TS, und Sie werden sehen, wie unzuverlässig JS ist und Ihre Anwendung auf viele Arten beschädigen kann.

let age: number;
age = 25;

Sie können Multiplikation buchstäblich auf jede Art und Weise aufrufen, es gibt keine Einschränkung und es liefert immer unerwartete Ergebnisse. Das ist das Schlimmste an JS. Angenommen, Sie müssen diese zurückgegebenen Werte jetzt irgendwo verwenden, wie viele Inkonsistenzen und unerwartete Ergebnisse es verursacht in Ihrer Bewerbung.

Aber dank TypeScript ist es sehr streng, es lässt Sie nicht fortfahren, wenn Sie die Regeln nicht befolgen. Wenn die Funktion das erwartet, müssen Sie die Zahl übergeben, und es heißt, dass beide Zahlen sein sollten, dann Sie müssen zwei Argumente übergeben und beide müssen Zahlen sein. Sehen wir uns den gleichen Code in TypeScript an. Wenn Sie die TS-Syntax nicht kennen, machen Sie sich keine Sorgen, sie ähnelt JS, außer dass der Rückgabetyp vor der öffnenden Klammer steht und die Argumenttypen mit ihren Namen versehen sind.

let age = 10;

age = "Donald Trump"
~~~
// Type '"Donald Trump"' is not assignable to type 'number'.(2322)

Hier bei TS gibt es also nie unvorhersehbare Ergebnisse, man kann nur fortfahren, wenn man alle Fehler beseitigt, das ist es, was mich in TS <3 verliebt

TS ist nicht nur verpflichtet, die Fehler in Ihrem von Ihnen geschriebenen Code zu melden, sondern zeigt Ihnen auch die Möglichkeit an, wo ein Fehler auftreten könnte. Sehen wir uns ein kurzes Beispiel dafür an.

function multiply (num1, num2 ) {
    return num1 * num2;
}

console.log(multiply(3, 4));
// returns 12

console.log(multiply(3));
// return NaN

console.log(multiply(3, null));
// returns 0

console.log(multiply());
// returns NaN

Wie Sie nun sehen können, ist die soziale Eigenschaft optional, was bedeutet, dass es Fälle geben kann, in denen „sozial“ nicht definiert ist. TS weiß das und lässt Sie erst fortfahren, wenn Sie damit umgehen.

function multiply (num1:number, num2:number) :number{
    return num1 * num2;
}

console.log(multiply(3, 4));
// returns 12

console.log(multiply(3));
//          ~~~~~~~~~~~
// Expected 2 arguments, but got 1.(2554)
// input.tsx(1, 33): An argument for 'num2' was not provided.

console.log(multiply(3, null));
//                      ~~~~
// Argument of type 'null' is not assignable to parameter of type 'number'.


console.log(multiply());
//          ~~~~~~~~~~~
// Expected 2 arguments, but got 0.(2554)
// input.tsx(1, 20): An argument for 'num1' was not provided.

Dies wird also von JS stillschweigend ignoriert und führt von Fall zu Fall zu Fehlern, was ein weiterer Grund ist, warum TS als zuverlässiger gilt.

Automatisch getestet und dokumentiert.

Why you should learn TypeScript and ditch JavaScript? TypeScript vs JavaScript

Angenommen, Sie verwenden eine Funktion aus einer in JS geschriebenen Bibliothek. Woher wissen Sie dann, welche Parameter Sie übergeben müssen? Sie gehen zur Dokumentation, überprüfen, welche Parameter benötigt werden, welche davon optional sind, und rufen dann die Funktion auf. Aber in TS ist es nicht nötig, das zu dokumentieren, alles wird durch die Typen selbst erklärt. Es stellt außerdem sicher, dass Sie die Funktion richtig verwenden und keine zufälligen Parameter übergeben.

Sie können sich beispielsweise auf den zweiten Abschnitt oben beziehen.

Ein weiterer Fall, den Sie annehmen können, ist, dass Sie eine Bibliothek verwenden, die Ihnen ein JS-Objekt mit verschachtelten Eigenschaften zur Verfügung stellt. Daher ist es ein großer Aufwand, zu überprüfen, wie die Eigenschaften genau heißen und welche davon undefiniert sein können Schmerz. Sie müssen in der Dokumentation stöbern oder manchmal Ihr Objekt in der Konsole protokollieren, um zu sehen, was es enthält. Das ist es wirklich, was ich hasse, ich wünsche mir eine Möglichkeit, dass das Objekt selbst sagt, welche Eigenschaften es enthält und ob eine Eigenschaft undefiniert ist oder eine Eigenschaft eine Wertzeichenfolge, eine Zahl, ein Array oder was auch immer hat. Nun, der Wunsch ist in Erfüllung gegangen, nochmals vielen Dank an TypeScript. Wenn die Codes in TS geschrieben sind, erhalten Sie das genaue Verhalten. Sehen wir uns das anhand eines Beispiels an.

let age: number;
age = 25;

Um nun zu prüfen, welche Eigenschaften der Benutzer haben wird, ist keine Konsolenprotokollierung oder ein Wechsel zur Funktionsdefinition erforderlich, wenn Sie eine hinzufügen. Nach dem Benutzer erhalten Sie automatisch eine Liste der vorhandenen Eigenschaften und erfahren, welche davon nicht definiert sind. Siehe das Bild unten.

Why you should learn TypeScript and ditch JavaScript? TypeScript vs JavaScript

Außerdem werden Ihre Codes automatisch getestet, indem alle Möglichkeiten geprüft werden, und Sie werden benachrichtigt, wenn eine der Möglichkeiten fehlschlägt. Klingt erstaunlich, oder? Ja, das ist es. Diese Funktion verhindert eine große Anzahl von Fehlern zum Zeitpunkt der Entwicklung. Sie müssen weder einen Test für Ihre Funktion schreiben noch sie manuell mit verschiedenen Werten testen. TS erledigt das für Sie und sagt Ihnen, wenn Sie etwas verpasst haben Das kann später zu Problemen führen.

Im folgenden Code habe ich eine Funktion geschrieben, die zwei Argumente akzeptiert und ein String-Array zurückgibt, indem sie jeden Parameter zum Array hinzufügt, wenn sie nicht undefiniert sind. Das erste Argument ist erforderlich, während das zweite optional ist.

let age = 10;

age = "Donald Trump"
~~~
// Type '"Donald Trump"' is not assignable to type 'number'.(2322)

Der obige Code ist ein sehr häufiges Szenario, in dem ich einen Fehler mache. Array.push gibt nicht das aktualisierte Array zurück, sondern die neue Länge des Arrays. Wenn also der obige Code im JS geschrieben ist, gibt es keinen Fehler, und mein Code wird einfach ausgeführt und liefert die erwarteten Ergebnisse, die ich debuggen und den Fehler hier finden muss, und meine Funktion gibt 2 zurück, wenn ich das übergebe zweites Argument auch. Aber hier in TS können Sie deutlich erkennen, dass TypeScript den Fall automatisch ausführt und Ihnen mitteilt, dass Ihre Funktion in diesem speziellen Fall kein Array von Zeichenfolgen zurückgeben wird.

Es liegt ein weiterer Fehler vor. Wenn Sie beispielsweise den zweiten Parameter nicht übergeben, geben Sie immer noch nichts (undefiniert) zurück, was ebenfalls gegen das Verhalten Ihrer Funktion verstößt, da diese ein Array von Zeichenfolgen zurückgeben muss. Deshalb habe ich hier einige Änderungen an der Funktion vorgenommen und TS gibt Ihnen eine grüne Flagge, was bedeutet, dass die Funktion niemals ein unerwartetes Ergebnis liefern wird. Siehe unten.

let age: number;
age = 25;

JavaScript immer ein paar Schritte voraus

Why you should learn TypeScript and ditch JavaScript? TypeScript vs JavaScript

Typescript ist Javascript immer ein paar Schritte voraus. Wenn eine neue Funktion in JavaScript angekündigt wird und diese in der nächsten ECMA-Version veröffentlicht werden soll, veröffentlicht TS sie vor der offiziellen Veröffentlichung und Sie können sie ohne Bedenken hinsichtlich der Kompatibilität in Browsern verwenden, da Sie TS mit jeder früheren Version kompilieren können von JavaScript (wie ES5). TypeScript verfügt über viele Funktionen, die JavaScript nicht bietet.

Wir können also sagen, dass TypeScript auch eine Obermenge von JavaScript, ECMA5, ECMA6, ECMA7 und ECMAnext ist und einige Funktionen enthält, die in JavaScript nicht einmal vorhanden sind.

Abschluss

Why you should learn TypeScript and ditch JavaScript? TypeScript vs JavaScript

Ja, früher oder später müssen Sie TypeScript akzeptieren. Davor kann man einfach nicht weglaufen. Jedes npm-Paket, das entweder in JavaScript geschrieben ist, muss auch seine Typen bereitstellen, oder es wird ein anderes Paket mit Typoskript-Unterstützung bevorzugt. Mittlerweile werden die meisten großen Bibliotheken, Pakete und Frameworks in TypeScript geschrieben.

Am Anfang waren Pakete auch in JavaScript mit TypeScript-Unterstützung, aber jetzt hat sich das Blatt gewendet, und Pakete sind in TypeScript und unterstützen JavaScript. Jeder erkennt die Macht und Notwendigkeit von TypeScript gegenüber JavaScript und akzeptiert es.

Sie werden nie in der Lage sein, Angular zu lernen, da es Sie dazu zwingt, nur TS-Code zu schreiben, das gleiche gilt für Loopback 4. Die primäre Sprache von NestJS ist TypeScritpt und sie bieten auch Unterstützung für JavaScript. Es folgen die Worte von NestJs

Wir lieben TypeScript, aber vor allem lieben wir Node.js. Aus diesem Grund ist Nest sowohl mit TypeScript als auch mit reinem JavaScript kompatibel. Nest nutzt die neuesten Sprachfunktionen. Um es mit Vanilla-JavaScript zu verwenden, benötigen wir einen Babel-Compiler.

Wenn Sie mit den von mir genannten Gründen immer noch nicht zufrieden sind und Gegenfragen haben, können Sie sich jederzeit an uns wenden. Glauben Sie mir, es lohnt sich, es auszuprobieren, Sie werden es nicht bereuen.

Das obige ist der detaillierte Inhalt vonWarum sollten Sie TypeScript lernen und JavaScript aufgeben? TypeScript vs. JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn