Current date Tháng 5 18, 2026
Tự học JavaScript

Tự học JavaScript – Module 7: Hàm (Functions) và Arrow Functions (ES6)

URL copied
Share URL copied
Tự học JavaScript - Module 7: Hàm (Functions) và Arrow Functions (ES6)
Tự học JavaScript – Module 7: Hàm (Functions) và Arrow Functions (ES6)

1. Khai báo và Gọi Hàm (Declaration & Invocation)

Khai báo hàm:

Sử dụng từ khóa `function`, theo sau là tên hàm và cặp ngoặc đơn `()`.

function myFunction(p1, p2) {
  return p1 * p2; // Hàm trả về tích của p1 và p2
}

Gọi hàm (Invoke):

Hàm sẽ không tự chạy. Bạn phải gọi tên nó kèm cặp ngoặc đơn.

let x = myFunction(4, 3); // x sẽ là 12

2. Tham số và Đối số (Parameters & Arguments)

  • Tham số (Parameters): Là các tên biến được liệt kê trong định nghĩa hàm (như `p1`, `p2` ở trên).
  • Đối số (Arguments): Là các giá trị thực tế mà hàm nhận được khi bạn gọi nó (như `4`, `3`).

Tại sao lại dùng `return`?

Khi JavaScript gặp từ khóa `return`, hàm sẽ dừng lại và trả về giá trị cho nơi gọi nó. Nếu không có `return`, hàm sẽ trả về `undefined`.

3. Biểu thức Hàm (Function Expressions)

Bạn có thể lưu một hàm vào trong một biến. Sau khi đã lưu, biến đó có thể được dùng như một hàm.

const x = function (a, b) { return a + b };
let z = x(4, 3); // z = 7

4. Hàm Mũi Tên (Arrow Functions – ES6)

Đây là cú pháp hiện đại và cực kỳ phổ biến trong JS ngày nay. Nó giúp việc viết hàm trở nên ngắn gọn hơn rất nhiều.

Cú pháp cơ bản:

const hello = () => "Hello World!";

Rút gọn tối đa:

Nếu hàm chỉ có một câu lệnh và trả về một giá trị, bạn có thể bỏ cả dấu ngoặc nhọn `{ }` và từ khóa `return`.

// Thay vì:
// const multiply = (a, b) => { return a * b };

// Bạn có thể viết:
const multiply = (a, b) => a * b;

5. Sự khác biệt quan trọng của Arrow Functions

  • Không có `this` riêng: Arrow function kế thừa `this` từ phạm vi cha bao quanh nó. Do đó, không nên dùng arrow function để làm phương thức của Object.
  • Không được Hoisting: Bạn phải khai báo arrow function trước khi gọi nó (khác với `function declaration` thông thường).

Lời kết Module 7

Hàm là “đơn vị xử lý” của chương trình. Việc làm chủ cả cách viết truyền thống và Arrow Function sẽ giúp bạn đọc hiểu mã nguồn hiện đại một cách dễ dàng.

Trong Module 8, chúng ta sẽ tìm hiểu về cách JavaScript tổ chức mã nguồn theo hướng đối tượng với Classes.

Hẹn gặp lại các bạn!

Share URL copied

Leave a comment

Để lại một bình luận

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *

Active0
AI3
AI & Automation10

Exclusives

Lifestyle

Related Articles

Tự học JS – Module 15: JSON – Định dạng trao đổi dữ liệu tiêu chuẩn

Tìm hiểu về JSON (JavaScript Object Notation), định dạng văn bản phổ...

Tự học JS – Module 14: Debugging – Kỹ năng tìm và sửa lỗi như chuyên gia

Học cách sử dụng công cụ Chrome DevTools, console.log() và debugger để...

Tự học JS – Module 13: Các tính năng ES6+ hiện đại (Cheatsheet đầy đủ)

Khám phá những thay đổi quan trọng nhất của JavaScript hiện đại...

Tự học JavaScript – Module 12: Dự án thực tế và Hành trình phía trước

Tổng kết Series JavaScript. Xây dựng một ứng dụng 'To-Do List' đơn...