TypeScript Baslangic Rehberi: Tip Guvenli JavaScript

TypeScript Nedir ve Neden Kullanmaliyiz?

TypeScript, Microsoft tarafindan gelistirilen ve JavaScript uzerine statik tip sistemiekleyen acik kaynakli bir programlama dilidir. JavaScript'in tum ozelliklerini icerir ve uzerine tip guvenligi, arayuzler, jenerikler ve gelismis araclama destegi gibi ozellikler ekler. 2026 yilinda buyuk olcekli projelerin vazgecilmezi haline gelen TypeScript, kod kalitesini arttirir, hatalari derleme zamaninda yakalar ve gelistirici deneyimini onemli olcude iyilestirir.

JavaScript ile yazilan her kod zaten gecerli bir TypeScript kodudur. Bu, mevcut projelerinizi kademeli olarak TypeScript'e gecirmenizi mumkun kilar. Buyuk ekiplerde calisirken TypeScript'in saglladigi tip guvenligi, kod tabaninin anlasilabilirligini ve bakimini kolaylastirir.

Temel Tipler (Basic Types)

TypeScript'te degiskenlere tip atamak icin iki nokta ust uste (:) sozdizimi kullanilir. En sik kullanilan temel tipler sunlardir:

• string: Metin degerleri icin. let isim: string = "Megis";
• number: Sayisal degerler icin. Tam sayi ve ondalikli sayi ayrimi yoktur. let yas: number = 25;
• boolean: Mantiksal degerler icin. let aktif: boolean = true;
• array: Dizi tipleri iki sekilde tanimlanir. let sayilar: number[] = [1, 2, 3]; veya let sayilar: Array<number> = [1, 2, 3];
• tuple: Sabit uzunlukta ve her elemanin tipi belli olan diziler. let kullanici: [string, number] = ["Ali", 30];
• enum: Isimlendirilmis sabit kumeleri. enum Renk { Kirmizi, Yesil, Mavi }
• any: Her turlu degeri kabul eder; tip kontrolunu devre disi birakir. Mumkun oldugunca kacinilmalidir.
• unknown: any'e benzer ama daha guvenlidir; kullanmadan once tip kontrolu gerektirir.
• void: Deger dondurmeyen fonksiyonlar icin kullanilir.
• null ve undefined: Bos veya tanimlanmamis degerleri temsil eder.
• never: Hicbir zaman deger dondurmeyecek fonksiyonlar icin kullanilir (ornegin hata firlatanlar).

Arayuzler (Interfaces)

Arayuzler, nesnelerin yapisini tanimlamak icin kullanilir. Bir nesnenin hangi ozelliklere sahip olmasi gerektigini ve bu ozelliklerin tiplerini belirler. TypeScript'te en cok kullanilan yapilardan biridir.

Temel bir arayuz tanimi soyledir: interface Kullanici { isim: string; yas: number; email?: string; }. Burada email ozelliginin sonundaki soru isareti, bu ozelligin opsiyonel oldugunu belirtir. Arayuzler genisletilebilir; interface Admin extends Kullanici { rol: string; } seklinde miras alinabilir.

Arayuzler ve type alias'lar arasinda onemli farklar vardir. Arayuzler declaration mergingdestekler, yani ayni isimle birden fazla kez tanimlanabilir ve otomatik olarak birlestirilir. Type alias'lar ise union ve intersection tipleri gibi daha karmasik tip ifadelerinde tercih edilir.

Type Alias ve Union Tipler

type anahtar kelimesi ile ozel tip tanimlari olusturabilirsiniz. Union tipler, bir degiskenin birden fazla tipte olabilecegini belirtir:

• Union Type: type Sonuc = string | number; — degisken string veya number olabilir.
• Intersection Type: type AdminKullanici = Kullanici & Admin; — iki tipin birlesimi.
• Literal Type: type Yonu = "sol" | "sag" | "yukari" | "asagi"; — sadece belirli degerleri kabul eder.
• Template Literal Type: type EventName = `on${string}`; — dinamik string kaliplari olusturur.

Jenerikler (Generics)

Jenerikler, TypeScript'in en guclu ozelliklerinden biridir. Yeniden kullanilabilir ve tip-guvenli bilesenleri olusturmaniza olanak tanir. Bir fonksiyon veya sinif yazarken, kullanilacak tipi parametre olarak alabilirsiniz.

Ornegin, bir dizi elemanini saran fonksiyon: function sarmalayici<T>(deger: T): T[] { return [deger]; }. Burada T bir tip parametresidir ve fonksiyon cagrildiginda otomatik olarak cikarsanir. sarmalayici("merhaba") cagrildiginda T otomatik olarak string olur.

Jenerik kisitlamalar (constraints) ile tip parametresinin belirli ozelliklere sahip olmasini zorunlu kilabilirsiniz: function uzunlukAl<T extends { length: number }>(deger: T): number { return deger.length; }. Bu fonksiyon yalnizca length ozelligine sahip tipleri kabul eder.

Jenerikler ayrica arayuzlerde ve siniflarda da kullanilabilir. Ornegin bir API yanit tipi: interface ApiYanit<T> { veri: T; basarili: boolean; mesaj: string; }. Bu yapiyla farkli endpoint'lerden donen verileri tip-guvenli sekilde modelleyebilirsiniz.

