Neden TypeScript?

Bir çevrim içi mağaza düşün: fiyatı biçimlendiren formatPrice(price) fonksiyonu aylardır sorunsuz çalışıyor. Bir gün fiyat formdan sayı olarak değil '4.5' string'i olarak geliyor ve sayfa TypeError: price.toFixed is not a function hatasıyla çöküyor. Hatayı geliştiriciden önce müşteri gördü. TypeScript tam da bunun için var: bu tür hataları kullanıcıların değil senin, daha kodu yazarken editörde görmen için.

TypeScript nedir?

JavaScript'te tipler dinamik olarak denetlenir; yani ancak satır gerçekten çalıştığında. TypeScript'te ise tipler statik olarak, kod çalıştırılmadan, yalnızca okunarak denetlenir. Tip iki noktadan sonra yazılır ve buna tip belirtimi (type annotation) denir: price: number, “price her zaman bir sayıdır” demektir. Bir yerde string gönderirsen derleyici bunu hemen söyler:

function formatPrice(price: number): string {
  return price.toFixed(2) + ' AZN';
}

console.log(formatPrice(4.5));
console.log(formatPrice('4.5'));

shop.ts:6:25 - error TS2345: Argument of type 'string' is not assignable to parameter of type 'number'.

6 console.log(formatPrice('4.5'));
                          ~~~~~

TypeScript'ten JavaScript'e

Tarayıcılar ve Node.js aslında yalnızca JavaScript anlar. Bu yüzden TypeScript derleyicisi tsc iki iş yapar: tipleri denetler ve tiplerin basitçe silindiği sıradan bir JavaScript kodu üretir. Aşağıda küçük bir dosya ve tsc'nin ondan ürettiği JavaScript var:

type User = { name: string; age: number };

export function greet(user: User): string {
  return `Hello, ${user.name}! You are ${user.age}.`;
}

const aysel: User = { name: 'Aysel', age: 14 };
console.log(greet(aysel));

Hello, Aysel! You are 14.

export function greet(user) {
    return `Hello, ${user.name}! You are ${user.age}.`;
}
const aysel = { name: 'Aysel', age: 14 };
console.log(greet(aysel));

Tipler ne kazandırır?

• Hatalar erkenden yakalanır: özellik adındaki bir yazım hatası, yanlış bir argüman ya da unutulmuş bir null kontrolü program çalışmadan bulunur.
• Akıllı editör: editör her değerin ne olduğunu bildiği için otomatik tamamlama, tanıma gitme ve tüm projede güvenli yeniden adlandırma sorunsuz çalışır.
• Tipler belge görevi görür: formatPrice(price: number): string başlığı, fonksiyonun gövdesini okumadan nasıl kullanılacağını anlatır.
• Büyük projelerde güvenli değişiklik: bir fonksiyonun parametrelerini değiştirdiğinde derleyici güncellenmesi gereken her yeri listeler.

Projeyi kurmak

1. 1
   TypeScript'i kur

   Proje klasöründe npm install --save-dev typescript komutunu çalıştır. Derleyici node_modules içine kurulur ve npx tsc ile çağrılır.

2. 2
   Ayar dosyasını oluştur

   npx tsc --init, önerilen ayarlarla bir tsconfig.json dosyası oluşturur.

3. 3
   Kodu yaz

   Kodunu src/index.ts dosyasına yaz.

4. 4
   Derle ve çalıştır

   npx tsc tüm projeyi denetler ve JavaScript'i dist/ klasörüne yazar; ardından node dist/index.js ile çalıştır.

{
  "compilerOptions": {
    "target": "es2022",
    "module": "nodenext",
    "strict": true,
    "rootDir": "src",
    "outDir": "dist"
  }
}

.ts dosyalarını doğrudan çalıştırmak

Modern Node.js (22.18 ve daha yeni sürümler, Node.js 24 dâhil) bir .ts dosyasını doğrudan çalıştırabilir: node index.ts. Bunun için tip silme (type stripping) yöntemi kullanılır: Node.js tipleri kesip atar ve geriye kalan JavaScript'i çalıştırır. tsx aracı aynı işi Node.js'in eski sürümlerinde de yapar.

node src/index.ts      # Node.js 22.18+: strip the types and run
npx tsx src/index.ts   # tsx: run TypeScript on older Node.js too
npx tsc --noEmit       # only check the types, write no files