TypeScript - Jenis Fungsi

Hai, para pemrogram yang sedang belajar! Hari ini, kita akan mendalam ke dunia yang menarik jenis fungsi TypeScript. Jangan khawatir jika Anda baru dalam pemrograman; saya akan menggembalakan Anda melalui setiap konsep langkah demi langkah, seperti yang saya lakukan bagi banyak siswa selama tahun tahun mengajar saya. Mari kita embarkasi dalam perjalanan yang menarik ini bersama!

Mengetik Fungsi

Dalam TypeScript, fungsi adalah penduduk pertama, artinya kita dapat menangani mereka seperti nilai lainnya. Tetapi apa yang membuat TypeScript khusus adalah kemampuannya untuk mengetik fungsi ini. Bayangkan Anda adalah seorang chef (fungsi) dengan resep khusus (jenis fungsi). Resep ini memberitahu Anda apa bahan-bahan yang Anda butuhkan (parameter) dan makanan apa yang Anda buat (tipe kembalian).

mari kita lihat contoh sederhana:

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

Dalam contoh ini, greet adalah fungsi kita. Itu mengambil name tipe string sebagai masukan dan mengembalikan string. : string setelah tanda kurung buka menentukan tipe kembalian.

Sekarang, mari kita coba menggunakan fungsi ini:

const greeting = greet("Alice");
console.log(greeting); // Output: Hello, Alice!

TypeScript memastikan bahwa kita menggunakan fungsi dengan benar. Jika kita mencoba untuk memberikan bilangan saja:

greet(123); // Error: Argumen tipe 'number' tidak dapat diperikan ke parameter tipe 'string'.

TypeScript akan menangkap kesalahan ini sebelum kita menjalankan kode. Itu seperti memiliki asisten yang membantu di dapur, memastikan Anda tidak secara tak sengaja menggunakan gula sebagai garam!

Ekspresi Jenis Fungsi TypeScript

Sekarang, mari kita belajar tentang ekspresi jenis fungsi. Ini seperti blueprint untuk fungsi kita. Mereka menjelaskan bagaimana fungsi harus terlihat tanpa benar-benar mengimplentasinya.

Ini adalah sintaks umum:

(parameter1: type1, parameter2: type2, ...) => returnType

Misalnya:

let mathOperation: (x: number, y: number) => number;

Ini mendeklarasikan mathOperation sebagai variabel yang dapat menangkap semua fungsi yang menerima dua bilangan dan mengembalikan bilangan. Itu seperti mengatakan, "Saya memerlukan seorang chef yang dapat mengambil dua bahan dan menghasilkan satu hidangan."

Kemudian kita dapat menugaskan fungsi ke variabel ini:

mathOperation = function(x, y) {
return x + y;
}

console.log(mathOperation(5, 3)); // Output: 8

Mendeklarasikan Variabel Jenis Fungsi

Kita juga dapat menggunakan alias jenis untuk memberi nama jenis fungsi kita. Ini berguna ketika kita ingin mengulangi jenis fungsi di beberapa tempat.

type GreetFunction = (name: string) => string;

let greet: GreetFunction;

greet = function(name) {
return `Hello, ${name}!`;
}

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

Dalam contoh ini, GreetFunction adalah alias jenis kita. Itu seperti memberi nama resep kita sehingga kita dapat mudah merujuk kepadanya kemudian.

Menentukan Parameter Fungsi sebagai Fungsi

kadang-kadang, kita ingin meneruskan fungsi sebagai parameter ke fungsi lain. Ini adalah konsep yang kuat dalam pemrograman yang disebut "fungsi tingkat tinggi". Itu seperti memiliki chef utama yang dapat menggembalakan chefs lain.

mari kita lihat contoh:

function applyOperation(x: number, y: number, operation: (a: number, b: number) => number): number {
return operation(x, y);
}

let result = applyOperation(5, 3, (a, b) => a + b);
console.log(result); // Output: 8

result = applyOperation(5, 3, (a, b) => a * b);
console.log(result); // Output: 15

Di sini, applyOperation adalah fungsi tingkat tinggi kita. Itu menerima dua bilangan dan fungsi operasi sebagai parameter. Kita dapat meneruskan fungsi operasi yang berbeda untuk mendapatkan hasil yang berbeda.

Menggunakan Alias Jenis ke Jenis Fungsi

Alias jenis dapat membuat kode kita lebih mudah dibaca saat berurusan dengan jenis fungsi kompleks. mari kita lihat contoh yang lebih kompleks:

type MathOperation = (x: number, y: number) => number;
type MathOperationWithDescription = (description: string, operation: MathOperation) => string;

const add: MathOperation = (x, y) => x + y;
const subtract: MathOperation = (x, y) => x - y;

const describeMathOperation: MathOperationWithDescription = (description, operation) => {
return `${description}: ${operation(10, 5)}`;
}

console.log(describeMathOperation("Addition", add)); // Output: Addition: 15
console.log(describeMathOperation("Subtraction", subtract)); // Output: Subtraction: 5

Dalam contoh ini, kita telah membuat dua alias jenis: MathOperation dan MathOperationWithDescription. Ini membuat kode kita menjadi lebih mudah dibaca dan maintainable.

Berikut adalah tabel yang menggabungkan jenis fungsi yang kita pelajari:

Jenis Fungsi	Deskripsi	Contoh
Jenis Fungsi Dasar	Menentukan jenis parameter dan jenis kembalian	(name: string) => string
Variabel Jenis Fungsi	Variabel yang dapat menangkap fungsi jenis tertentu	let greet: (name: string) => string;
Alias Jenis Fungsi	Jenis fungsi yang diberi nama yang dapat digunakan kembali	type GreetFunction = (name: string) => string;
Fungsi Tingkat Tinggi	Fungsi yang menerima fungsi sebagai parameter	(x: number, y: number, operation: (a: number, b: number) => number) => number

Ingat, jenis fungsi TypeScript tentang memastikan kita menggunakan fungsi kita dengan benar. Mereka adalah seperti penahan jalan, membantu kita tetap di jalur dan menghindari kesalahan. Dengan latihan, Anda akan menemukan bahwa mereka membuat kode Anda lebih kuat dan mudah dipahami.

Tetap coding, tetap belajar, dan jangan lupa untuk bersenang-senang dalam perjalanan!

Credits: Image by storyset