Hàm (Function)

Bài 6 – Hiểu hàm trong JavaScript, cách khai báo, truyền tham số, trả về kết quả và ứng dụng thực tế.

18/11/2025 DaiPhan
Bài 6 / 12

Hàm (Function)

Hàm giúp bạn đóng gói logictái sử dụng nhiều lần. Đây là công cụ cốt lõi để giảm lặp lại code, tăng khả năng tổ chức chương trình và giúp ứng dụng dễ mở rộng.


1. Hàm là gì?

Hàm là một nhóm câu lệnh được đặt tên để thực thi một nhiệm vụ cụ thể.

Tư duy cốt lõi:
“Có hành động lặp đi lặp lại? Đưa vào hàm.”


2. Khai báo hàm (Function Declaration)

function sayHello() {
  console.log("Xin chào!");
}

sayHello(); // Gọi hàm

🔑 GHI NHỚ: Hàm chỉ chạy khi bạn gọi nónó

3. Tham số và đối số (Parameters & Arguments)

function greet(name) {
  console.log("Xin chào " + name);
}

greet("Dai");
  • Tham số: name
  • Đối số: "Dai"

🔑 GHI NHỚ: Tham số là biến trong khai báo hàm, đối số là giá trị truyền vào khi gọi hàm

4. Hàm trả về giá trị (return)

function sum(a, b) {
  return a + b;
}

let total = sum(5, 3);
console.log(total); // 8

return giúp hàm trả kết quả để sử dụng tiếp.

🔑 GHI NHỚ: Không có return, hàm sẽ trả về undefined

5. Arrow Function – Viết hàm gọn hơn (ES6)

const sum = (a, b) => a + b;

console.log(sum(10, 5)); // 15

Khi logic đơn giản → viết một dòng cho rõ ràng.

🔑 GHI NHỚ: Arrow function giúp code ngắn gọn và dễ đọc hơn

6. Hàm có giá trị mặc định (Default Parameters)

function greet(name = "bạn") {
  console.log("Xin chào " + name);
}

greet();       // Xin chào bạn
greet("Dai");  // Xin chào Dai

🔑 GHI NHỚ: Default parameters giúp hàm linh hoạt hơn khi không có đối số

7. Hàm trong hàm – rất quan trọng

function add(a, b) {
  return a + b;
}

function double(x) {
  return x * 2;
}

console.log(double(add(2, 3))); // 10

Tư duy xây dựng hệ thống: Hàm nhỏ → kết hợp → tạo hàm lớn.

🔑 GHI NHỚ: Chia nhỏ logic thành các hàm đơn giản giúp code dễ maintain hơn

8. Lợi ích của việc dùng hàm

  • Giảm lặp lại code
  • Dễ bảo trì
  • Logic rõ ràng
  • Tái sử dụng nhiều lần
  • Chia nhỏ bài toán phức tạp thành từng phần

🔑 GHI NHỚ: Hàm giúp code trở nên modular và dễ quản lý hơn

9. Lỗi thường gặp

  • Quên return → kết quả undefined
  • Truyền sai số lượng tham số
  • Hàm làm quá nhiều việc → khó bảo trì
  • Đặt tên mơ hồ → khó đọc

⚠️ GHI NHỚ: Đặt tên hàm có ý nghĩa và mô tả rõ chức năng của hàm

10. Bài tập thực hành

Bài 1

Tạo hàm tính:

  • Tổng
  • Hiệu
  • Tích
  • Thương

Bài 2

Tạo hàm kiểm tra số chẵn/lẻ:

  • Nếu chẵn → trả về true
  • Nếu lẻ → trả về false

Bài 3

Tạo hàm tính BMI theo công thức: BMI = cân nặng / (chiều cao * chiều cao)

Bài 4

Tạo hàm getMax(arr) trả về giá trị lớn nhất trong mảng.

Bài 5

Viết hàm dạng arrow function để in “Hello JavaScript”.

11. Kết luận bài học

  • Hàm giúp xây dựng chương trình có cấu trúc rõ ràng
  • Hàm có thể nhận tham số và trả về kết quả
  • Arrow function giúp viết code gọn
  • Hàm là nền tảng để học lập trình nâng cao: callback, async/await, module

🔑 GHI NHỚ QUAN TRỌNG:

  • Luôn đặt tên hàm có ý nghĩa và mô tả rõ chức năng
  • Chia nhỏ logic phức tạp thành nhiều hàm đơn giản
  • Sử dụng arrow function cho code ngắn gọn
  • Không quên return khi cần trả về giá trị
12 bài học
Bài 6
Tiến độ hoàn thành 50%

Đã hoàn thành 6/12 bài học