Kıdemli Mühendisler İçin 5 İleri Düzey TypeScript Kalıbı

TypeScript, büyük ölçekli web geliştirme için endüstri standardı haline geldi. Çoğu geliştirici arayüzlerin ve tiplerin temellerini bilse de, gerçek güç ileri düzey tip sisteminde yatar. İşte sizi kıdemli bir mühendis olarak öne çıkaracak 5 kalıp.

1. Generic Constraints

Generics güçlüdür, ancak bazen neyin geçirilebileceğini sınırlamanız gerekir. extends burada en iyi yardımcınızdır.

interface HasId {
  id: string;
}

function getById<T extends HasId>(list: T[], id: string): T | undefined {
  return list.find((item) => item.id === id);
}

T'nin HasId'yi genişlettiğinden emin olarak, fonksiyon içinde .id'ye erişimin güvenli olduğunu garanti ediyoruz.

2. Conditional Types

Koşullu tipler, tek tip olmayan tip eşlemeleri oluşturmanıza olanak tanır. Sözdizimi JavaScript'teki üçlü operatöre benzer.

type IsString<T> = T extends string ? true : false;

type A = IsString<string>; // true
type B = IsString<number>; // false

Pratik bir kullanım örneği, bir union'dan tipleri filtrelemektir:

type Diff<T, U> = T extends U ? never : T;
type NonNullable<T> = Diff<T, null | undefined>;

3. Mapped Types

Mapped types, özellikleri dönüştürerek mevcut tiplere dayalı yeni tipler oluşturmanıza olanak tanır.

type ReadOnly<T> = {
  readonly [P in keyof T]: T[P];
};

interface User {
  name: string;
  age: number;
}

type ReadOnlyUser = ReadOnly<User>;

Değiştiricileri ekleyebilir veya kaldırabilirsiniz:

type Mutable<T> = {
  -readonly [P in keyof T]: T[P];
};

4. Template Literal Types

TypeScript 4.1'de tanıtılan bu özellik, string tiplerini doğrudan manipüle etmenize olanak tanır.

type World = 'world';
type Greeting = `hello ${World}`; // "hello world"

type Color = 'red' | 'blue';
type Quantity = 'light' | 'dark';

type Palette = `${Quantity}-${Color}`;
// "light-red" | "light-blue" | "dark-red" | "dark-blue"

Bu, CSS sınıfları veya olay adları gibi belirli bir kalıbı izleyen stringleri tiplemek için inanılmaz derecede kullanışlıdır.

5. infer Anahtar Kelimesi

Koşullu tipler içindeki infer anahtar kelimesi, diğer tiplerden tipleri çıkarmanıza olanak tanır.

type ReturnType<T> = T extends (...args: any[]) => infer R ? R : any;

function check(): boolean {
  return true;
}

type CheckReturn = ReturnType<typeof check>; // boolean

Burada TypeScript'ten bir fonksiyonun dönüş tipi R'yi "çıkarsamasını" ve döndürmesini istiyoruz.

Sonuç

Bu kalıplara hakim olmak, sağlam ve mükemmel geliştirici deneyimi (DX) sunan kütüphaneler ve yardımcı araçlar yazmanıza olanak tanır. İleri düzey TypeScript'in amacı karmaşıklık uğruna karmaşıklık değil, güvenlik ve ifade gücüdür.