Các chức năng có thể được viết bằng JavaScript như thế nào?

Giả sử bạn cần tạo chương trình tạo hình tròn và tô màu cho nó. Bạn có thể tạo hai chức năng để giải quyết vấn đề này

• một chức năng để vẽ vòng tròn
• một chức năng để tô màu vòng tròn

Chia một vấn đề phức tạp thành các phần nhỏ hơn giúp chương trình của bạn dễ hiểu và có thể tái sử dụng

JavaScript cũng có một số lượng lớn các chức năng sẵn có. Ví dụ,

// declaring a function named greet()
function greet() {
    console.log("Hello there");
}

3 là hàm tính căn bậc hai của một số

Trong hướng dẫn này, bạn sẽ tìm hiểu về các hàm do người dùng định nghĩa

---

Khai báo một chức năng

Cú pháp để khai báo một hàm là

function nameOfFunction () {
    // function body   
}

• Một hàm được khai báo bằng từ khóa

  // declaring a function named greet()
  function greet() {
      console.log("Hello there");
  }

  4
• Các quy tắc cơ bản của việc đặt tên hàm tương tự như đặt tên biến. Tốt hơn là viết một tên mô tả cho chức năng của bạn. Ví dụ: nếu một hàm được sử dụng để cộng hai số, bạn có thể đặt tên hàm là

  // declaring a function named greet()
  function greet() {
      console.log("Hello there");
  }

  5 hoặc

  // declaring a function named greet()
  function greet() {
      console.log("Hello there");
  }

  6
• Phần thân của hàm được viết trong vòng

  // declaring a function named greet()
  function greet() {
      console.log("Hello there");
  }

  7

Ví dụ,

// declaring a function named greet()
function greet() {
    console.log("Hello there");
}

---

Gọi một chức năng

Trong chương trình trên, chúng ta đã khai báo một hàm tên là

// declaring a function named greet()
function greet() {
    console.log("Hello there");
}

8. Để sử dụng chức năng đó, chúng ta cần gọi nó

Đây là cách bạn có thể gọi hàm

// declaring a function named greet()
function greet() {
    console.log("Hello there");
}

8 ở trên

// function call
greet();

---

Hoạt động của một hàm trong JavaScript

---

ví dụ 1. Hiển thị một văn bản

function nameOfFunction () {
    // function body   
}

0

đầu ra

function nameOfFunction () {
    // function body   
}

1

---

Thông số chức năng

Một chức năng cũng có thể được khai báo với các tham số. Tham số là giá trị được truyền khi khai báo hàm

Hoạt động của Hàm JavaScript với tham số

---

ví dụ 2. Hàm có tham số

function nameOfFunction () {
    // function body   
}

2

đầu ra

function nameOfFunction () {
    // function body   
}

3

Trong chương trình trên, hàm

// function call
greet();

0 được khai báo với tham số

// function call
greet();

1. Người dùng được nhắc nhập tên. Sau đó, khi hàm được gọi, một đối số được truyền vào hàm

Ghi chú. Khi một giá trị được truyền vào khi khai báo một hàm, nó được gọi là tham số. Và khi hàm được gọi, giá trị được truyền vào được gọi là đối số

---

ví dụ 3. Cộng Hai Số

function nameOfFunction () {
    // function body   
}

6

đầu ra

function nameOfFunction () {
    // function body   
}

7

Trong chương trình trên, hàm

// declaring a function named greet()
function greet() {
    console.log("Hello there");
}

5 được sử dụng để tìm tổng của hai số

• Hàm được khai báo với hai tham số

  // function call
  greet();

  3 và

  // function call
  greet();

  4
• Hàm được gọi bằng tên của nó và truyền hai đối số 3 và 4 trong một và 2 và 9 trong một hàm khác

Lưu ý rằng bạn có thể gọi một hàm bao nhiêu lần tùy thích. Bạn có thể viết một hàm và sau đó gọi nó nhiều lần với các đối số khác nhau

---

Hàm trả về

Câu lệnh

// function call
greet();

5 có thể được sử dụng để trả về giá trị cho lời gọi hàm

Câu lệnh

// function call
greet();

5 biểu thị rằng chức năng đã kết thúc. Bất kỳ mã nào sau

// function call
greet();

5 đều không được thực thi

Nếu không có gì được trả về, hàm trả về giá trị

// function call
greet();

8

Hoạt động của Hàm JavaScript với câu lệnh trả về

---

Ví dụ 4. Tổng của hai số

// declaring a function named greet()
function greet() {
    console.log("Hello there");
}

5

đầu ra

// declaring a function named greet()
function greet() {
    console.log("Hello there");
}

0

Trong chương trình trên, tổng của các số được hàm trả về bằng cách sử dụng câu lệnh

// function call
greet();

5. Và giá trị đó được lưu trữ trong biến kết quả

---

Lợi ích của việc sử dụng một chức năng

• Chức năng làm cho mã có thể tái sử dụng. Bạn có thể khai báo một lần và sử dụng nhiều lần
• Chức năng làm cho chương trình dễ dàng hơn khi mỗi nhiệm vụ nhỏ được chia thành một chức năng
• Chức năng tăng khả năng đọc

---

Trong Javascript, hàm cũng có thể được định nghĩa là biểu thức. Ví dụ,

// declaring a function named greet()
function greet() {
    console.log("Hello there");
}

1

đầu ra

// declaring a function named greet()
function greet() {
    console.log("Hello there");
}

2

Trong chương trình trên, biến x được dùng để lưu hàm. Ở đây hàm được coi như một biểu thức. Và hàm được gọi bằng tên biến

Hàm trên được gọi là hàm ẩn danh

Ghi chú. Trong ES2015, các biểu thức JavaScript được viết dưới dạng hàm mũi tên. Bạn sẽ tìm hiểu về chúng trong các hướng dẫn sau

Hàm có thể được viết bằng JavaScript như thế nào?

Bạn có thể tạo hàm trong JavaScript không?