Eşlenmiş Türler ve Koşullu Türler
Bir türün tüm özelliklerini dönüştürmek için eşlenmiş türler oluşturun ve gelişmiş tür düzeyi mantığı için infer ile koşullu türleri kullanın.
Eşlenmiş Türler ve Koşullu Türler, CoddyKit'te ücretsiz bir Frontend Academy dersidir. Bu, 4 dersinin 3. 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.
Eşlemeli Türler — Her Özelliği Dönüştürme
Eşlemeli türler, bir türün anahtarları üzerinde yineleme yapar ve bunları dönüştürür. Partial, Readonly ve Record yardımcı türlerinin temelini oluştururlar.
// Partial implemented as a mapped type:
type MyPartial<T> = {
[K in keyof T]?: T[K];
};
// Readonly:
type MyReadonly<T> = {
readonly [K in keyof T]: T[K];
};as ile Anahtarları Yeniden Eşleme
Anahtar adlarını yeniden eşlemek için eşleme ifadesinde as kullanınız. Güçlü dönüşümler için bunu şablon değişmez türleriyle birleştiriniz.
type Getters<T> = {
[K in keyof T as `get${Capitalize<string & K>}`]: () => T[K];
};
type UserGetters = Getters<{ name: string; age: number }>;
// { getName: () => string; getAge: () => number }never ile Özellikleri Filtreleme
Bu özelliği ortaya çıkan türden kaldırmak için anahtar yeniden eşlemesinden never döndürünüz.
// Keep only function-valued properties:
type FunctionProperties<T> = {
[K in keyof T as T[K] extends Function ? K : never]: T[K];
};Koşullu Türler — Türler için if/else
Koşullu türler T extends U ? TrueType : FalseType kalıbını kullanır. Çalışma zamanında değil, tür düzeyinde değerlendirilir.
type IsString<T> = T extends string ? true : false;
type A = IsString<string>; // true
type B = IsString<number>; // false
type Flatten<T> = T extends Array<infer E> ? E : T;
type StrArr = Flatten<string[]>; // string
type Num = Flatten<number>; // numberDağılımlı Koşullu Türler
T bir birleşim olduğunda koşullu türler her üye üzerine dağıtılır. string | number extends string ? ... her birini ayrı ayrı denetler: (string extends string ? ...) | (number extends string ? ...).
type ToArray<T> = T extends any ? T[] : never;
type StringOrNumberArray = ToArray<string | number>;
// string[] | number[] (not (string | number)[])Türleri Çıkarmak için infer Kullanımı
infer R, TypeScript'in doldurduğu bir tür değişkeni tanıtır. Bir tür yapısının bölümlerini yakalamanızı sağlar.
type UnwrapPromise<T> = T extends Promise<infer U> ? U : T;
type Resolved = UnwrapPromise<Promise<string>>; // string
type Direct = UnwrapPromise<number>; // numberŞablon Değişmez Türleri
Şablon değişmez türleri, şablon değişmezleriyle aynı ters tırnak söz dizimini kullanır; ancak tür düzeyinde çalışarak dize değişmezlerinin birleşimlerinden birleşim türleri oluşturur.
type Side = 'top' | 'right' | 'bottom' | 'left';
type PaddingKey = `padding-${Side}`;
// 'padding-top' | 'padding-right' | 'padding-bottom' | 'padding-left'
type EventName<T extends string> = `on${Capitalize<T>}`;
type ClickEvent = EventName<'click'>; // 'onClick'Eşlemeli ve Koşullu Türleri Birleştirme
En güçlü TypeScript kalıpları her ikisini de birleştirir. Yerleşik required, partial, readonly ve record türlerinin tümü eşlemeli türlerdir.
// Make all functions in an object async:
type Asyncify<T> = {
[K in keyof T]: T[K] extends (...args: infer A) => infer R
? (...args: A) => Promise<R>
: T[K];
};DeepPartial — Özyinelemeli Yardımcı Tür
Yerleşik Partial yalnızca bir düzey derine iner. DeepPartial, iç içe nesnelerde özyinelemeli olarak çalışır.
type DeepPartial<T> = {
[K in keyof T]?: T[K] extends object ? DeepPartial<T[K]> : T[K];
};Gerçek Dünya Kullanımı: API Yanıt Türleri
Eşlemeli ve koşullu türler, güçlü API tür türetmelerini mümkün kılar; örneğin bir nesnenin yalnızca JSON olarak serileştirilebilen özelliklerini çıkarabilirsiniz.
Aşırı Mühendislikten Kaçının
Karmaşık tür işlemleri kodun anlaşılmasını zorlaştırabilir. Her zaman şunu sorun: Daha basit bir tür takma adı veya arayüz daha açık olur mu? Türler, TypeScript bilginizi sergilemek yerine amacı belgelemelidir.
Hızlı Kontrol
T bir birleşim türü olduğunda T extends U ? A : B neye değerlendirilir?
Özet: Eşlemeli ve Koşullu Türler
Eşlemeli türler, [K in keyof T] ile anahtarlar üzerinde yineler. Anahtarları yeniden eşlemek için as kullanın. Filtrelemek için never döndürün. Koşullu türler: T extends U ? A : B. infer, tür değişkenlerini çıkarır. Şablon değişmez türleri, dize birleşimleri oluşturur. Her ikisini birleştirerek DeepPartial ve Asyncify gibi güçlü tür dönüşümleri yapabilirsiniz.
Sıkça Sorulan Sorular
“Eşlenmiş Türler ve Koşullu Türler” dersi ücretsiz mi?
Evet — “Eşlenmiş Türler ve Koşullu Türler” 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.
“Eşlenmiş Türler ve Koşullu Türler” dersinde ne öğreneceğim?
Bir türün tüm özelliklerini dönüştürmek için eşlenmiş türler oluşturun ve gelişmiş tür düzeyi mantığı için infer ile koşullu türleri kullanın. 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 3. dersidir.
“Eşlenmiş Türler ve Koşullu Türler” 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
- Generic'ler: T extends ve Kısıtlamalar
- Yardımcı Türler: Partial Required Pick Omit
- Eşlenmiş Türler ve Koşullu Türler
- Daraltma: typeof instanceof Ayırt Edilmiş Birleşimler