Các tham số tùy chọn của TypeScript trong Callbacks

TypeScript là một ngôn ngữ lập trình phổ biến được dùng để xây dựng những ứng dụng mạnh mẽ và có thể mở rộng. Trong TypeScript, các tham số lựa chọn ở hàm callback là tùy chọn, điều đó có nghĩa rằng chúng có thể hoặc không được cung cấp khi gọi callback.

TypeScript trong callback

Cú pháp:

type MyCallback = (param1: string, param2?: number) => void;
function processCallback(callback: MyCallback, param1: string, param2?: number) {
    callback(param1, param2);
}

Trong đó:

  • MyCallback là một kiểu đại diện cho một hàm callback cần param1 (chuỗi) và một param2 (số).
  • processCallback là một hàm chấp nhận callback của kiểu MyCallBack và các tham số tùy chọn param1 (chuỗi) và param2 (số). Nó gọi hàm callback bằng các tham số được cung cấp.

Ví dụ 1: Xác định kiểu MyCallback, nơi param2 là tham số tùy chọn. Hàm callback nhận hai tham số, str (một chuỗi) và num (một số tùy chọn). Bên trong hàm này, bạn ghi lại chuỗi đã nhận và nếu num được cung cấp, bạn cũng lưu lại số đó. Nếu không, số đó không được cung cấp. Ví dụ gọi callback myFunction 2 lần: đầu tiên chỉ với tham số chuỗi, sau đó với cả hai chuỗi và số.

type MyCallback = (param1: string, param2?: number) => void; 

const myFunction: MyCallback = (str, num) => { 
	console.log(`Received: ${str}`); 
	if (num !== undefined) { 
		console.log(`Number: ${num}`); 
	} else { 
		console.log("Number is not provided."); 
	} 
}; 

// Gọi callback có và không có tham số tùy chọn
myFunction("GeeksforGeeks"); 
myFunction("A Computer Science Portal", 99);

Kết quả:

Ví dụ 2: Xác định kiểu MathOperationCallback cho các hàm callback triển khai những phép toán trên hai số, với một tham số mô tả tùy chọn. Hàm performMathOperation lấy một hàm callback, hai số (a và b), thêm tham số mô tả tùy chọn.

type MathOperationCallback = (a: number, b: number, 
	description?: string) => number; 

function performMathOperation( 
	operation: MathOperationCallback, 
	a: number, 
	b: number, 
	description?: string 
) { 
	const result = operation(a, b); 
	console.log(`Operation: ${description || "Unnamed"}`); 
	console.log(`Result: ${result}`); 
} 

// Xác định một hàm bổ sung tùy biến
const customAddition: MathOperationCallback = (x, y, description) => { 
	const sum = x + y; 
	console.log(`Performing addition: ${description || "Unnamed"}`); 
	return sum; 
}; 

// Triển khai các phép tính
// kèm hoặc không kèm mô tả
// Không cung cấp mô tả
performMathOperation(customAddition, 5, 3); 

// Kèm mô tả
performMathOperation(customAddition, 10, 7, "Adding Numbers");

Kết quả:

Kết quả khi dùng tham số tùy chọn

Hi vọng bài viết giúp bạn hiểu rõ hơn về các tham số tùy chọn của callback trong TypeScript.

Thứ Năm, 26/10/2023 16:54
31 👨 110
0 Bình luận
Sắp xếp theo