TypeScript Neden JavaScript'in Yerini Alıyor?

← Rehbere Dön

JavaScript, web tarayıcılarının tek hakimi ve tartışmasız dünyadaki en yaygın yazılım dilidir. Ancak yıllar geçtikçe, basit "tıklayınca rengi değişsin" scriptlerinden çıkıp, milyonlarca satırlık büyük ölçekli kurumsal web uygulamalarına (Netflix, Facebook, Spotify Web) dönüştüğünde, JavaScript'in bağımsız gücü, aynı zamanda en ölümcül zayıflığı olmaya başlamıştı. Nasıl mı?

JavaScript (JS), dinamik tipli (dynamic typing) bir dildir. Bir değişkene önce sayısal (number) değer, programın devamında ise o sayı beklenen fonksiyona içinde metin (string) olan bir nesne gönderebilirsiniz, JS asla itiraz etmez. Tüm bu fatal (ölümcül) hataları, müşteri projeyi canlıda kullanırken ödeme yapmaya çalışıp bilgisayarı patladığında (konsolda beliren meşhur Runtime Error: Undefined is not a function ile) görürsünüz.

TypeScript'in Çözümü: Static Tip Güvenliği (Type Safety)

Microsoft tarafından Anders Hejlsberg (C#'ın da yaratıcısıdır) önderliğinde geliştirilen TypeScript (TS), sanılanın aksine yeni ve farklı bir dil değildir; o aslında bildiğimiz ve sevdiğimiz JavaScript'in bir "Üst Kümesidir" (Superset). Yani geçerli her JavaScript kodu aynı zamanda geçerli bir TypeScript kodudur.

Tek farkı, kodu yazarken (Derleme/Compile sırasında) size C# veya Java gibi katı kurallar sunmasıdır. Sizin o sıkı disiplinle yazdığınız .ts dosyasını, en sonunda tamamen saf, pürüzsüz ve dilediğiniz yıla uyumlu (Örn: ES2015) bir .js dosyasına dönüştürür ve tarayıcıya yollar.

Farkı Görelim (JS vs TS) - 5 Milyon Dolarlık Hata

JavaScript'te tehlikeli ve kontrolsüz bir fonksiyon:

// Vanilla JS:
function odemeAl(musteriSepeti) {
  // Sistem arka planda sepet toplamını alır...
  let toplamFiyat = musteriSepeti.toplamTutar; 
  return 'Kartınızdan çekilen: ' + toplamFiyat;
}

// 6 ay sonra api'yi yazan değişir ve fonksiyona 'toplamTutar' 
// yerine 'totalPrice' diye bir obje atarsa nolur?
odemeAl({ totalPrice: 500 }); // "Kartınızdan çekilen: undefined" yazar ve BEDAVA geçer!

Aynı senaryo TypeScript'te (Kodu yazarken VS Code'da anında kırmızı çizgi atar!)

// TypeScript
interface Sepet {
    id: number;
    toplamTutar: number;
    indirimUygulandiMi: boolean;
}

// Fonksiyon sadece "Sepet" kurallarına uyan bir nesne kabul edeceğini söyler
function odemeAl(musteriSepeti: Sepet): string {
  return 'Kartınızdan çekilen: ' + musteriSepeti.toplamTutar.toFixed(2);
}

// IDE KIRMIZI ÇİZER: "Sepet tipi bekliyordum objede toplamTutar eksik!" diyerek uyarır. Derlenmez.
odemeAl({ totalPrice: 500 });

Neden Tüm Projeler TS'ye Göç Ediyor? (Sadece Tip mi?)

IDE (Editör) Desteği ve İntellisense: TS yazdığınızda kod editörünüzde (VS Code) otomatik tamamlama kusursuz çalışır. Bir API'den gelen verinin musteri.urun_id mi yoksa musteri.urunID mi olduğunu tahmin etmek zorunda kalmazsınız, nokta (.) koyduğunuz an liste açılır.
Korkusuz Refactoring (Yeniden Yapılandırma): Değişkenin veya fonksiyonun adını bir yerden değiştirdiğinizde tüm projedeki TS hatalarını anında görüp anında düzeltebilirsiniz. Klasik JS'de ismi değiştirdiğinizde uygulamanın derinliklerinde neyin patladığını bilmeniz imtiyazdır.
Gelişmiş Tip Mimarisi (Advanced Types): TypeScript, C# veya Java gibi dillerden bile daha esnek bir tip yeteneği sunar. Union Types (string | number), Generics <T>, veya elimizdeki tipi manipüle eden Omit<User, 'password'> gibi akıl almaz araçlara sahiptir.
Modern Frontend Mimari Standardı: Angular ilk çıktığı günden beri zorunlu TypeScript'tir. Bugün React, Vue, Next.js veya SvelteKit güncel dokümanlarında kod örneklerini "önce TypeScript (TSX), istersen JavaScript (JSX)" olarak hazırlamaktadır.

Küçük Projelerde Gerekli mi? (Over-Engineering Sorunsalı)

Dürüst olmak gerekirse; hayır, 3 satırlık bir sayaç uygulaması (counter) yapıyorsanız veya bir landing page'de butonun rengini değiştirecek küçük bir script yazıyorsanız TS ve derleme süreçleri (tsconfig.json ayarlamaları) size sadece yavaşlık ve hamallık katar.

Ancak 5-10 kişilik ekiplerde, modüllerin birbiriyle konuştuğu, onlarca API endpoint'inden veri akışının olduğu kurumsal projelerde, kodu yazarken 1-2 dakika fazla harcayıp interface tanımlamak; 3 hafta sonra "Cannot read properties of undefined" hatasını bulmak için sabaha kadar log okumaktan sizi kurtaracaktır.

İleri Okumalar

Üzer Teknoloji olarak Node.js backend servislerimiz, modern React arayüzlerimiz ve Next.js tabanlı kurumsal ölçekli web projelerimizin kod kalitesini global standartlara çekmek ve üretim (production) ortamındaki hataları sıfırlamak için %100 oranında TypeScript (Strict Mod) kullanımını bir standart haline getirdik.