TypeScript
Literal discriminant
Literal alanlarla ayrıştırma yapmayı öğrenirsin.
Literal discriminant
Discriminant alanının değeri bir literal türüdür; her üye kendi benzersiz literal değerini taşır. kind: "circle" gibi bir değer, TypeScript'e hangi üyede olduğunu söyler. Literal değerlerin kullanımı, daraltmanın kesin ve güvenli olmasını sağlar.
type Event =
| { type: "click"; x: number; y: number }
| { type: "scroll"; offset: number };
function handle(e: Event) {
if (e.type === "click") {
console.log(e.x, e.y); // click member
} else {
console.log(e.offset); // scroll member
}
}
Literal değerlerle daraltma
Discriminant literal olduğunda, TypeScript bir eşitlik kontrolüyle union'ı daraltır. e.type === "click" koşulu, Event union'ını yalnızca click üyesine indirir; koşul içinde e.x ve e.y güvenle kullanılır.
function handle(e: Event) {
if (e.type === "click") {
e.x; // number (click üyesi)
e.y; // number (click üyesi)
}
// Burada e.x erişilemez: e tekrar tam Event
}
Uygulama Literal discriminant ile olay işle
Event discriminated union türünü tanımla: "click" (x: number, y: number) ve "scroll" (offset: number) üyeleri, type discriminant alanıyla. handle(e: Event): string fonksiyonunu yaz. Eğer e.type === "click" ise `click at ${e.x},${e.y}` döndür; değilse `scroll ${e.offset}` döndür. console.log(handle({ type: "click", x: 10, y: 20 })) ve console.log(handle({ type: "scroll", offset: 5 })) ile sonuçları yazdır.
Örnek çözümü göster
type Event =
| { type: "click"; x: number; y: number }
| { type: "scroll"; offset: number };
function handle(e: Event): string {
if (e.type === "click") {
return `click at ${e.x},${e.y}`;
}
return `scroll ${e.offset}`;
}
console.log(handle({ type: "click", x: 10, y: 20 }));
console.log(handle({ type: "scroll", offset: 5 }));
Kendini test et
-
Discriminant alanın değeri hangi tür olmalıdır?
- Herhangi bir number
- Opsiyonel bir değer
- Her üyede farklı bir literal değer
- Her üyede aynı değer
Cevabı göster
Her üyede farklı bir literal değer — Discriminant alan her üyede farklı bir literal değer alır; bu sayede TypeScript bir eşitlik kontrolüyle union'ı tek üyeye daraltabilir.
-
Literal discriminant ile daraltma
type Event =
| { type: "click"; x: number; y: number }
| { type: "scroll"; offset: number };
function handle(e: Event) {
if (e.type === ____) {
return e.x + e.y;
}
return e.offset;
}
Cevabı göster
type Event =
| { type: "click"; x: number; y: number }
| { type: "scroll"; offset: number };
function handle(e: Event) {
if (e.type === "click") {
return e.x + e.y;
}
return e.offset;
}
-
Literal discriminant parçaları
- Literal değer
- her üyede benzersiz
- e.type === "click"
- click üyesine daraltır
- Discriminant alan
- literal türünde
- Eşitlik kontrolü
- daraltma yöntemi
Sıradaki ders: Pattern matching
