Vorschläge für das Schreiben von Typecript-Code

Do’s & Don’ts von TypeScript selbst

Prüfen Sie die TypeScript-Liste der Do’s and Don’ts

Strikte Konfiguration für den Typ

Bitte schalten Sie in der Konfiguration die folgenden Flags ein:

{
    ...
   "strict": true,
   ...
}

Dadurch werden Flaggen wie diese aktiviert:

• noImplicitThis (Aktiviert die Fehlermeldung, wenn dies den Typ any hat)
• noImplicitAny (Aktiviert die Fehlermeldung für Ausdrücke und Deklarationen mit einem impliziten Typ any)

Parameter der Funktion

Bei einer Funktion mit vielen Parametern ist es sinnvoll, die Funktion so zu ändern, dass sie die Parameter stattdessen als Objekt annimmt. Warum?

• Es ist einfach, die benötigten Parameter zu lesen
• Objekte sind leichter erweiterbar, und die Funktionsparameter müssen nicht geändert werden

Zum Beispiel:

const abc = (a: string, b: string, c: string) => {}

wenn Sie die oben genannte Funktion aufrufen, die Sie aufschreiben:

const cnt = abc('a', 'b', 'c')

Das ist an sich nicht so gut lesbar.

Wenn Sie stattdessen die folgende Funktion haben:

interface ABC {
  a: string
  b: string
  c: string
}

const abc = (abc: ABC) => {}

Der Aufruf dieser Funktion würde wie folgt aussehen:

const cnt = abc({ a: 'a', b: 'b', c: 'c' })

Jetzt können Sie die Idee hinter der Funktionssignatur definieren, prüfen, lesen und verstehen. Nehmen wir an, dass Sie beschlossen haben, auch d als Parameter hinzuzufügen, den Sie an die Funktion übergeben möchten. Ganz einfach…

interface ABC {
  ...
  d: string | number
}

const cnt = abc({a: "a", b: "b", c: "c", d: 3});

Bleiben Sie weg von „binden“, so viel wie möglich mit einem „französischen“ Akzent

Die Definition von „binden“ lautet etwa so:

bind (thisArg: any, ...anyArray: any[]) : any

Das bedeutet, dass bei der Verwendung von bind immer „any“ zurückgegeben wird, und auf Wiedersehen type check, du warst mein Freund.

Besser undefined als null

Nach ihrer eigenen Definition besteht der Unterschied darin, dass „undefined“ bedeutet, dass die Variable nicht deklariert wurde oder dass ihr kein Wert zugewiesen wurde, während „null“ ein spezieller Wert ist, der „kein Wert“ bedeutet. Der „?“-Operator von Typescript kann nicht mit Nullwerten umgehen, und es wird empfohlen, undefined für nicht vorhandene Werte zu verwenden und die Verwendung von null zu verbieten.

Extra eslint-Konfiguration für die Sperrung von „any“

Fügen Sie die folgende Konfiguration zu .eslintrc oder .eslintrc.js hinzu

{
  ...
  "rules": {
    "@typescript-eslint/no-explicit-any": "error",
    "@typescript-eslint/explicit-function-return-type": "error"
  }
}

Aber manchmal muss man diese Konfiguration aus vielen Gründen auslassen, besser nicht!

Schreiten Sie weiter voran und genießen Sie jeden Schritt Ihrer Programmierreise.