Apa Itu TypeScript ?

TypeScript adalah JavaScript yang dilengkapi sistem tipe statis, yaitu pemeriksaan jenis data sebelum program dijalankan. Pemeriksaan dilakukan compiler, program yang menerjemahkan kode sumber sekaligus memeriksa kepatuhannya. Topik ini membandingkan TypeScript dengan JavaScript sebagai superset, menunjukkan peran anotasi tipe sebagai dokumentasi yang dapat dieksekusi, dan menutup dengan kisah adopsinya di industri. Hasil akhirnya berupa kemampuan menjelaskan posisi TypeScript terhadap JavaScript serta membaca anotasi tipe pada berkas sederhana.

TypeScript sebagai superset JavaScript#

TypeScript adalah superset JavaScript, yaitu bahasa yang memuat seluruh sintaks JavaScript dan menambahkan aturan baru di atasnya. Kode JavaScript yang umum dapat langsung disimpan sebagai berkas TypeScript berekstensi .ts tanpa perubahan apa pun. Tambahan yang dibawa TypeScript berupa anotasi tipe, yakni catatan pada kode yang menyatakan jenis nilai yang diizinkan. Compiler membaca anotasi tersebut dan melaporkan error apabila kode melanggarnya, sedangkan programnya tetap berperilaku persis seperti JavaScript biasa.

JavaScript tidak menolak pemanggilan yang keliru, dan kelemahan itu terlihat pada contoh berikut. Fungsi konversi satuan ini ditulis tanpa satu anotasi pun, persis seperti berkas JavaScript biasa.

function cmKeInci(cm) {
  return cm / 2.54;
}

console.log(cmKeInci("seratus"));

NaN

Program di atas berjalan tanpa pesan error apa pun, tetapi hasilnya salah. Teks "seratus" dibagi dengan angka sehingga percobaan konversi gagal. Keluarannya berupa NaN, yaitu nilai Not a Number yang menandai hasil aritmetika yang tidak sah. Cacat semacam ini sulit dilacak karena nilai NaN dapat menyebar ke perhitungan lain dan baru terlihat jauh dari penyebabnya. Tidak ada peringatan pada saat menulis, pada saat kompilasi, maupun pada awal eksekusi.

Sifat superset membuat adopsi TypeScript dapat dilakukan bertahap. Berkas JavaScript lama tetap berjalan semula, sedangkan berkas yang telah diberi anotasi mulai diperiksa compiler. Karena itulah banyak proyek besar bermigrasi per berkas alih-alih menulis ulang semuanya sekaligus.

Tipe sebagai dokumentasi yang dapat dieksekusi#

Anotasi tipe paling mudah dipahami sebagai dokumentasi yang dapat dieksekusi (executable documentation). Komentar biasa hanya ditujukan kepada manusia dan sering basi setelah kode berubah, sedangkan anotasi tipe dibaca compiler pada setiap pemeriksaan. Ketidakcocokan antara anotasi dan kode akan dilaporkan sebagai error, sehingga anotasi tidak dapat menyesatkan tanpa terdeteksi.

Berkas berikut mengubah fungsi konversi sebelumnya menjadi versi yang dianotasi lengkap. Tanda (cm: number) menyatakan parameter cm hanya menerima bilangan, sedangkan : number setelah tanda kurung menyatakan nilai kembalian berupa bilangan.

function cmKeInci(cm: number): number {
  return cm / 2.54;
}

const panjangCm: number = 100;
console.log(`${panjangCm} cm sama dengan ${cmKeInci(panjangCm).toFixed(2)} inci`);

100 cm sama dengan 39.37 inci

Bagi manusia, anotasi pada berkas tersebut berfungsi sebagai keterangan pemakaian yang selalu mutakhir. Bagi compiler, anotasi yang sama berfungsi sebagai kontrak yang wajib dipatuhi. Apabila ada pemanggil cmKeInci yang mengirim teks, compiler menolaknya sebelum program sempat berjalan.

Penolakan itu terjadi pada bentuk berikut. Anotasinya identik dengan berkas sebelumnya, tetapi argumen yang dikirim berupa teks.

// tidak-dijalankan
function cmKeInci(cm: number): number {
  return cm / 2.54;
}

cmKeInci("seratus");

Baris terakhir contoh di atas ditandai sebagai error dengan pesan yang menyebut jenis ketidakcocokannya, yaitu teks dikirim ke parameter bertipe bilangan. Editor yang menjalankan language server TypeScript menampilkan penanda yang sama sebelum berkas disimpan, sehingga kesalahan tertangkap pada saat mengetik. Perbaikannya pun terarah, yaitu mengirim bilangan atau mengonversi teks lebih dahulu, alih-alih mencari nilai NaN yang baru terlihat saat program berjalan.

Frasa dokumentasi yang dapat dieksekusi juga menjelaskan mengapa anotasi tipe bukan pekerjaan tambahan yang sia-sia. Keterangan jenis data memang perlu ada di proyek mana pun, baik sebagai komentar, dokumen terpisah, maupun pilihan nama variabel. TypeScript memindahkan keterangan itu ke tempat yang dapat diverifikasi mesin, sehingga biaya menulisnya sama tetapi manfaatnya diperiksa secara otomatis.

Kisah adopsi TypeScript di industri#

TypeScript diumumkan Microsoft pada Oktober 2012 dan dikembangkan oleh tim yang dipimpin Anders Hejlsberg, arsitek utama C#. Latar belakangnya berupa pengalaman memelihara aplikasi JavaScript berskala besar, ketika jenis data hanya ada dalam ingatan pengembang dan setiap perubahan berisiko merusak bagian lain. TypeScript menawarkan jalan tengah berupa disiplin tipe tanpa meninggalkan runtime JavaScript dan tanpa menulis ulang kode yang sudah ada.

Bahasa ini dirilis sebagai proyek open source dan dikembangkan secara terbuka di GitHub sejak awal, sehingga kepercayaan ekosistem tumbuh lebih cepat. Tahun 2014, framework Angular mengumumkan pembangunan Angular 2 dengan TypeScript, dan langkah itu mengangkat bahasa ini dari alat internal menjadi pilihan utama komunitas. Pustaka besar menyusul, termasuk Vue 3 yang ditulis dengan TypeScript, sementara ribuan paket populer menyertakan definisi tipe untuk penggunanya.

Angka adopsinya terlihat pada survei tahunan State of JS yang menempatkan TypeScript pada tingkat pemakaian mayoritas di antara respondennya. Dukungan alat pun menjadi bawaan, mulai dari editor, bundler, sampai Node.js yang kini dapat menjalankan berkas .ts secara langsung melalui penghapusan tipe (type stripping). Pada basis kode JavaScript yang serius, keberadaan TypeScript kini menjadi asumsi awal alih-alih pilihan tambahan.

Kesalahan umum#

Tiga kekeliruan berikut sering muncul ketika TypeScript baru digunakan.

• Menganggap TypeScript sebagai bahasa yang terpisah dari JavaScript. Kekeliruan ini muncul karena berkasnya berekstensi .ts dan memerlukan langkah kompilasi, sehingga kode JavaScript yang sudah sah ikut ditulis ulang atau ditolak padahal tidak perlu. Perbaikannya adalah memperlakukan TypeScript sebagai JavaScript dengan tambahan anotasi, karena kode lama tetap berlaku dan dapat dipindahkan per berkas sesuai kebutuhan.
• Berharap anotasi tipe menyaring data saat program berjalan. Anotasi hilang setelah kompilasi, sehingga masukan dari berkas, formulir, atau jaringan tetap dapat berupa teks yang seharusnya bilangan. Perbaikannya adalah memeriksa dan mengonversi data pada batas sistem, lalu membiarkan anotasi menjaga kepatuhan kode di dalamnya.
• Mengira TypeScript mengubah perilaku JavaScript saat program berjalan. Hasil kompilasi tetap JavaScript biasa, sehingga perilaku seperti konversi otomatis pada pembagian teks dan bilangan tidak berubah. Perbaikannya adalah membaca berkas hasil kompilasi setiap kali perilaku saat runtime diragukan, sebagaimana dicontohkan pada pemeriksaan berkas hasil penerjemahan.

Ringkasan#

• TypeScript adalah superset JavaScript yang menambahkan anotasi tipe, dan kode JavaScript yang umum tetap sah di dalamnya.
• Anotasi tipe berperan sebagai dokumentasi yang dapat dieksekusi karena compiler membacanya dan menolak pemanggilan yang melanggar.
• Cacat senyap seperti NaN yang menyebar ke perhitungan lain adalah kelemahan JavaScript yang coba dicegah oleh pemeriksaan tipe.
• Adopsi TypeScript bergerak dari rilis Microsoft tahun 2012 menuju framework besar, pustaka populer, dan dukungan bawaan Node.js.

Referensi#

• The TypeScript Handbook — Microsoft — Panduan resmi TypeScript yang memperkenalkan bahasa ini sebagai JavaScript dengan sintaks tipe.
• TypeScript for JavaScript Programmers — Microsoft — Ringkasan resmi hubungan TypeScript dengan JavaScript beserta tambahan yang dibawanya.
• Repositori TypeScript — Microsoft — Repositori sumber terbuka compiler TypeScript beserta riwayat rilisnya sejak 2012.