Hàm và các loại hàm trong JavaScript LÀ GÌ?

Hàm là một nhóm mã có thể tái sử dụng có thể được gọi ở bất kỳ đâu trong chương trình của bạn. Điều này giúp loại bỏ nhu cầu viết đi viết lại cùng một mã. Nó giúp các lập trình viên viết mã mô-đun. Các hàm cho phép lập trình viên chia một chương trình lớn thành một số hàm nhỏ và có thể quản lý được

Giống như bất kỳ ngôn ngữ lập trình nâng cao nào khác, JavaScript cũng hỗ trợ tất cả các tính năng cần thiết để viết mã mô-đun bằng các hàm. Chắc hẳn bạn đã thấy các hàm như alert() và write() trong các chương trước. Chúng tôi đã sử dụng đi sử dụng lại các chức năng này, nhưng chúng chỉ được viết bằng JavaScript lõi một lần

JavaScript cũng cho phép chúng ta viết các hàm của riêng mình. Phần này giải thích cách viết các hàm của riêng bạn trong JavaScript

Định nghĩa hàm

Trước khi sử dụng một hàm, chúng ta cần định nghĩa nó. Cách phổ biến nhất để xác định hàm trong JavaScript là sử dụng từ khóa hàm, theo sau là tên hàm duy nhất, danh sách tham số (có thể trống) và khối câu lệnh được bao quanh bởi dấu ngoặc nhọn

cú pháp

Cú pháp cơ bản được hiển thị ở đây

Ví dụ

Hãy thử ví dụ sau. Nó định nghĩa một hàm gọi là sayHello không có tham số nào -

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

Để gọi một hàm ở đâu đó sau này trong tập lệnh, bạn chỉ cần viết tên của hàm đó như được hiển thị trong đoạn mã sau

      
      
      
   
   
   
      
Click the following button to call the function
      
      
         
            
      
Use different text in write method and then try...

   

đầu ra

Thông số chức năng

Cho đến bây giờ, chúng ta đã thấy các chức năng không có tham số. Nhưng có một cơ sở để truyền các tham số khác nhau trong khi gọi một hàm. Các tham số đã truyền này có thể được ghi lại bên trong hàm và mọi thao tác có thể được thực hiện trên các tham số đó. Một hàm có thể nhận nhiều tham số được phân tách bằng dấu phẩy

Ví dụ

Hãy thử ví dụ sau. Chúng tôi đã sửa đổi chức năng sayHello của mình tại đây. Bây giờ phải mất hai tham số

      
            
   
   
   
      
Click the following button to call the function
      
      
         
            
      
Use different parameters inside the function and then try...
   

đầu ra

Tuyên bố trở lại

Hàm JavaScript có thể có câu lệnh trả về tùy chọn. Điều này là bắt buộc nếu bạn muốn trả về một giá trị từ một hàm. Câu lệnh này phải là câu lệnh cuối cùng trong một hàm

Ví dụ: bạn có thể chuyển hai số vào một hàm và sau đó bạn có thể mong đợi hàm trả về phép nhân của chúng trong chương trình gọi của bạn

Ví dụ

Hãy thử ví dụ sau. Nó định nghĩa một hàm nhận hai tham số và nối chúng trước khi trả về kết quả trong chương trình gọi

     
            
   
   
   
      
Click the following button to call the function
      
      
         
            
      
Use different parameters inside the function and then try...
  
  

đầu ra

Có rất nhiều điều để tìm hiểu về các hàm JavaScript, tuy nhiên chúng tôi đã đề cập đến các khái niệm quan trọng nhất trong hướng dẫn này

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");
}

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 cho 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");
}

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

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

// function call
greet();

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

// program to print a text
// declaring a function
function greet() {
    console.log("Hello there!");
}

// calling the function
greet();

đầu ra

Hello there!

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

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

// program to print the text
// declaring a function
function greet(name) {
    console.log("Hello " + name + ":)");
}

// variable name can be different
let name = prompt("Enter a name: ");

// calling function
greet(name);

đầu ra

Enter a name: Simon
Hello Simon :)

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

// function call
greet();

// function call
greet();

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ố

// program to add two numbers using a function
// declaring a function
function add(a, b) {
    console.log(a + b);
}

// calling functions
add(3,4);
add(2,9);

đầu ra

7
11

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

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

• Hàm được khai báo với 2 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();

Câu lệnh

// function call
greet();

// function call
greet();

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

// function call
greet();

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

// program to add two numbers
// declaring a function
function add(a, b) {
    return a + b;
}

// take input from the user
let number1 = parseFloat(prompt("Enter first number: "));
let number2 = parseFloat(prompt("Enter second number: "));

// calling function
let result = add(number1,number2);

// display the result
console.log("The sum is " + result);

đầu ra

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

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();

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");
}

đầu ra

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

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

3 loại chức năng trong JavaScript là gì?

Hàm trong JavaScript là gì?

Những loại chức năng nào hoạt động với JavaScript?

Chức năng trong JavaScript với ví dụ là gì?