Tip Koruyuculari (Type Guards)

Tip koruyuculari, calisma zamaninda bir degiskenin tipini daraltmanizi saglar. Union tiplerle calisirken ozellikle onemlidir.

• typeof Guard: Ilkel tipler icin kullanilir. if (typeof deger === "string") { ... }
• instanceof Guard: Sinif ornekleri icin kullanilir. if (hata instanceof TypeError) { ... }
• in Guard: Bir ozelligin nesnede var olup olmadigini kontrol eder. if ("email" in kullanici) { ... }
• Custom Type Guard: Ozel tip koruyucu fonksiyonlar tanimlanabilir. Donus tipi parametre is Tip seklinde belirtilir: function isString(deger: unknown): deger is string { return typeof deger === "string"; }

Discriminated Unions (Ayirt Edilmis Birlesimler) kalibinda, ortak bir ozellik kullanilarak tipler ayirt edilir. Ornegin type Sekil = Daire | Kare; yapisi icinde her iki tipin tur ozelligi farkli literal degerler tasir ve switch-case ile guvenli sekilde islenebilir.

Yardimci Tipler (Utility Types)

TypeScript, yaygin tip donusumleri icin yerlesik yardimci tipler sunar. Bunlar mevcut tiplerden yeni tipler turetmenizi saglar:

JavaScript'ten TypeScript'e Gecis Stratejisi

Mevcut bir JavaScript projesini TypeScript'e gecirmek icin asagidaki adim adim stratejiyi uygulayabilirsiniz:

1. tsconfig.json olusturun: Projenizin kokune bir TypeScript yapilandirma dosyasi ekleyin. Baslangicta strict: false ayariyla baslayin ve kademeli olarak sikistirin.
2. allowJs secenegini aktif edin: Bu, JS ve TS dosyalarinin bir arada yasmasina olanak tanir.
3. Dosyalari kademeli olarak yeniden adlandirin: .js dosyalarini .ts (veya .tsx) olarak degistirin. Her seferinde bir dosyayla baslayin.
4. any ile baslayin, sonra daraltinn: Ilk geciste karmasik tiplere any atayin, ardindan gercek tipleri tanimlayin.
5. Ucuncu parti kutuphaneler icin tip tanimlamalari yukleyin: @types/react, @types/node gibi DefinitelyTyped paketlerini ekleyin.
6. strict modu kademeli olarak etkinlestirin: noImplicitAny, strictNullChecks, strictFunctionTypes gibi kontrolleri birer birer acin.
7. CI/CD pipeline'ina tip kontrolu ekleyin: tsc --noEmit komutunu build surecine dahil ederek tip hatalarinin uretime gecmesini engelleyin.

TypeScript En Iyi Uygulamalar

Profesyonel TypeScript gelistirmede dikkat edilmesi gereken onemli noktalar sunlardir:

• any kullanmaktan kacinin: any yerine unknown kullanin ve tip daraltma ile guvenli erisim saglayin.
• Strict modu aktif tutun: "strict": true ayari, tip guvenligini en ust duzeyde tutar.
• Arayuzleri tercih edin: Nesne tipleri icin genellikle interface kullanin; union ve intersection tipler icin type kullanin.
• Enum yerine const assertion kullanmayi degerlendirin: const RENKLER = ["kirmizi", "yesil"] as const; daha guvenli olabilir.
• Tip cikarimini (inference) kullanin: Her yere acikca tip yazmak yerine, TypeScript'in tip cikarim mekanizmasina guvenin. Fonksiyon parametreleri ve donus tipleri icin acik tip yazmak iyi bir pratiktir.
• Barrel export kullanin: index.ts dosyalariyla modulleri organize edin.
• Null kontrollerini ihmal etmeyin: Optional chaining (?.) ve nullish coalescing (??) operatorlerini aktif kullanin.

Gelismis TypeScript Kaliplari

TypeScript'te uzmanlasmak icin asagidaki gelismis kaliplari da ogrenmeniz onemlidir:

• Mapped Types: Mevcut tipleri donusturmek icin kullanilir. Ornegin tum ozellikleri opsiyonel yapan Partial aslinda bir mapped type'dir.
• Conditional Types: T extends U ? X : Y seklinde kosullu tip tanimlari olusturmanizi saglar.
• Template Literal Types: String literal tiplerini birlestirerek dinamik tip kaliplari uretir.
• Infer Keyword: Conditional type icerisinde tip cikarimi yapmanizi saglar. ReturnType ve Parameters gibi yardimci tiplerin temelini olusturur.
• Branded Types: Ayni temel tipe sahip ama anlamsal olarak farkli degerleri ayirt etmek icin kullanilir. Ornegin UserId ve OrderId ikisi de string olsa bile karistirilmasini onler.

Sonuc:TypeScript, modern web gelistirmenin vazgecilmez bir aracidir. Ilk basta ogrenme egrisi dik gorunse de, tip guvenligi sayesinde yakalanan hatalar, gelistirici araclariyla sunulan otomatik tamamlama ve dokumantasyon, ve buyuk kod tabanlarindaki bakimkolayligi, yatirdiginiz emegi fazlasiyla geri odemektedir. Kucuk adimlarla baslayin, strict modu kademeli olarak etkinlestirin ve TypeScript'in sunduklarindan tam olarak faydalanin.