¶Pendahuluan

Pada artikel ini, kita akan membahas fungsi (function) dalam TypeScript serta bagaimana cara menggunakannya untuk membuat kode yang lebih terstruktur, aman, dan mudah dipahami.

Apa itu Function ?

Function adalah blok kode yang digunakan untuk menjalankan tugas tertentu. Dengan function, kita bisa mengelompokkan kode yang berulang agar lebih rapi dan mudah digunakan kembali (reusable).

Dalam TypeScript, function memiliki fitur tambahan berupa penentuan tipe data untuk parameter dan nilai kembalian (return value), sehingga lebih aman dibanding JavaScript biasa.

¶Function dengan Parameter dan Return Value

Kita bisa mendefinisikan sebuah function dengan parameter dan return value yang sudah ditentukan tipe datanya.

function tambah(a: number, b: number): number {
    return a + b;
}

let hasil = tambah(10, 5);
console.log(hasil); // Output: 15

• a: number dan b: number menunjukkan bahwa parameter harus berupa angka.

• : number setelah kurung fungsi berarti hasil yang dikembalikan juga harus berupa angka.

• Jika kita mencoba mengirim string atau tipe lain, TypeScript akan memberikan error sebelum runtime!

¶Function dengan Parameter Opsional

Kadang kita ingin sebuah parameter itu bersifat opsional (boleh diisi atau tidak). Kita bisa menggunakan tanda tanya (?) pada parameter.

function sapa(nama: string, salam?: string): string {
    return `${salam ?? "Halo"}, ${nama}!`;
}

console.log(sapa("Rafi"));         // Output: Halo, Rafi!
console.log(sapa("Rafi", "Hi"));   // Output: Hi, Rafi!

Pada kode diatas, parameter salam bisa diisi atau tidak. Jika tidak diisi, maka nilai default-nya adalah "Halo", dan operator ?? digunakan untuk memberikan nilai default jika salam undefined.

¶Function dengan Default Parameter

Jika kita ingin memberikan nilai default pada sebuah parameter tanpa harus melakukan pengecekan manual, kita bisa langsung mendefinisikannya.

function hitungDiskon(harga: number, diskon: number = 10): number {
    return harga - (harga * (diskon / 100));
}

console.log(hitungDiskon(100000));      // Output: 90000 (karena diskon default 10%)
console.log(hitungDiskon(100000, 20));  // Output: 80000

Pada kode diatas, jika parameter diskon tidak diisi, maka parameter diskon secara otomatis akan dianggap 10%.

¶Function dengan Return Type Void

Tidak semua function mengembalikan nilai. Jika function hanya menjalankan suatu aksi tanpa mengembalikan data, kita bisa menggunakan void.

function cetakPesan(pesan: string): void {
    console.log("Pesan:", pesan);
}

cetakPesan("TypeScript sangat keren!"); // Output: Pesan: TypeScript sangat keren!

function ini sangat cocok untuk function yang hanya melakukan logging, alert, atau menampilkan data, tanpa mengembalikan nilai.

¶Function dengan Parameter Rest

Kita bisa menggunakan rest parameter (...) untuk menerima jumlah parameter yang tidak terbatas dalam bentuk array.

function jumlahkan(...angka: number[]): number {
    return angka.reduce((total, num) => total + num, 0);
}

console.log(jumlahkan(1, 2, 3, 4, 5)); // Output: 15
console.log(jumlahkan(10, 20, 30));    // Output: 60

Tujuan penggunaan rest paramter, agar kita tidak perlu menentukan jumlah parameter yang tidak pasti dan juga memudahkan dalam proses perhitungan dengan banyak data.

¶Function Expression & Arrow Function

Selain menggunakan function, kita juga bisa menggunakan function expression dan arrow function untuk menulis kode lebih ringkas.

¶Function Expression

Function expression adalah function yang disimpan dalam variabel.

const kali = function(a: number, b: number): number {
    return a * b;
};

console.log(kali(4, 5)); // Output: 20

¶Arrow Function

Arrow function adalah cara singkat untuk menuliskan function expression.

const bagi = (a: number, b: number): number => a / b;

console.log(bagi(10, 2)); // Output: 5

¶Function Overloading

Kadang kita ingin satu function bisa menerima berbagai tipe parameter yang berbeda. TypeScript mendukung fitur overloading untuk menangani hal ini.

function cetakInfo(nama: string): void;
function cetakInfo(nama: string, umur: number): void;
function cetakInfo(nama: string, umur?: number): void {
    if (umur !== undefined) {
        console.log(`Nama: ${nama}, Umur: ${umur}`);
    } else {
        console.log(`Nama: ${nama}`);
    }
}

cetakInfo("Rafi");         // Output: Nama: Rafi
cetakInfo("Rafi", 25);     // Output: Nama: Rafi, Umur: 25

¶Penutup

Pada artikel berikutnya, kita akan belajar bersama - sama tentang Interface dalam Typescript. Semoga bermanfaat, terima kasih :)