Pernah deploy aplikasi JavaScript ke production, terus user complain "tombol error pas diklik"? Pas dicek log: cannot read property "name" of undefined. Bug yang harusnya ketahuan jam pertama coding, baru muncul setelah user yang nemu. TypeScript = JavaScript + sistem tipe yang nangkep bug ini di editor, sebelum push ke production. Microsoft bikin TS tahun 2012 untuk solve masalah ini, sekarang jadi standar industri — React, Vue, Angular, Next.js semua pakai.
💡 TS = JS dengan kacamata. Semua file JavaScript valid TypeScript. Kamu bisa migrate gradual: rename
.js→.ts, tambah type satu per satu. Gak perlu rewrite. Compile balik ke JS yang dijalanin browser/Node — TS cuma ada saat development sebagai safety net.
Beda JS vs TS
// JavaScript — error baru ketahuan saat runtime
function tambah(a, b) { return a + b; }
tambah("5", 3); // "53" (bug!)
// TypeScript — error langsung ketahuan saat development
function tambah(a: number, b: number): number { return a + b; }
tambah("5", 3); // ❌ Error: string tidak bisa jadi number
Mengapa TypeScript?
- Menangkap bug sebelum kode dijalankan
- Autocomplete yang lebih pintar di editor
- Dokumentasi otomatis lewat tipe
- Refactoring lebih aman
- Standar industri (dipakai oleh React, Vue, Angular, dll)
Tipe Dasar
let nama: string = "Budi";
let umur: number = 17;
let aktif: boolean = true;
🎭 Analogi sehari-hari
JavaScript = kotak misterius. Kamu masukin barang, ngarep dapet barang yang sama, tapi gak ada label. TypeScript = kotak ber-label: "INI HARUS BUKU, BUKAN GELAS". Kalau salah masukin gelas ke kotak buku, alarm langsung bunyi pas kamu masukin (di editor) — bukan pas kotak udah dikirim ke pelanggan (production).
⚠️ Jebakan yang sering ditemui
anyeverywhere = bypass type system = sama aja JavaScript. Hindariany, pakaiunknownkalau ragu- TS gak ngubah runtime — bug data dari API tetap mungkin (response format beda dari ekspektasi). Validate runtime juga (Zod/Yup)
- Type vs Interface — keduanya mirip, biasanya bisa diganti-ganti.
interfacecocok untuk object,typelebih fleksibel - Strict mode harus on (
"strict": truedi tsconfig) — kalau off, TS gak nangkep null/undefined bug - Belajar TS sebelum kuat di JS = bingung. Pastikan paham JavaScript dulu, baru tambah type
TL;DR: TypeScript = JavaScript + sistem tipe statis. Compile ke JS biasa. Nangkep bug di editor sebelum runtime. Wajib di production project (React/Vue/Angular/Next.js semua pakai). Hindari any. Strict mode WAJIB on. Bukan bahasa baru — JavaScript dengan safety net.
