CodeBlanks Logo Icon CodeBlanks
Giriş Yap Kayıt Ol

Özet - keyof ve typeof

Operatörlerle güvenli bir ayar yöneticisi yazarsın.

Özet - keyof ve typeof

keyof bir türün anahtarlarını, typeof bir değerin türünü verir. İkisini birleştirerek: typeof ile bir nesneden tür türet, keyof ile anahtarlarını al, dizin erişimiyle güvenli değer getiren fonksiyonlar yaz. Bu, ayar yöneticisi gibi yapılar için idealdir.

const ayarlar = { tema: "koyu", dil: "tr" };
type AyarTip = typeof ayarlar;
type AyarAnahtar = keyof AyarTip;
function al(k: AyarAnahtar): AyarTip[AyarAnahtar] {
  return ayarlar[k];
}

Uygulama Ayar yöneticisi

ayarlar değişkenine { tema: "koyu", dil: "tr" } nesnesini ata. AyarTip türünü typeof ayarlar olarak tanımla. AyarAnahtar türünü keyof AyarTip olarak tanımla. al(k: AyarAnahtar): AyarTip[AyarAnahtar] fonksiyonunu yaz; gövdesi return ayarlar[k]; olsun. al("tema") sonucunu console.log ile yazdır.

Başlangıç kodu

index.ts
// ayarlar değişkenine { tema: "koyu", dil: "tr" } ata
// AyarTip türünü ayarlar'ın türü olarak tanımla
// AyarAnahtar türünü AyarTip'in anahtarları olarak tanımla
// al fonksiyonu AyarAnahtar parametre alsın
// dönüş türü AyarTip'in AyarAnahtar indeksi olsun
// gövde return ayarlar[k]; olsun
// tema anahtarının değerini al ile getir ve yazdır

Örnek çözüm

index.ts
const ayarlar = { tema: "koyu", dil: "tr" };
type AyarTip = typeof ayarlar;
type AyarAnahtar = keyof AyarTip;
function al(k: AyarAnahtar): AyarTip[AyarAnahtar] {
  return ayarlar[k];
}
console.log(al("tema"));

Beklenen çıktı

koyu

Soru ve cevaplar

Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.

1 Bir ayar nesnesinden güvenli özellik erişimi için hangi sıra izlenir?

  • dizin erişimi, keyof, typeof
  • typeof ile tür türet, keyof ile anahtar al, dizin erişimiyle değer getir Doğru cevap
  • keyof ile anahtar al, typeof ile tür türet, dizin erişimi
  • typeof, dizin erişimi, keyof

Açıklama: Önce typeof ile nesneden tür türetilir, sonra keyof ile anahtarlar alınır, son olarak dizin erişimiyle güvenli değer getirilir. Bu sıra bozulursa tür düzeyinde çıkarım çalışmaz.

2 Dizin erişim dönüş türü

Soru 
const ayarlar = { tema: "koyu", dil: "tr" };
type AyarTip = typeof ayarlar;
type AyarAnahtar = keyof AyarTip;
function al(k: AyarAnahtar): ____ {
  return ayarlar[k];
}
Cevap 
const ayarlar = { tema: "koyu", dil: "tr" };
type AyarTip = typeof ayarlar;
type AyarAnahtar = keyof AyarTip;
function al(k: AyarAnahtar): AyarTip[AyarAnahtar] {
  return ayarlar[k];
}

Açıklama: Dönüş değeri ayarlar[k] olduğundan ve k AyarAnahtar olduğundan dönüş türü AyarTip[AyarAnahtar] olmalıdır. Yalnızca AyarTip veya string çok dar/geniş; AyarAnahtar ise anahtar türüdür.

3 Operatörleri eşleştir

Kavram Anlamı
typeof ayarlar Değerden tür türetir
keyof AyarTip Türün anahtarlarını verir
AyarTip[AyarAnahtar] Anahtarın değer türü
al("tema") Güvenli değer getirme

Orta seviye bölümündeki tüm dersler

1 Sınıflar

  1. Class temelleri
  2. Constructor ve alanlar
  3. Metotlar
  4. Statik üyeler
  5. Özet - Sınıflar

2 Erişim belirteçleri

  1. public
  2. private
  3. protected
  4. Parametre özellikleri
  5. Özet - Erişim belirteçleri

3 Readonly özellikler

  1. readonly alanlar
  2. Readonly parametre
  3. Readonly vs const
  4. Özet - Readonly

4 Generic'ler

  1. Generic nedir?
  2. Generic fonksiyonlar
  3. Generic sınıflar
  4. Çoklu tür parametresi
  5. Özet - Generic'ler

5 Generic kısıtları

  1. extends kısıtı
  2. keyof kısıtı
  3. Default tür parametresi
  4. Özet - Generic kısıtları

6 Utility types

  1. Partial
  2. Required ve Pick
  3. Omit ve Record
  4. Özet - Utility types

7 keyof ve typeof

  1. keyof operatörü
  2. typeof operatörü
  3. keyof ile indexing
  4. Özet - keyof ve typeof

8 Mapped types

  1. Mapped type nedir?
  2. Readonly mapped type
  3. Optional mapped type
  4. Özet - Mapped types

9 Conditional types

  1. Conditional type nedir?
  2. Distributive conditional
  3. Conditional ile mantık
  4. Özet - Conditional types

10 infer

  1. infer anahtar kelimesi
  2. Promise'ten değer çıkarma
  3. Dizi eleman türü
  4. Özet - infer

11 Decorator'lar

  1. Decorator nedir?
  2. Method decorator
  3. Property decorator
  4. Decorator fabrikaları
  5. Özet - Decorator'lar

12 Modüller

  1. export ve import
  2. Default export
  3. Re-export
  4. Type-only import
  5. Özet - Modüller

13 Namespace'ler

  1. Namespace nedir?
  2. İç içe namespace
  3. Namespace vs module
  4. Özet - Namespace'ler

14 Declaration dosyaları

  1. .d.ts nedir?
  2. Ambient module
  3. Triple-slash directive
  4. Özet - Declaration dosyaları

15 İleri sınıflar

  1. abstract sınıf
  2. implements
  3. Get ve set
  4. Özet - İleri sınıflar

16 Type assertion

  1. as anahtar kelimesi
  2. angle bracket syntax
  3. Type assertion vs casting
  4. unknown'dan cast
  5. Özet - Type assertion

17 Proje: Kütüphane paketi

  1. Paket tasarımı
  2. Türleri dışa aktarma
  3. Generic yardımcılar
  4. Bildirim dosyası
  5. Birleştirme

18 Proje: Quiz uygulaması

  1. Soru modeli
  2. Soru havuzu
  3. Cevap kontrolü
  4. Skor hesaplama
  5. Birleştirme

19 Proje: Hava durumu

  1. Hava durumu modeli
  2. API yanıtı tipi
  3. Veri dönüştürme
  4. Görüntüleme
  5. Birleştirme

20 Orta seviye finali

  1. Meydan okuma 1: Sınıflar
  2. Meydan okuma 2: Generic'ler
  3. Meydan okuma 3: Tür sistemleri
  4. Meydan okuma 4: Mini uygulama