Anahtarları yeniden eşleme ve şablon değişmez türleri
Anahtarları “as” ile yeniden eşleyin, şablon değişmezleriyle (Capitalize/Uncapitalize) anahtarlar oluşturun ve özellikleri ad kalıplarına göre filtreleyin.
Anahtarları yeniden eşleme ve şablon değişmez türleri, CoddyKit'te ücretsiz bir TypeScript Academy dersidir. Bu, 3 dersinin 2. 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, TypeScript Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. TypeScript Academy kursu toplamda 3 dersten oluşur.
Giriş
Amaç: Özellikleri ad örüntülerine göre yeniden adlandırmak, oluşturmak veya kaldırmak için anahtar yeniden eşlemeyi (as yan tümcesi) şablon dize türleriyle kullanın.
- Anahtarları yeniden adlandırma:
K as NewK neverile anahtarları filtreleme- Adları birleştirme:
`get${Capitalize<K>}`
Anahtarları yeniden adlandırma
Anahtarları yeniden adlandırın. Örnek: Alt çizgili adları camelCasee biçimine dönüştürün.
type Original = { first_name: string; last_name: string }
type Camelize<T> = {
[K in keyof T as K extends `${infer A}_${infer B}`
? `${A}${Capitalize<B>}`
: K]: T[K]
}
type UserCamel = Camelize<Original> // { firstName: string; lastName: string }Öne eke göre filtreleme
Eşleşmeyen anahtarları kaldırır. Şablon: Olay işleyicilerini `on${string}` ile filtreleyin.
type Props = { onClick: () => void; onSubmit: () => void; title: string }
type WithoutHandlers<T> = {
[K in keyof T as K extends `on${string}` ? never : K]: T[K]
}
type Clean = WithoutHandlers<Props> // { title: string }Yöntemler oluşturma
Şablon adlarıyla uygulama programlama arayüzü yüzeyleri oluşturun: Alanlardan alıcılar oluşturmak için get${Capitalize<K>} örüntüsü kullanılır.
type Fields = "name" | "email"
type Getters<T extends string> = {
[K in T as `get${Capitalize<K>}`]: () => string
}
type ClientAPI = Getters<Fields>
// { getName: () => string; getEmail: () => string }Örüntüleri birleştirme
Tutarlı adlandırmayı büyük projeler genelinde güvence altına alarak güçlü adlar oluşturmak için birden çok şablonu birleştirin.
type Route = `/${"" | `${string}`}`
type HttpMethod = "get" | "post"
type Endpoints<T extends string, M extends string> = {
[K in T as `${M}_${K}`]: { path: `/${K}`; method: Uppercase<M> }
}
type API = Endpoints<"users" | "login", HttpMethod>
// { get_users: { path: "/users"; method: "GET" }, post_login: { path: "/login"; method: "POST" } }İpuçları ve dikkat edilmesi gerekenler
İpuçları:
Yeniden eşleme maliyetlidir; karmaşık türleri takma adlarla bölün.
Filtreler için basit şablonlar kullanın: `on${string}`, `data-${string}`.
Capitalize/Uncapitalize/Uppercase/Lowercase yardımcılarını kullanın.
Ad oluşturma aşırıya kaçarsa uygulama programlama arayüzünü sadeleştirin.
Ön eke göre filtreleme kontrolü
Hızlı kontrol: on ile başlayan özellikleri hangi eşlemeli tür örüntüsü kaldırır?
Özet
Özet: Anahtar yeniden eşlemeyle yeniden adlandırın ve filtreleyin; şablon dize türleriyle anahtarlar oluşturun; istenmeyenleri kaldırın.
Sıkça Sorulan Sorular
“Anahtarları yeniden eşleme ve şablon değişmez türleri” dersi ücretsiz mi?
Evet — “Anahtarları yeniden eşleme ve şablon değişmez türleri” 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 TypeScript Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. TypeScript Academy kursu toplamda 3 dersten oluşur.
“Anahtarları yeniden eşleme ve şablon değişmez türleri” dersinde ne öğreneceğim?
Anahtarları “as” ile yeniden eşleyin, şablon değişmezleriyle (Capitalize/Uncapitalize) anahtarlar oluşturun ve özellikleri ad kalıplarına göre filtreleyin. TypeScript 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.
TypeScript Academy öğrenmeye başlamak için deneyim gerekli mi?
Önceden deneyim gerekmez. CoddyKit'te TypeScript 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, 3 dersinin 2. dersidir.
“Anahtarları yeniden eşleme ve şablon değişmez türleri” 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 TypeScript Academy dersinde kod yazıp çalıştırabilir miyim?
Evet. Her TypeScript 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
- +/-readonly ve +/-? içeren eşlenmiş türler
- Anahtarları yeniden eşleme ve şablon değişmez türleri
- Dize kalıbı türleri (rota parametreleri, olay adları)