Hướng dẫn sử dụng hàm trong TypeScript cho người mới bắt đầu

Hàm là khối xây dựng cơ bản trong TypeScript, cũng như trong JavaScript. TypeScript mở rộng hàm JavaScript với các tính năng bổ sung như chú thích kiểu, giúp tăng cường tính rõ ràng của mã và ngăn ngừa lỗi. Hướng dẫn dành cho người mới bắt đầu này sẽ hướng dẫn bạn cách sử dụng hàm trong TypeScript.

Định nghĩa hàm

Trong TypeScript, bạn có thể định nghĩa các hàm giống như trong JavaScript nhưng có chú thích kiểu tùy chọn để chỉ định kiểu tham số và giá trị trả về.

Định nghĩa hàm cơ bản

Sau đây là cách bạn định nghĩa một hàm đơn giản trong TypeScript:

function greet(name: string): string {
  return "Hello, " + name;
}

Trong ví dụ này, name là tham số có kiểu string và hàm trả về giá trị có kiểu string.

Tham số hàm và kiểu trả về

TypeScript cho phép bạn chỉ định kiểu cho tham số hàm và giá trị trả về, giúp đảm bảo hàm được sử dụng đúng cách.

Hàm có tham số

Sau đây là một hàm lấy hai tham số và trả về tổng của chúng:

function add(x: number, y: number): number {
  return x + y;
}

Trong hàm này, cả x và y đều có kiểu số và hàm trả về số.

Các hàm không có giá trị trả về

Không phải tất cả các hàm đều cần trả về giá trị. Các hàm không có giá trị trả về được khai báo với kiểu trả về là void. Các hàm này thực hiện các hành động nhưng không tạo ra kết quả.

Ví dụ không có giá trị trả về

function logMessage(message: string): void {
  console.log(message);
}

Trong ví dụ này, logMessage in message ra bảng điều khiển nhưng không trả về bất kỳ giá trị nào.

Tham số tùy chọn và mặc định

TypeScript hỗ trợ các tham số tùy chọn và mặc định, cho phép bạn tạo các hàm linh hoạt hơn.

Tham số tùy chọn

Các tham số tùy chọn được chỉ định bằng cách thêm ? sau tên tham số:

function greet(name: string, greeting?: string): string {
  if (greeting) {
    return greeting + ", " + name;
  }
  return "Hello, " + name;
}

Trong ví dụ này, greeting là tham số tùy chọn có thể bỏ qua khi gọi hàm.

Tham số mặc định

Các tham số mặc định có giá trị mặc định nếu không có giá trị nào được cung cấp:

function greet(name: string, greeting: string = "Hello"): string {
  return greeting + ", " + name;
}

Nếu greeting không được cung cấp, thì mặc định sẽ là "Hello".

Quá tải hàm

TypeScript hỗ trợ chức năng quá tải hàm, cho phép bạn xác định nhiều chữ ký hàm cho cùng một tên hàm:

function greet(name: string): string;
function greet(name: string, age: number): string;
function greet(name: string, age?: number): string {
  if (age !== undefined) {
    return `Hello, ${name}. You are ${age} years old.`;
  }
  return `Hello, ${name}.`;
}

Trong ví dụ này, greet có thể được gọi với một hoặc hai tham số.

Chức năng mũi tên

Các hàm mũi tên cung cấp cú pháp ngắn hơn để viết hàm và không có ngữ cảnh this riêng:

const add = (x: number, y: number): number => x + y;

Ví dụ này cho thấy cách định nghĩa hàm mũi tên để cộng hai số.

Phần kết luận

Các hàm trong TypeScript là một cách mạnh mẽ để đóng gói và tái sử dụng mã. Bằng cách sử dụng chú thích kiểu, tham số tùy chọn và mặc định, quá tải hàm và hàm mũi tên, bạn có thể viết mã mạnh mẽ và dễ bảo trì hơn. Hiểu những điều cơ bản này sẽ giúp bạn tận dụng tối đa các khả năng của TypeScript trong các dự án của mình.