0Pricing
TypeScript Academy · Lektion

// @ts-check in JS; JSDoc für Typen

Aktivieren Sie die Typprüfung in .js mit // @ts-check und JSDoc, ergänzen Sie @param/@returns, @type/@typedef und @template für generische Muster und konfigurieren Sie tsconfig für eine schrittweise Migration.

// @ts-check in JS; JSDoc für Typen ist eine kostenlose TypeScript Academy-Lektion auf CoddyKit. Dies ist Lektion 1 von 1. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des TypeScript Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der TypeScript Academy-Kurs umfasst insgesamt 1 Lektionen.

Einführung

Ziel: Nutzen Sie die Vorteile von TypeScript in .js-Dateien. Sie aktivieren // @ts-check, fügen JSDoc-Typen hinzu und konfigurieren tsconfig für eine schrittweise Einführung.

  • Dateiweise Prüfung im Vergleich zur projektweiten Prüfung
  • @param, @returns, @type, @typedef
  • @template für generics-ähnliche Helper

Prüfung aktivieren

Fügen Sie // @ts-check am Anfang einer .js-Datei hinzu. Verwenden Sie @param/@returns, um die Funktion zu dokumentieren und zu typisieren.

// calculator.js
// @ts-check

/**
 * Adds two numbers.
 * @param {number} a
 * @param {number} b
 * @returns {number}
 */
export function add(a, b) {
  return a + b
}

// Usage: type errors appear if you pass non-numbers
// add("2", 3) // TS will flag this in JS

Typedef & type

Verwenden Sie @typedef, um eine wiederverwendbare Struktur zu definieren, und @type, um Variablen zu annotieren. Optionale Felder werden mit ? gekennzeichnet.

// models.js
// @ts-check

/** @typedef {{ id: string; name: string; age?: number }} User */

/** @type {User} */
export const currentUser = { id: "u1", name: "Ada" }

/**
 * Greets a user.
 * @param {User} u
 * @returns {string}
 */
export function greet(u) {
  return `Hello, ${u.name}!`
}

Template-Parameter

@template führt Typ-Parameter für generics-ähnliche Funktionen in JS ein. Die Inferenz funktioniert an den Aufrufstellen.

// helpers.js
// @ts-check

/**
 * Maps items with a function, preserving types.
 * @template T,U
 * @param {T[]} items
 * @param {(x: T) => U} f
 * @returns {U[]}
 */
export function map(items, f) {
  const out = []
  for (const x of items) out.push(f(x))
  return out
}

// Inference: T=number, U=string
// map([1,2], n => n.toFixed(2))

tsconfig für JS

Projektweit: Aktivieren Sie checkJs für alle .js-Dateien. Setzen Sie allowJs, um JS-Dateien in das Programm aufzunehmen. Verwenden Sie noEmit, wenn ein Bundler die Ausgabe übernimmt.

// tsconfig.json
{
  "compilerOptions": {
    "target": "ES2020",
    "module": "ESNext",
    "checkJs": true,
    "allowJs": true,
    "strict": true,
    "noEmit": true
  },
  "include": ["./**/*.js"],
  "exclude": ["node_modules"]
}

Migrationstipps

Migrationstipps:

  • Beginnen Sie mit kritischen Dateien, in denen Sie // @ts-check verwenden.
  • Erstellen Sie kleine @typedef-Definitionen für gemeinsam verwendete Strukturen.
  • Benennen Sie besonders wichtige Pfade schrittweise in .ts um, sobald die Typen stabil sind.

ts-check-Prüfung

Kurze Prüfung: Wie aktivieren Sie die TS-Prüfung in einer .js-Datei?

Zusammenfassung

Zusammenfassung: Aktivieren Sie // @ts-check, fügen Sie @param/@returns/@typedef/@template hinzu und verschärfen Sie tsconfig für JS-Projekte, bevor Sie zu .ts migrieren.

Häufig gestellte Fragen

Ist die Lektion „// @ts-check in JS; JSDoc für Typen“ kostenlos?

Ja — der vollständige Text von „// @ts-check in JS; JSDoc für Typen“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des TypeScript Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der TypeScript Academy-Kurs umfasst insgesamt 1 Lektionen.

Was lerne ich in „// @ts-check in JS; JSDoc für Typen“?

Aktivieren Sie die Typprüfung in .js mit // @ts-check und JSDoc, ergänzen Sie @param/@returns, @type/@typedef und @template für generische Muster und konfigurieren Sie tsconfig für eine schrittweise… Du übst TypeScript Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.

Brauche ich Erfahrung, um TypeScript Academy zu starten?

Keine Vorkenntnisse erforderlich. TypeScript Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 1 von 1.

Wie lange dauert die Lektion „// @ts-check in JS; JSDoc für Typen“?

Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.

Kann ich in dieser TypeScript Academy-Lektion Code schreiben und ausführen?

Ja. Jede TypeScript Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.

← Zurück zu TypeScript Academy