May 10, 2025

•

3 minute read

Function dengan Banyak Parameter? Pakai Object Aja

Pernah gak sih, kamu manggil sebuah function di codebase (entah buatan sendiri atau warisan leluhur dev sebelumnya), terus isinya kayak gini:

sendEmail(
  "john@example.com", 
  "Hi John", 
  "Don’t forget the meeting", 
  false, 
  "info", 
  5000
);

Terus kamu mikir… “Yang false ini maksudnya apa ya? Jangan-jangan malah harusnya true?”

Yap. Selamat datang di dunia function dengan parameter berderet, tempat di mana error terjadi bukan karena logic, tapi karena kamu salah urut atau lupa arti dari parameter kelima.

Nah, daripada hidup kita penuh rasa ragu dan scrolling ke definisi function tiap saat, kenapa gak pakai pendekatan yang lebih santuy tapi powerful?

Yuk kita bahas best practicenya: pake object sebagai parameter kalau udah lebih dari dua. Kenapa? Gini ceritanya…

🧩 Analogi Dulu, Biar Enak

Bayangin kamu lagi diminta beli barang ke Indomaret. Temen kamu ngasih list belanjaan gini:

beliBarang(
  "Teh Botol", 
  2, 
  "Aqua 600ml", 
  1, 
  true
);

Tunggu… mana yang teh, mana yang air putih, dan true itu maksudnya apaan?

Lebih enak kan kalau dia bilang:

beliBarang({
  minuman1: { nama: "Teh Botol", jumlah: 2 },
  minuman2: { nama: "Aqua 600ml", jumlah: 1 },
  pakaiKantong: true,
});

Jelas. Terstruktur. Gak bikin kamu nelpon balik nanya “Ini beneran teh botol 2?”

😵 Masalah Function dengan Parameter Berderet

Kita lihat contoh function di bawah ini:

function createNotification(
  title: string,
  message: string,
  type: "success" | "error" | "info",
  duration: number,
  isPersistent: boolean
) {
  // ...
}

Ketika dipanggil:

createNotification(
  "Login Success", 
  "Welcome back!", 
  "success", 
  3000, 
  false
);

Masalahnya:

Gak keliatan maksudnya 3000 dan false itu apa.
Urutan penting banget. salah urutan function bisa tidak berjalan.

✅ Solusi Elegan: Pakai Object sebagai Parameter

Yuk refactor function-nya menggunakan object sebagai parameter:

type NotificationOptions = {
  title: string;
  message: string;
  type: "success" | "error" | "info";
  duration?: number;
  isPersistent?: boolean;
};

function createNotification({
  title,
  message,
  type,
  duration = 3000,
  isPersistent = false,
}: NotificationOptions) {
  // ...
}

Sekarang begini cara memanggilnya:

createNotification({
  title: "Login Success",
  message: "Welcome back!",
  type: "success",
});

Parameternya dibolak-balik juga functionnya masih jalan:

createNotification({
  type: "success",
  message: "Welcome back!",
  title: "Login Success",
});

Dipanggil dengan parameter yang lengkap

createNotification({
  title: "Server Down",
  message: "Call DevOps ASAP!",
  type: "error",
  duration: 5000,
  isPersistent: true,
});

Lebih readable, kan? #angguk-angguk

🎁 Bonus: Pakai TypeScript Jika Ingin Hidup Lebih Indah

Dengan pendekatan ini, TypeScript jadi makin berguna karena:

Auto-suggest: Kamu tinggal ketik { title: " maka editor langsung bantuin kasih suggestion.
Error catching: Salah ketik properti? TypeScript ngamuk duluan.
Optional parameter? Tinggal tambahin ? di tipe-nya. Gak perlu overload yang ribet.

🕳️ Tapi Hati-Hati…

Satu edge case yang sering kejadian: kalau lupa isi parameter, destructuring langsung error.

Misalnya kamu nulis:

createNotification(); // ❌ error: Cannot destructure 'undefined'

Solusinya: kasih default kosong di parameter utama:

function createNotification({
  title,
  message,
  type,
  duration = 3000,
  isPersistent = false,
}: NotificationOptions = {} as NotificationOptions) {
  // ...
}

Atau kalau kamu lebih suka cara aman:

function createNotification(options?: NotificationOptions) {
  const {
    title = "Default Title",
    message = "Default Message",
    type = "info",
    duration = 3000,
    isPersistent = false,
  } = options || {};
}

Jadi Typescript gak langsung marah-marah kalau functionnya dipanggil tanpa argumen.

✨ TLDR

Kalau function kamu punya lebih dari dua parameter, apalagi yang gak selalu dibutuhkan semua, pakai object sebagai parameter.

Keuntungannya:

Bikin kode kamu lebih jelas dan self-documenting
Gak pusing soal urutan
Lebih tahan perubahan di masa depan
TypeScript bisa bantuin lebih maksimal

🚀 Penutup: Kode yang Enak Dibaca = Kode yang Disayang

Di dunia nyata, yang baca kode kamu itu gak cuma mesin. Tapi juga rekan satu tim, bahkan kamu sendiri 6 bulan lagi (dengan kondisi ngantuk dan overthinking). Jadi, kenapa gak bantu diri sendiri dan orang lain dengan bikin function yang lebih jelas, lebih fleksibel, dan lebih TypeScript-friendly?

Mulai sekarang, kalau kamu lihat function dengan 4–5 parameter, coba tanya ke diri sendiri: