Meydan okuma 1: Tür matematiği
- TypeScript kursu
- İleri seviye
- Ders 54/57
- 6 dk
Template literal ve mapped'ı birleştiren bir görev çözersin.
Tür matematiği: template + mapped
Template literal türler birleşenleri dize olarak birleştirir; mapped türler ise bir nesnenin anahtarlarını yeniden üretir. İkisini birleştirerek her özellik için getX gibi isimler türetebilirsin.
type Getters<T> = {
[K in keyof T as `get${Capitalize<string & K>}`]: () => T[K]
};
type Person = { name: string; age: number };
// { getName: () => string; getAge: () => number }Buradaki as yan tümcesi anahtarı yeniden adlandırır; Capitalize ise ilk harfi büyütür.
Uygulama Getter türü üret
Getters<T> türünü yaz: her K özelliği için get${Capitalize<K>} anahtarı üretsin, değer () => T[K] olsun. Person türü { name: string; age: number } olsun, PersonGetters alias'ını tanımla, bir değer oluşturup getName() sonucunu yazdır.
Başlangıç kodu
// Getters<T>: her özellik için getX() üretir
// Person: name: string, age: number
// PersonGetters = Getters<Person>
// bir değer oluştur ve getName() çağırıp yazdırÖrnek çözüm
type Getters<T> = {
[K in keyof T as `get${Capitalize<string & K>}`]: () => T[K]
};
type Person = { name: string; age: number };
type PersonGetters = Getters<Person>;
const g: PersonGetters = {
getName: () => "Ada",
getAge: () => 36,
};
console.log(g.getName());Beklenen çıktı
Ada
Uygulama Önekli tür üret
Prefixed<T, P> türünü yaz: her anahtarın başına P öneki eklensin (`${P}${K}`). Box alias'ını Prefixed<{ id: number }, "$"> ile tanımla, bir Box değeri oluştur ve $id alanını yazdır.
Başlangıç kodu
// Prefixed<T, P>: her anahtarı P önekiyle birleştirir
// { x: number } ve "$" için { $x: number }
// Box türünü Prefixed<{ id: number }, "$"> ile tanımla
// bir değer oluştur ve $id alanını yazdırÖrnek çözüm
type Prefixed<T, P extends string> = {
[K in keyof T as `${P}${string & K}`]: T[K]
};
type Box = Prefixed<{ id: number }, "$">;
const b: Box = { $id: 42 };
console.log(b.$id);Beklenen çıktı
42
Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 Aşağıdaki tanımlardan sonra `Getters<Person>` ne olur?
type Getters<T> = {
[K in keyof T as `get${Capitalize<string & K>}`]: () => T[K]
};
type Person = { name: string };- { getname: () => string }
- { GetName: () => string }
- { getName: () => string } Doğru cevap
- { name: () => string }
Açıklama: Template literal `get${Capitalize<...>}` `name` anahtarını `getName`'e çevirir; değer türü `() => T[K]` yani `() => string` olur.
2 Anahtarı büyüt
type Getters<T> = {
[K in keyof T as `get${____<string & K>}`]: () => T[K]
};
type Getters<T> = {
[K in keyof T as `get${Capitalize<string & K>}`]: () => T[K]
};
Açıklama: İlk harfi büyütmek için `Capitalize` yerleşik türü kullanılır; `Uppercase` tüm harfleri büyütür.
3 Tür matematiği parçaları
| Kavram | Anlamı |
|---|---|
keyof T |
T'nin anahtarları |
Capitalize<S> |
ilk harfi büyütür |
`get${...}` |
dize öneki ekler |
as |
anahtarı yeniden adlandırır |