İçeriğe geç
Codary
TS
TypeScript Modül 1: TypeScript'e Giriş ve Temel Tipler

1.1 TypeScript Nedir? Neden Kullanılır?

Kolay
Ders 1 / 18 %0 Ders listesi
1.1 TypeScript Nedir? Neden Kullanılır? 1.2 Temel Tipler: string, number, boolean 1.3 Diziler ve Tuple 1.4 Enum ve Literal Tipler 2.1 Fonksiyon Parametre ve Dönüş Tipleri 2.2 Opsiyonel ve Varsayılan Parametreler 2.3 Fonksiyon Tipleri ve Callback 2.4 Hatayı Bul: KDV Hesabı 10020 Çıkıyor 3.1 Interface ile Nesne Şekli Tanımlama 3.2 Type Alias, Union ve Intersection 3.3 Interface mi Type mı? Fonksiyon Alanları 3.4 Hatayı Bul: Opsiyonel Alan Uygulamayı Çökertiyor 4.1 Generic Fonksiyonlar 4.2 Generic Interface: API Cevabı Modelleme 4.3 Yardımcı Tipler: Partial, Pick, Omit, Record 5.1 Sınıflar ve Erişim Belirleyiciler 5.2 implements ve Abstract Sınıflar 5.3 Proje: Tip Güvenli Envanter Sistemi
Misafir olarak çalışıyorsun. İlerlemeni kaydetmek ve sonraki dersleri açmak için giriş yap. Giriş yap / Kayıt ol

TypeScript Nedir?

JavaScript çok esnektir: bir değişkene önce sayı, sonra metin koyabilirsin. Küçük bir sayfada sorun olmaz. Ama yüzlerce dosyalı bir projede, bir fonksiyonun sayı beklerken metin aldığını ancak kullanıcı hata aldığında fark edersin.
Örnek KodJS
function kdvEkle(fiyat) {
  return fiyat * 1.2;
}
console.log(kdvEkle("100"));   // 120 (şans eseri çalıştı)
console.log(kdvEkle("yüz"));   // NaN (hata ancak çalışınca ortaya çıktı)
TypeScript, Microsoft'un geliştirdiği ve JavaScript'e tip sistemi ekleyen dildir. Bir değerin hangi türde olacağını yazarsın; yanlış kullanım kod daha çalışmadan editörde kırmızı çizgiyle gösterilir.
Örnek KodTS
function kdvEkle(fiyat: number): number {
  return fiyat * 1.2;
}
kdvEkle("yüz");   // Hata: string, number parametresine verilemez

Nasıl çalışır?

  1. TypeScript kodu (.ts dosyası) yazarsın.
  2. Derleyici (tsc) tipleri kontrol eder ve hataları gösterir.
  3. Tipler silinir ve geriye düz JavaScript kalır. Tarayıcı bu JavaScript'i çalıştırır.
Her geçerli JavaScript kodu aynı zamanda geçerli TypeScript kodudur. Yani JavaScript bilgin olduğu gibi işine yarar; üzerine sadece tipleri eklersin.

Neden bu kadar yaygın?

  • Otomatik tamamlama: Editör bir nesnenin hangi alanları olduğunu bilir ve önerir.
  • Güvenli değişiklik: Bir alanın adını değiştirdiğinde kullanıldığı her yer hata verir; hiçbirini atlamazsın.
  • Kendini anlatan kod: function gonder(email: string, deneme: number) imzası ne beklendiğini söyler.
Angular, VS Code, Slack ve pek çok büyük uygulama TypeScript ile yazılır.

Bu editör kodunu JavaScript'e çevirip çalıştırır ama tip hatalarını göstermez. Gerçek projede tip hatalarını VS Code ve tsc anında gösterir. Bu yüzden derslerde tipleri doğru yazmaya kendin dikkat etmelisin; kontrol, kodunda istenen tiplerin olup olmadığına da bakar.
Görev Kendin yazarak öğren
  1. string tipinde mesaj adında bir sabit tanımla, değeri "Merhaba TypeScript!" olsun.
  2. number tipinde surum adında bir sabit tanımla, değeri 5 olsun.
  3. Önce mesaj'ı, sonra template literal ile TypeScript 5 ile tip güvenli kod satırını yazdır.

    Bilgi Kontrol Quizi

    TypeScript kodu tarayıcıda çalışmadan önce neye dönüştürülür?

    main.ts

    Parantez ve tırnaklar kendiliğinden kapanır. Tab girinti ekler; editörden çıkmak için önce Esc, sonra Tab.

    Çıktı Konsolu: Hazır 
    Çıktı görmek için "Kodu Çalıştır" butonuna basın...