Frontend Academy · Ders

TypeScript Neden Kullanılır: Türler Derleme Zamanında Hataları Yakalar

TypeScript'in değer önerisini öğrenin: statik analiz, IDE otomatik tamamlama ve çalışma zamanı hatalarının bütün bir sınıfını dağıtımdan önce ortadan kaldırma.

TypeScript Neden Kullanılır: Türler Derleme Zamanında Hataları Yakalar, CoddyKit'te ücretsiz bir Frontend Academy dersidir. Bu, 4 dersinin 1. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, Frontend Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. Frontend Academy kursu toplamda 4 dersten oluşur.

JavaScript'in Dinamik Tür Sorunu

JavaScript türleri hiçbir zaman denetlemez. Bir işlevi yanlış bağımsız değişken türleriyle çağırabilir, var olmayan bir özelliğe erişebilir veya bir nesnenin beklendiği yerde null aktarabilirsiniz; hata yalnızca çalışma zamanında, hatta üretim ortamında bile ortaya çıkabilir.

// JS: no error until runtime
function greet(user) {
  return `Hello, ${user.name.toUpperCase()}`;
}
greet(null); // TypeError: Cannot read properties of null

TypeScript: Geliştirme Zamanında Türler

TypeScript, JavaScript'e statik bir tür sistemi ekler. TypeScript derleyicisi (tsc), kodunuzu çalışmadan önce inceler ve siz yazarken tür hatalarını bildirir. Kullanıcıyı çökertebilecek aynı hata, düzenleyicinizde yakalanır.

// TS: error caught immediately
function greet(user: { name: string }) {
  return `Hello, ${user.name.toUpperCase()}`;
}
greet(null); // Error: Argument of type 'null' is not assignable to parameter

TypeScript JavaScript'e Derlenir

TypeScript, JavaScript'in bir üst kümesidir; geçerli tüm JS kodları geçerli TS kodlarıdır. Derleyici, tür açıklamalarını kaldırır ve tüm tarayıcılarda veya Node.js ortamlarında çalışabilen yalın JavaScript üretir. Türler yalnızca geliştirme zamanında vardır.

// TypeScript source:
function add(a: number, b: number): number {
  return a + b;
}

// Compiled JavaScript:
function add(a, b) {
  return a + b;
}

IDE Otomatik Tamamlama ve IntelliSense

TypeScript, VSCode'un IntelliSense özelliğine güç verir. Türü belirlenmiş bir nesnenin özelliğine eriştiğinizde düzenleyici hangi özelliklerin var olduğunu tam olarak bilir ve bunları önerir. Yanlış yazılmış özellik adları hemen işaretlenir; kodu çalıştırmanız gerekmez.

Yeniden Düzenleme Güveni

JavaScript'te bir işlevi yeniden adlandırmak veya imzasını değiştirmek, dikkatli bir manuel arama gerektirir. TypeScript'te derleyici, güncellenmesi gereken her çağrı noktasını size bildirir; yeniden düzenleme güvenli ve mekanik hale gelir.

Kendini Belgeleyen Kod

Tür açıklamaları, verilerin beklenen yapısını belgeler. processOrder(order: Order): Promise<Invoice> gibi bir işlev imzası, okuyucuya bunun tam olarak ne kabul ettiğini ve ne döndürdüğünü anlatır — uygulamayı okumaya gerek kalmaz.

TypeScript'e Geçiş Süreci

Her şeyi bir kerede dönüştürmeniz gerekmez. TypeScript aşamalı olarak entegre edilebilir: yeni dosyalara türler ekleyin, kritik kod için .ts uzantısını kullanın, eski kod için .js dosyalarını koruyun. tsconfig içinde allowJs: true ayarı her ikisinin birlikte kullanılmasına olanak tanır.

Yalnızca Tür İçeren İçe Aktarmalar — Çalışma Zamanı Maliyeti Yok

TypeScript türleri ve arayüzleri derleme zamanında silinir. Üretim paketine sıfır bayt eklerler. Türler yalnızca geliştirici aracıdır — performans ücretsizdir, bedeli üretkenlikle ödenir.

TypeScript Ekosistemi

DefinitelyTyped (@types/*), binlerce JavaScript kitaplığı için tür tanımları sağlar (React, Lodash, Node.js yerleşik modülleri). Bunları kitaplığın yanında yükleyin: npm install -D @types/node.

JavaScript Üst Kümesi — Düşük Geçiş Maliyeti

JavaScript'in tamamı geçerli TypeScript olduğundan, bir .js dosyasını .ts olarak yeniden adlandırıp derleyiciyi hemen çalıştırabilirsiniz. Siz açıklamalar ekledikçe derleyici tür hatalarını aşamalı olarak ortaya çıkarır.

TypeScript'in Tür Çıkarımı

TypeScript, atamalardan türleri çıkarır — her değişkene açıklama eklemeniz gerekmez. const n = 42 ifadesinin türü sayı olarak çıkarılır. let greeting = 'Hello' ifadesinin türü dizedir. Açık açıklamalar yalnızca çıkarımın yetersiz olduğu veya belgeleme gerektiği durumlarda kullanılır.

const count = 0;        // inferred: number
const name = 'Alice';   // inferred: string
const active = true;    // inferred: boolean
// vs explicit:
const id: number = 42;

Kısa Kontrol

TypeScript tür hatalarını ne zaman bildirir?

Özet: TypeScript Neden Kullanılır

TypeScript, tür hatalarını çalışma zamanında değil, derleme zamanında yakalar. Türleri yalnızca geliştirici araçları olarak ekler — çalışma zamanı maliyeti sıfırdır. Tümleşik geliştirme ortamı IntelliSense'i, güvenli yeniden düzenleme ve kendini belgeleyen API'ler başlıca yararlarıdır. JavaScript'in üst kümesidir ve aşamalı olarak benimsenebilir.

Sıkça Sorulan Sorular

“TypeScript Neden Kullanılır: Türler Derleme Zamanında Hataları Yakalar” dersi ücretsiz mi?

Evet — “TypeScript Neden Kullanılır: Türler Derleme Zamanında Hataları Yakalar” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve Frontend Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. Frontend Academy kursu toplamda 4 dersten oluşur.

“TypeScript Neden Kullanılır: Türler Derleme Zamanında Hataları Yakalar” dersinde ne öğreneceğim?

TypeScript'in değer önerisini öğrenin: statik analiz, IDE otomatik tamamlama ve çalışma zamanı hatalarının bütün bir sınıfını dağıtımdan önce ortadan kaldırma. Frontend Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.

Frontend Academy öğrenmeye başlamak için deneyim gerekli mi?

Önceden deneyim gerekmez. CoddyKit'te Frontend Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 1. dersidir.

“TypeScript Neden Kullanılır: Türler Derleme Zamanında Hataları Yakalar” dersi ne kadar sürer?

Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.

Bu Frontend Academy dersinde kod yazıp çalıştırabilir miyim?

Evet. Her Frontend Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.

Bu kursun tüm dersleri

TypeScript Neden Kullanılır: Türler Derleme Zamanında Hataları Yakalar
İlkel Türler, Birleşimler ve Tür Takma Adları
Arayüzler ve Nesne Türleri
TS Derleme ve tsconfig.json

← Frontend Academy Sayfasına Dön