Fungsi #
Fungsi di TypeScript adalah blok kode yang dapat digunakan kembali untuk melakukan tugas tertentu. TypeScript menambahkan fitur tambahan pada fungsi yang ada di JavaScript dengan memperkenalkan tipe statis, parameter opsional, default parameters, overloading, dan lain-lain. Berikut adalah penjelasan mengenai fungsi di TypeScript dan berbagai variasi dalam membuat dan memanggil fungsi:
Fungsi Dasar #
Fungsi di TypeScript dideklarasikan menggunakan kata kunci function
, diikuti oleh nama fungsi, daftar parameter, dan tipe pengembalian.
function greet(name: string): string {
return `Hello, ${name}`;
}
let greeting = greet("Alice");
console.log(greeting); // Output: Hello, Alice
- Parameter bertipe: Setiap parameter dapat memiliki tipe yang ditentukan.
- Tipe pengembalian: Fungsi dapat menentukan tipe pengembalian, yang memastikan nilai yang dikembalikan sesuai dengan tipe yang ditentukan.
Fungsi Anonim #
Fungsi anonim adalah fungsi yang tidak memiliki nama. Fungsi ini sering digunakan sebagai argumen untuk fungsi lain atau sebagai nilai variabel.
let add = function (a: number, b: number): number {
return a + b;
};
console.log(add(2, 3)); // Output: 5
- Penggunaan: Fungsi anonim berguna ketika fungsi tidak perlu dipanggil lagi atau ketika Anda ingin mendefinisikan fungsi secara inline.
Fungsi Panah (Arrow Function) #
Fungsi panah (=>
) adalah sintaks yang lebih singkat untuk mendefinisikan fungsi anonim. Fungsi ini juga memiliki perilaku this
yang berbeda dari fungsi biasa.
let multiply = (a: number, b: number): number => a * b;
console.log(multiply(2, 3)); // Output: 6
- Penggunaan: Fungsi panah sering digunakan dalam fungsi callback atau ketika Anda ingin menulis fungsi dengan cara yang lebih ringkas.
Parameter Opsional #
TypeScript memungkinkan Anda untuk mendeklarasikan parameter opsional menggunakan tanda ?
. Parameter opsional tidak perlu diberikan nilai ketika fungsi dipanggil.
function greet(name: string, greeting?: string): string {
return `${greeting || "Hello"}, ${name}`;
}
console.log(greet("Alice")); // Output: Hello, Alice
console.log(greet("Alice", "Hi")); // Output: Hi, Alice
- Penggunaan: Parameter opsional berguna ketika tidak semua parameter harus diberikan setiap kali fungsi dipanggil.
Default Parameters #
Anda dapat mendefinisikan nilai default untuk parameter. Jika parameter tersebut tidak diberikan nilai saat pemanggilan fungsi, maka nilai default akan digunakan.
function greet(name: string, greeting: string = "Hello"): string {
return `${greeting}, ${name}`;
}
console.log(greet("Alice")); // Output: Hello, Alice
console.log(greet("Alice", "Hi")); // Output: Hi, Alice
- Penggunaan: Default parameters digunakan untuk memberikan nilai awal pada parameter jika tidak ada nilai yang diberikan saat pemanggilan fungsi.
Rest Parameters #
Rest parameters memungkinkan fungsi untuk menerima jumlah argumen yang tidak terbatas sebagai array.
function sum(...numbers: number[]): number {
return numbers.reduce((total, num) => total + num, 0);
}
console.log(sum(1, 2, 3)); // Output: 6
console.log(sum(1, 2, 3, 4, 5)); // Output: 15
- Penggunaan: Rest parameters berguna ketika Anda tidak tahu sebelumnya berapa banyak argumen yang akan diberikan kepada fungsi.
Overloading #
TypeScript mendukung fungsi overloading, yang memungkinkan Anda mendefinisikan beberapa tanda tangan untuk satu fungsi. Implementasi fungsi harus menangani semua tanda tangan yang didefinisikan.
function add(a: number, b: number): number;
function add(a: string, b: string): string;
function add(a: any, b: any): any {
return a + b;
}
console.log(add(1, 2)); // Output: 3
console.log(add("Hello, ", "World!")); // Output: Hello, World!
- Penggunaan: Overloading digunakan ketika fungsi yang sama perlu menangani tipe parameter atau jumlah parameter yang berbeda.
Fungsi Sebagai Parameter #
Fungsi dapat diteruskan sebagai parameter ke fungsi lain, yang sering digunakan dalam callback atau fungsi higher-order.
function greetUser(name: string, callback: (message: string) => void): void {
let greeting = `Hello, ${name}`;
callback(greeting);
}
greetUser("Alice", (message) => {
console.log(message); // Output: Hello, Alice
});
- Penggunaan: Menggunakan fungsi sebagai parameter memungkinkan Anda untuk menulis kode yang lebih modular dan fleksibel.
Fungsi Generator #
TypeScript mendukung fungsi generator, yang memungkinkan Anda untuk menghasilkan serangkaian nilai menggunakan yield
.
function* generateSequence() {
yield 1;
yield 2;
yield 3;
}
let generator = generateSequence();
console.log(generator.next().value); // Output: 1
console.log(generator.next().value); // Output: 2
console.log(generator.next().value); // Output: 3
- Penggunaan: Generator digunakan untuk membuat iterator atau aliran data yang dihasilkan secara sekuensial.
Fungsi Asinkron (Async/Await) #
Fungsi asinkron memungkinkan Anda menulis kode asynchronous dengan cara yang lebih mirip dengan kode synchronous menggunakan async
dan await
.
async function fetchData(url: string): Promise<any> {
let response = await fetch(url);
let data = await response.json();
return data;
}
fetchData("https://api.example.com/data")
.then(data => console.log(data))
.catch(error => console.error("Error:", error));
- Penggunaan: Async/await digunakan untuk menangani operasi asynchronous, seperti pengambilan data dari API, dengan cara yang lebih mudah dibaca dan dipelihara.
Kesimpulan #
Dengan memahami berbagai macam cara membuat dan memanggil fungsi di TypeScript, Anda dapat menulis kode yang lebih modular, fleksibel, dan mudah dipelihara. TypeScript menyediakan banyak fitur tambahan yang membuat pengembangan dengan fungsi menjadi lebih kuat dan aman.