Cara Menulis Kode yang Bersih dan Mudah Dipelihara dengan TypeScript

Menulis kode yang bersih dan mudah dirawat sangat penting untuk keberhasilan proyek jangka panjang dan produktivitas tim. TypeScript, dengan pengetikan statis dan fitur-fiturnya yang canggih, menyediakan alat dan praktik untuk meningkatkan kualitas kode. Artikel ini membahas strategi untuk menulis kode TypeScript yang bersih dan mudah dirawat.

1. Gunakan Anotasi Tipe Deskriptif

Anotasi tipe membantu memperjelas tujuan penggunaan variabel, fungsi, dan objek, sehingga kode lebih mudah dipahami dan dipelihara.

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

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

2. Lebih Memilih Antarmuka Dibandingkan Alias ​​Tipe untuk Bentuk Objek

Antarmuka lebih fleksibel dan dapat diperluas dibandingkan dengan alias tipe, terutama untuk mendefinisikan bentuk objek.

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

const user: User = {
  name: 'Bob',
  email: '[email protected]',
};

3. Inferensi Jenis Leverage

TypeScript dapat menyimpulkan tipe berdasarkan konteks, mengurangi keperluan akan anotasi tipe yang eksplisit dan membuat kode tidak terlalu bertele-tele.

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. Menulis Fungsi Kecil dan Terfokus

Jaga fungsi tetap kecil dan fokus pada satu tugas untuk meningkatkan keterbacaan dan kemudahan pemeliharaan.

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

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

5. Gunakan Pelindung Huruf untuk Keamanan Huruf yang Lebih Baik

Pelindung tipe membantu memastikan bahwa operasi dilakukan pada tipe yang benar, mengurangi kesalahan waktu proses.

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. Mengatur Kode ke dalam Modul

Atur kode terkait ke dalam modul untuk menjaga basis kode tetap mudah dikelola dan meningkatkan kejelasan.

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

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

7. Terapkan Penanganan Kesalahan

Tangani kesalahan dengan baik dan berikan pesan yang bermakna untuk membantu debugging dan meningkatkan pengalaman pengguna.

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

8. Tulis Tes untuk Komponen Kritis

Pengujian memastikan bahwa kode berfungsi sebagaimana mestinya dan membantu mendeteksi masalah lebih awal. Gunakan kerangka kerja pengujian seperti Jest untuk menulis pengujian unit.

import { greet } from './utils';

test('greet function', () => {
  const user = { name: 'Charlie', email: '[email protected]' };
  expect(greet(user)).toBe('Hello, Charlie');
});

Kesimpulan

Dengan mengikuti praktik ini, Anda dapat menulis kode TypeScript yang bersih dan mudah dikelola, yang lebih mudah dipahami, diperluas, dan dikelola. Memanfaatkan fitur-fitur TypeScript secara efektif menghasilkan kode berkualitas lebih tinggi dan basis kode yang lebih mudah dikelola.