TypeScript - Parameter Opsional: Panduan untuk Pemula

Hai teman-teman, bakal bintang coding! Saya sangat senang menjadi panduanmu dalam perjalanan menarik ini ke dunia TypeScript. Hari ini, kita akan mengeksplorasi fitur kecil yang menyenangkan yang disebut "Parameter Opsional." Jangan khawatir jika Anda baru saja memulai programming – saya akan membongkar hal ini secara langkah demi langkah, dan kita akan memiliki waktu yang menyenangkan!

Apa Itu Parameter Opsional?

Sebelum kita masuk ke detil, mari khayalkan Anda sedang merencanakan pesta. Anda tahu Anda butuh piring dan gelas, tapi Anda tidak yakin apakah Anda akan memerlukan handuk. Itu seperti parameter opsional di TypeScript – itu adalah "mungkin" item di daftar belanja fungsi Anda!

Dalam TypeScript, parameter opsional memungkinkan kita untuk membuat fungsi di mana beberapa argumen tidak diperlukan. Hal ini memberikan fleksibilitas lebih kepada fungsi kita, sama seperti memiliki handuk opsional di pesta Anda memberikan Anda lebih banyak pilihan.

Sintaks

Sekarang, mari kita lihat bagaimana kita menulis parameter opsional di TypeScript. Itu sama mudahnya menambahkan tanda tanya (?) setelah nama parameter. Berikut adalah sintaks dasar:

function functionName(requiredParam: type, optionalParam?: type) {
// Tubuh fungsi
}

Lihat itu tanda tanya kecil ? setelah optionalParam? Itu adalah tongkat ajaib kita yang mengubah parameter biasa menjadi opsional!

Contoh

Ayo masuk ke beberapa contoh untuk melihat parameter opsional dalam aksi. Kita akan mulai dari yang sederhana dan secara bertahap meningkatkan kompleksitas.

Contoh 1: Salam Sederhana

function greet(name: string, greeting?: string) {
if (greeting) {
return `${greeting}, ${name}!`;
} else {
return `Hello, ${name}!`;
}
}

console.log(greet("Alice"));           // Output: Hello, Alice!
console.log(greet("Bob", "Good day")); // Output: Good day, Bob!

Dalam contoh ini, name adalah parameter wajib, tapi greeting adalah opsional. Jika kita tidak menyediakan salam, fungsi akan menggunakan "Hello" secara default. Itu seperti memiliki tanda selamat default di pesta Anda, tapi membiarkan tamu membawa tanda selamat khusus jika mereka mau!

Contoh 2: Kalkulator dengan Operasi Opsional

Ayo buat fungsi kalkulator sederhana:

function calculate(a: number, b: number, operation?: string): number {
if (operation === "add") {
return a + b;
} else if (operation === "subtract") {
return a - b;
} else {
return a * b; // Default ke perkalian
}
}

console.log(calculate(5, 3));          // Output: 15 (5 * 3)
console.log(calculate(10, 5, "add"));  // Output: 15 (10 + 5)
console.log(calculate(10, 4, "subtract")); // Output: 6 (10 - 4)

Di sini, operation adalah parameter opsional. Jika itu tidak disediakan, fungsi default ke perkalian. Itu seperti memiliki pisau multitool – Anda bisa menggunakan berbagai alat tergantung apa yang Anda butuhkan!

Contoh 3: Profil Pengguna dengan Field Opsional

Ayo buat contoh yang lebih kompleks yang melibatkan profil pengguna:

interface UserProfile {
name: string;
age: number;
email?: string;
phoneNumber?: string;
}

function createUserProfile(name: string, age: number, email?: string, phoneNumber?: string): UserProfile {
const profile: UserProfile = {
name: name,
age: age
};

if (email) {
profile.email = email;
}

if (phoneNumber) {
profile.phoneNumber = phoneNumber;
}

return profile;
}

const user1 = createUserProfile("Alice", 30);
console.log(user1);
// Output: { name: "Alice", age: 30 }

const user2 = createUserProfile("Bob", 25, "[email protected]");
console.log(user2);
// Output: { name: "Bob", age: 25, email: "[email protected]" }

const user3 = createUserProfile("Charlie", 35, "[email protected]", "123-456-7890");
console.log(user3);
// Output: { name: "Charlie", age: 35, email: "[email protected]", phoneNumber: "123-456-7890" }

Dalam contoh ini, kita membuat profil pengguna. name dan age adalah wajib, tapi email dan phoneNumber adalah opsional. Itu seperti mengisi formulir di mana beberapa field ditandai bintang (wajib) dan yang lainnya tidak!

Praktik Terbaik dan Tips

1. Urutan penting: Selalu letakkan parameter opsional setelah parameter wajib. Itu seperti menempatkan "mungkin" item di akhir daftar belanja Anda.

2. Nilai default: Anda bisa gabungkan parameter opsional dengan nilai default:

function greet(name: string, greeting: string = "Hello") {
return `${greeting}, ${name}!`;
}

3. Jangan terlalu banyak: Meskipun parameter opsional sangat berguna, terlalu banyak bisa membuat fungsi Anda sulit dipahami. Gunakan mereka bijaksana!

4. Dokumentasi: Selalu dokumentasikan apa yang terjadi ketika parameter opsional diabaikan. Itu seperti memberikan petunjuk jelas untuk tamu pesta Anda.

Kesimpulan

Selamat! Anda telah meningkatkan keterampilan TypeScript Anda dengan memahami parameter opsional. Ingat, mereka seperti "bawa jika Anda mau" item untuk pesta fungsi Anda – mereka menambah fleksibilitas dan membuat kode Anda lebih adaptif.

Sekarang Anda teruskan perjalanan coding Anda, Anda akan menemukan banyak situasi di mana parameter opsional sangat berguna. Mereka adalah alat kuat di dalam kotak alat TypeScript Anda, memungkinkan Anda menulis kode yang lebih fleksibel dan dapat digunakan kembali.

Terus latihan, tetap bersemangat, dan selamat coding! ??

Metode	Deskripsi
greet(name: string, greeting?: string)	Fungsi yang menyapa seseorang, dengan salam opsional.
calculate(a: number, b: number, operation?: string)	Fungsi kalkulator dengan parameter operasi opsional.
createUserProfile(name: string, age: number, email?: string, phoneNumber?: string)	Fungsi untuk membuat profil pengguna dengan email dan nomor telepon opsional.

Credits: Image by storyset