PricingLoginStart free
TypeScript Academy · Pelajaran

// @ts-check dalam JS; JSDoc untuk memperoleh tipe

Aktifkan pemeriksaan tipe dalam .js dengan // @ts-check dan JSDoc; tambahkan @param/@returns, @type/@typedef, serta @template untuk pola generik; konfigurasikan tsconfig untuk migrasi bertahap.

Pelajaran 1 dari 18 langkah

// @ts-check dalam JS; JSDoc untuk memperoleh tipe adalah pelajaran TypeScript Academy gratis di CoddyKit. Ini adalah pelajaran 1 dari 1. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar TypeScript Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus TypeScript Academy mencakup 1 pelajaran total.

Pendahuluan

Tujuan: Dapatkan manfaat TypeScript di dalam berkas .js. Anda akan mengaktifkan // @ts-check, menambahkan tipe JSDoc, dan mengonfigurasi tsconfig untuk penerapan bertahap.

  • Pemeriksaan per berkas dibandingkan seluruh proyek
  • @param, @returns, @type, @typedef
  • @template untuk pembantu seperti generik

Aktifkan pemeriksaan

Tambahkan // @ts-check di bagian atas berkas .js. Gunakan @param/@returns untuk mendokumentasikan dan memberi tipe pada fungsi.

// 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

Definisi tipe & anotasi tipe

Gunakan @typedef untuk menentukan struktur yang dapat digunakan kembali dan @type untuk memberi anotasi pada variabel. Kolom opsional ditandai dengan ?.

// 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}!`
}

Parameter templat

@template memperkenalkan parameter tipe untuk fungsi seperti generik dalam JS. Inferensi bekerja di lokasi pemanggilan.

// 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 untuk JS

Seluruh proyek: aktifkan checkJs untuk semua berkas .js. Atur allowJs agar berkas JS disertakan dalam program. Gunakan noEmit saat penggabung menangani keluaran.

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

Kiat migrasi

Kiat migrasi:

  • Mulai dari berkas penting menggunakan // @ts-check.
  • Buat @typedef kecil untuk struktur bersama.
  • Ganti nama jalur yang sering digunakan secara bertahap menjadi .ts setelah tipe stabil.

Pemeriksaan ts-check

Pemeriksaan singkat: Bagaimana Anda mengaktifkan pemeriksaan TS dalam berkas .js?

Jawab di pelajaran interaktif

Ringkasan

Ringkasan: Aktifkan // @ts-check, tambahkan @param/@returns/@typedef/@template, dan perketat tsconfig untuk proyek JS sebelum bermigrasi ke .ts.

Gratis untuk memulai

Belajar TypeScript dengan tutor AI — gratis

Tulis dan jalankan kode asli di browser kamu, dapatkan bantuan instan dari tutor AI 24/7, dan lanjutkan di mana kamu tinggalkan di web atau aplikasi.

Kursus
101
Pelajaran
352
Mulai belajar gratisLihat kursus lengkapnya

Pertanyaan yang Sering Diajukan

Apakah pelajaran “// @ts-check dalam JS; JSDoc untuk memperoleh tipe” gratis?

Ya — teks lengkap “// @ts-check dalam JS; JSDoc untuk memperoleh tipe” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus TypeScript Academy, upgrade ke CoddyKit PRO. Kursus TypeScript Academy mencakup 1 pelajaran total.

Apa yang akan aku pelajari di “// @ts-check dalam JS; JSDoc untuk memperoleh tipe”?

Aktifkan pemeriksaan tipe dalam .js dengan // @ts-check dan JSDoc; tambahkan @param/@returns, @type/@typedef, serta @template untuk pola generik; konfigurasikan tsconfig untuk migrasi bertahap. Kamu berlatih TypeScript Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.

Apakah aku perlu pengalaman untuk memulai TypeScript Academy?

Tidak diperlukan pengalaman sebelumnya. TypeScript Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 1 dari 1.

Berapa lama pelajaran “// @ts-check dalam JS; JSDoc untuk memperoleh tipe” memakan waktu?

Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.

Bisakah aku menulis dan menjalankan kode dalam pelajaran TypeScript Academy ini?

Ya. Setiap pelajaran TypeScript Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.

← Kembali ke TypeScript Academy