TypeScript di 2026: Fitur-Fitur yang Wajib Kamu Pakai

TypeScript bukan sekadar JavaScript dengan tipe data. Di 2026, TypeScript sudah menjadi bahasa utama di hampir semua project front-end dan back-end serius. Berikut fitur-fitur yang paling berguna dan sering dipakai tim profesional.

1. Satisfies Operator

satisfies memvalidasi bahwa sebuah value cocok dengan tipe tertentu, tanpa mengubah tipe inferensi-nya:

type Warna = "merah" | "hijau" | "biru";
type Palette = { [k: string]: Warna | Warna[] };

const palette = {
  merah: "merah",
  hijau: ["hijau", "biru"],
  primer: "merah",
} satisfies Palette;

// TypeScript tetap tahu bahwa palette.hijau adalah array
palette.hijau.map(w => w.toUpperCase()); // OK!

2. Template Literal Types

Buat tipe dari kombinasi string — sangat berguna untuk event name, route, dll:

type Method = "GET" | "POST" | "PUT" | "DELETE";
type Endpoint = "/users" | "/posts" | "/comments";

type Route = `${Method} ${Endpoint}`;
// "GET /users" | "GET /posts" | "POST /users" | ... dst.

function request(route: Route): Promise<unknown> {
  const [method, path] = route.split(" ");
  return fetch(path, { method });
}

request("GET /users");   // OK
request("PATCH /users"); // Error: tipe tidak cocok

3. Discriminated Union yang Rapi

Pola ini membuat penanganan berbagai state jadi type-safe:

type ApiState<T> =
  | { status: "loading" }
  | { status: "success"; data: T }
  | { status: "error"; pesan: string };

function render<T>(state: ApiState<T>): string {
  switch (state.status) {
    case "loading":
      return "Memuat...";
    case "success":
      return `Data: ${JSON.stringify(state.data)}`;
    case "error":
      return `Error: ${state.pesan}`;
  }
}

4. Mapped Types dan Utility Types Lanjutan

// Buat semua properti menjadi nullable
type Nullable<T> = { [K in keyof T]: T[K] | null };

// Buat versi "patch" (semua opsional) dari sebuah tipe
type Patch<T> = Partial<Pick<T, keyof T>>;

interface User {
  id: number;
  nama: string;
  email: string;
}

type UserUpdate = Patch<User>;
// { id?: number; nama?: string; email?: string; }

5. infer dalam Conditional Types

// Ambil tipe kembalian dari fungsi async
type AwaitedReturn<T extends (...args: any[]) => Promise<any>> =
  T extends (...args: any[]) => Promise<infer R> ? R : never;

async function ambilUser(): Promise<{ id: number; nama: string }> {
  return { id: 1, nama: "Budi" };
}

type HasilUser = AwaitedReturn<typeof ambilUser>;
// { id: number; nama: string }

6. Konfigurasi tsconfig.json yang Ketat

{
  "compilerOptions": {
    "strict": true,
    "noUncheckedIndexedAccess": true,
    "exactOptionalPropertyTypes": true,
    "noImplicitOverride": true,
    "target": "ES2022",
    "module": "NodeNext",
    "moduleResolution": "NodeNext"
  }
}

noUncheckedIndexedAccess sangat berguna — akses array arr[0] sekarang bertipe string | undefined, sehingga kamu dipaksa mengecek undefined sebelum pakai.

Penutup

TypeScript di 2026 bukan sekadar pelengkap — ia adalah fondasi. Semakin kamu memanfaatkan sistem tipenya, semakin sedikit bug yang lolos ke production.