# TypeScript - Functions: A Beginner's Guide
Xin chào, những người học lập trình tiềm năng! Hôm nay, chúng ta sẽ bắt đầu một hành trình thú vị vào thế giới của các hàm TypeScript. Đừng lo lắng nếu bạn chưa bao giờ viết một dòng mã trước đây - tôi sẽ là người hướng dẫn thân thiện của bạn, và chúng ta sẽ cùng nhau bước từng bước. Cuối cùng của bài hướng dẫn này, bạn sẽ ngạc nhiên về những gì bạn có thể làm với các hàm trong TypeScript!
## 什么是函数?
Trước khi chúng ta đi vào chi tiết, hãy hiểu xem một hàm là gì. Hãy tưởng tượng một hàm như một công thức có thể tái sử dụng."Just like how you follow a recipe to bake a cake, a function is a set of instructions that performs a specific task in your program.
Dưới đây là một hàm đơn giản trong TypeScript:
```typescript
function greet(name: string): string {
return `Hello, ${name}!`;
}
console.log(greet("Alice")); // Output: Hello, Alice!
Trong ví dụ này, greet
là hàm của chúng ta. Nó nhận một name
làm đầu vào và trả về một thông điệp chào hỏi. The : string
sau tham số và sau dấu ngoặc đơn cho biết rằng hàm này nhận một chuỗi làm đầu vào và trả về một chuỗi.
Tham số tùy chọn
Đôi khi, bạn có thể muốn làm một tham số tùy chọn. Trong TypeScript, bạn có thể làm điều này bằng cách thêm một ?
sau tên tham số.
function introduce(name: string, age?: number): string {
if (age) {
return `Hi, I'm ${name} and I'm ${age} years old.`;
} else {
return `Hi, I'm ${name}.`;
}
}
console.log(introduce("Bob")); // Output: Hi, I'm Bob.
console.log(introduce("Charlie", 30)); // Output: Hi, I'm Charlie and I'm 30 years old.
Trong hàm này, age
là tùy chọn. Nếu nó được cung cấp, chúng ta bao gồm nó trong giới thiệu; nếu không, chúng ta bỏ qua nó.
Tham số còn lại
Tham số còn lại cho phép bạn làm việc với nhiều tham số như một mảng. Nó giống như nói, "Tôi không biết bạn sẽ cho tôi bao nhiêu nguyên liệu, nhưng tôi sẽ sử dụng tất cả trong công thức của mình!"
function makeShake(...fruits: string[]): string {
return `I made a shake with ${fruits.join(", ")}.`;
}
console.log(makeShake("banana")); // Output: I made a shake with banana.
console.log(makeShake("strawberry", "mango", "kiwi")); // Output: I made a shake with strawberry, mango, kiwi.
Cú pháp ...fruits
cho TypeScript biết để lấy tất cả các đối số được cung cấp và đặt chúng vào một mảng叫做 fruits
.
Tham số mặc định
Tham số mặc định giống như có một kế hoạch dự phòng. Nếu ai đó không cung cấp một giá trị, chúng ta sẽ sử dụng một giá trị mặc định.
function orderCoffee(size: string = "medium", type: string = "latte"): string {
return `You ordered a ${size} ${type}.`;
}
console.log(orderCoffee()); // Output: You ordered a medium latte.
console.log(orderCoffee("large")); // Output: You ordered a large latte.
console.log(orderCoffee("small", "espresso")); // Output: You ordered a small espresso.
Nếu bạn không chỉ định kích thước hoặc loại, nó sẽ mặc định là latte közepes.
Hàm vô danh
Hàm vô danh giống như những điệp viên bí mật - chúng không có tên! Chúng thường được sử dụng khi bạn cần một hàm nhanh mà bạn chỉ sử dụng một lần.
let greet = function(name: string): string {
return `Hello, ${name}!`;
};
console.log(greet("David")); // Output: Hello, David!
Ở đây, chúng ta đã gán một hàm vô danh vào biến greet
. Chúng ta có thể sử dụng greet
như một hàm thông thường.
Constructor của Hàm
Constructor của Hàm là một cách để tạo hàm một cách động. Nó giống như xây dựng một robot có thể thực hiện các nhiệm vụ dựa trên các hướng dẫn bạn đưa ra.
let multiply = new Function('a', 'b', 'return a * b');
console.log(multiply(4, 5)); // Output: 20
Trong ví dụ này, chúng ta đang tạo một hàm nhân hai số. Lý do cuối cùng luôn là thân hàm, và phần còn lại là tên tham số.
Đệ quy và Hàm TypeScript
Đệ quy là khi một hàm gọi chính nó. Nó giống như những con búp bê Nga - mỗi con búp bê chứa một phiên bản nhỏ hơn của chính nó.
function countdown(n: number): void {
if (n <= 0) {
console.log("Blast off!");
} else {
console.log(n);
countdown(n - 1);
}
}
countdown(3);
// Output:
// 3
// 2
// 1
// Blast off!
Hàm này đếm ngược từ một số cho đến zero. Nó liên tục gọi chính nó với một số nhỏ hơn cho đến khi nó đạt zero.
Lambda Functions
Lambda functions, còn được gọi là arrow functions, là một cách viết hàm ngắn gọn. Chúng giống như các viết tắt tin nhắn cho hàm!
let add = (a: number, b: number): number => a + b;
console.log(add(3, 4)); // Output: 7
Cú pháp này rất hữu ích cho các hàm ngắn và đơn giản.
Các Biến Thể Cú Pháp
TypeScript cung cấp nhiều cách để định nghĩa hàm. Dưới đây là bảng tóm tắt các cú pháp khác nhau:
Cú pháp | Ví dụ |
---|---|
Function Declaration |
function greet(name: string): string { return Hello, ${name}!; }
|
Function Expression |
let greet = function(name: string): string { return Hello, ${name}!; };
|
Arrow Function |
let greet = (name: string): string => Hello, ${name}!;
|
Method in Object |
let obj = { greet(name: string): string { return Hello, ${name}!; } };
|
Async Function | async function fetchData(): Promise<void> { /* ... */ } |
overloaded Functions
overloaded Functions cho phép bạn định nghĩa nhiều chữ ký hàm cho cùng một hàm. Nó giống như có nhiều công thức cho cùng một món ăn, tùy thuộc vào nguyên liệu bạn có.
function makeNoise(animal: "cat"): string;
function makeNoise(animal: "dog"): string;
function makeNoise(animal: string): string {
switch(animal) {
case "cat":
return "Meow";
case "dog":
return "Woof";
default:
return "Unknown animal";
}
}
console.log(makeNoise("cat")); // Output: Meow
console.log(makeNoise("dog")); // Output: Woof
Hàm này có thể xử lý các loại động vật khác nhau và tạo ra tiếng kêu phù hợp.
Và đó là tất cả! Chúng ta đã bao gồm rất nhiều nội dung hôm nay, từ các hàm cơ bản đến các khái niệm phức tạp hơn như đệ quy và overloaded functions. Nhớ rằng học lập trình giống như học một ngôn ngữ mới - nó đòi hỏi sự thực hành và kiên nhẫn. Đừng ngại thử nghiệm với các khái niệm này và tạo ra các hàm của riêng bạn. Trước khi bạn biết, bạn sẽ viết các chương trình phức tạp một cách dễ dàng. Chúc may mắn với việc lập trình, và gặp lại bạn trong bài học tiếp theo!
Credits: Image by storyset