Overloading Fungsi dalam TypeScript

Kadangkala terdapat fungsi yang mengembalikan nilai yang jenisnya bergantung pada parameter yang dilalui. Untuk ini, TypeScript menggunakan overloading fungsi (function overloading). Ia membenarkan kita untuk menentukan pelbagai varian tanda tangan fungsi.

Mari kita lihat contoh. Katakan kita mempunyai fungsi yang memisahkan aksara dalam satu rentetan kepada array huruf:

function splitStr(str: string): string[] {
	return str.split('');
}

Katakan kita juga mempunyai fungsi yang memisahkan aksara dalam satu nombor kepada array digit:

function splitNum(num: number): number[] {
	let str: string = String(num);
	let arr: string[] = str.split('');
	
	return arr.map(elem => +elem);
}

Mari gabungkan kedua-dua fungsi menjadi satu. Fungsi baru ini, bergantung pada jenis parameternya, hendaklah mengembalikan sama ada array nombor atau array rentetan.

Gunakan overloading untuk mengisytiharkan tanda tangan yang berbeza untuk fungsi kita:

function splitVal(val: number): number[];
function splitVal(val: string): string[] {
	// pelaksanaan untuk kedua-dua tanda tangan
}

Sekarang tulis pelaksanaan fungsi. Dalam kodnya, kita mesti menentukan dengan syarat, tanda tangan manakah yang telah digunakan, dan bergantung pada itu, jalankan kod yang sesuai dengan hasil jenis yang betul:

function splitVal(val: number): number[];
function splitVal(val: string): string[] {
	if (typeof val === 'string') {
		return val.split('');
	} else {
		let str: string = String(val);
		let arr: string[] = str.split('');
		
		return arr.map((elem: string): number => +elem);
	}
}

Berbeza dengan bahasa pengaturcaraan lain, dalam TypeScript overloading mencipta satu fungsi sahaja. Anda tidak boleh membuat beberapa fungsi dengan satu nama, tetapi dengan tanda tangan yang berbeza.

Tulis fungsi yang akan mengembalikan atau mengubah teks elemen DOM. Ia hendaklah berfungsi seperti berikut:

text('#elem', 'text'); // menetapkan teks
text('#elem');         // mengembalikan teks semasa