Hàm JavaScript và biểu thức hàm

Trong hướng dẫn này, bạn sẽ tìm hiểu về hàm JavaScript và các biểu thức hàm với sự trợ giúp của các ví dụ.

Hàm JavaScript

Hàm là một khối mã thực hiện một nhiệm vụ cụ thể.

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

• a function to draw the circle
• a function to color the circle

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ể sử dụng lại.

JavaScript cũng có một số lượng lớn các hàm có sẵn. Ví dụ, Math.sqrt()là một 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 hàm

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

function nameOfFunction () {
    // function body   
}

• A function is declared using the function keyword.
• The basic rules of naming a function are similar to naming a variable. It is better to write a decfscriptive name for your function. For example, if a function is used to add two numbers, you could name the function add or addNumbers.
• The body of function is written within {}.

Ví dụ,

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

Gọi một hàm

Trong chương trình trên, chúng ta đã khai báo một hàm có tên greet(). Để 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 greet()hàm trên .

// function call
greet();

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

Ví dụ 1: Hiển thị 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!

Tham số chức năng

Một hàm cũng có thể được khai báo với các tham số. Tham số là một giá trị được truyền khi khai báo một hàm.Hoạt động của Hàm JavaScript với tham số

Ví dụ 2: Hàm với cá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, greethàm được khai báo với một nametham số. 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.

Lưu ý : Khi một giá trị được truyền 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, addhàm dùng để tìm tổng của hai số.

• The function is declared with two parameters a and b.
• The function is called using its name and passing two arguments 3 and 4 in one and 2 and 9 in another.

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.

Chức năng trả về

Câu returnlệnh có thể được sử dụng để trả về giá trị cho một lời gọi hàm.

Câu returnlệnh biểu thị rằng chức năng đã kết thúc. Bất kỳ mã nào sau đó returnkhông được thực thi.

Nếu không có gì được trả về, hàm sẽ trả về một undefinedgiá trị.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ố

// 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

Enter first number: 3.4
Enter second number: 4
The sum is 7.4

Trong chương trình trên, tổng các số được trả về bởi hàm sử dụng returncâu lệnh. 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ể được sử dụng lại. 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 vì 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.

Biểu thức hàm

Trong Javacfscript, các hàm cũng có thể được định nghĩa dưới dạng các biểu thức. Ví dụ,

// program to find the square of a number
// function is declared inside the variable
let x = function (num) { return num * num };
console.log(x(4));

// can be used as variable value for other variables
let y = x(3);
console.log(y);

Đầu ra

16
9

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

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

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