TypeScript ile Temiz ve Bakımı Kolay Kod Nasıl Yazılır

Temiz ve sürdürülebilir kod yazmak, uzun vadeli proje başarısı ve ekip üretkenliği için olmazsa olmazdır. Statik yazım ve güçlü özellikleriyle TypeScript, kod kalitesini artırmak için araçlar ve uygulamalar sunar. Bu makale, temiz ve sürdürülebilir TypeScript kodu yazma stratejilerini inceler.

1. Açıklayıcı Tür Açıklamalarını Kullanın

Tür açıklamaları, değişkenlerin, fonksiyonların ve nesnelerin amaçlanan kullanımını açıklığa kavuşturmaya yardımcı olur, böylece kodun anlaşılmasını ve sürdürülmesini kolaylaştırır.

function greet(name: string): string {
  return `Hello, ${name}`;
}

const user: { name: string; age: number } = {
  name: 'Alice',
  age: 30,
};

2. Nesne Şekilleri için Tür Takma Adları Yerine Arayüzleri Tercih Edin

Arayüzler, özellikle nesne şekillerini tanımlamak için, tip takma adlarına kıyasla daha çok yönlüdür ve genişletilebilir.

interface User {
  name: string;
  email: string;
}

const user: User = {
  name: 'Bob',
  email: 'bob@example.com',
};

3. Kaldıraç Türü Çıkarımı

TypeScript, bağlama göre türleri çıkarabilir, böylece açık tür açıklamalarına olan ihtiyacı azaltır ve kodu daha az ayrıntılı hale getirir.

const numbers = [1, 2, 3]; // TypeScript infers numbers as number[]
const sum = numbers.reduce((a, b) => a + b, 0); // TypeScript infers sum as number

4. Küçük, Odaklanmış Fonksiyonlar Yazın

Okunabilirliği ve bakım kolaylığını artırmak için fonksiyonları küçük tutun ve tek bir göreve odaklanın.

function calculateTax(amount: number, rate: number): number {
  return amount * rate;
}

function formatCurrency(amount: number): string {
  return `$${amount.toFixed(2)}`;
}

5. Daha İyi Tip Güvenliği İçin Tip Koruyucuları Kullanın

Tür koruyucuları, işlemlerin doğru türlerde gerçekleştirilmesini sağlayarak çalışma zamanı hatalarını azaltır.

function isString(value: any): value is string {
  return typeof value === 'string';
}

function printLength(value: string | number) {
  if (isString(value)) {
    console.log(value.length);
  } else {
    console.log('Not a string');
  }
}

6. Kodu Modüllere Organize Etme

Kod tabanını yönetilebilir tutmak ve anlaşılırlığı artırmak için ilgili kodları modüllere ayırın.

// user.ts
export interface User {
  name: string;
  email: string;
}

// utils.ts
export function greet(user: User): string {
  return `Hello, ${user.name}`;
}

7. Hata İşlemeyi Uygula

Hataları zarif bir şekilde ele alın ve hata ayıklamayı kolaylaştırmak ve kullanıcı deneyimini iyileştirmek için anlamlı mesajlar sağlayın.

function fetchData(url: string): Promise {
  return fetch(url).catch((error) => {
    console.error('Failed to fetch data:', error);
    throw error;
  });
}

8. Kritik Bileşenler için Testler Yazın

Test, kodun beklendiği gibi davranmasını sağlar ve sorunları erken yakalamaya yardımcı olur. Birim testleri yazmak için Jest gibi test çerçevelerini kullanın.

import { greet } from './utils';

test('greet function', () => {
  const user = { name: 'Charlie', email: 'charlie@example.com' };
  expect(greet(user)).toBe('Hello, Charlie');
});

Çözüm

Bu uygulamaları takip ederek, anlaşılması, genişletilmesi ve yönetilmesi daha kolay, temiz ve bakımı kolay TypeScript kodu yazabilirsiniz. TypeScript'in özelliklerini etkili bir şekilde kullanmak, daha yüksek kaliteli kod ve daha bakımı kolay bir kod tabanına yol açar.