Định nghĩa hàm JavaScript
Các hàm JavaScript được xác định bằng từ khóa function
.
Bạn có thể sử dụng khai báo hàm hoặc biểu thức hàm.
Khai báo hàm
Ở phần trước của hướng dẫn này, bạn đã biết rằng các hàm được khai báo bằng cú pháp sau:
function functionName ( parameters ) {
// code to be executed
}
Các hàm được khai báo không được thực thi ngay lập tức. Chúng được "lưu để sử dụng sau" và sẽ được thực thi sau khi chúng được gọi (được gọi).
Dấu chấm phẩy được sử dụng để phân tách các câu lệnh JavaScript thực thi được.
Vì một khai báo hàm không phải là một câu lệnh có thể thực thi được nên việc kết thúc nó bằng dấu chấm phẩy là không phổ biến.
Biểu thức hàm
Một hàm JavaScript cũng có thể được xác định bằng một biểu thức .
Một biểu thức hàm có thể được lưu trữ trong một biến:
Sau khi một biểu thức hàm được lưu trữ trong một biến, biến đó có thể được sử dụng làm hàm:
Hàm trên thực chất là một hàm ẩn danh (một hàm không có tên).
Các hàm được lưu trữ trong các biến không cần tên hàm. Chúng luôn được gọi (gọi) bằng tên biến.
Hàm trên kết thúc bằng dấu chấm phẩy vì nó là một phần của câu lệnh thực thi.
Hàm tạo hàm()
Như bạn đã thấy trong các ví dụ trước, các hàm JavaScript được định nghĩa bằng từ khóa function
.
Các hàm cũng có thể được xác định bằng hàm tạo hàm JavaScript tích hợp có tên là Function()
.
Ví dụ
const myFunction = new Function("a", "b", "return a * b");
let x = myFunction(4, 3);
Hãy tự mình thử »Bạn thực sự không cần phải sử dụng hàm tạo. Ví dụ trên cũng giống như cách viết:
Ví dụ
const myFunction = function (a, b) {return a * b};
let x = myFunction(4, 3);
Hãy tự mình thử » Trong hầu hết các trường hợp, bạn có thể tránh sử dụng từ khóa new
trong JavaScript.
Chức năng nâng
Trước đó trong hướng dẫn này, bạn đã tìm hiểu về "hoisting" ( JavaScript Hoisting ).
Hoisting là hành vi mặc định của JavaScript nhằm di chuyển các khai báo lên đầu phạm vi hiện tại.
Hoisting áp dụng cho việc khai báo biến và khai báo hàm.
Do đó, các hàm JavaScript có thể được gọi trước khi chúng được khai báo:
myFunction(5);
function myFunction(y) {
return y * y;
}
Các hàm được xác định bằng biểu thức sẽ không được nâng lên.
Chức năng tự gọi
Các biểu thức hàm có thể được thực hiện "tự gọi".
Một biểu thức tự gọi được gọi (bắt đầu) một cách tự động mà không cần được gọi.
Các biểu thức hàm sẽ tự động thực thi nếu biểu thức được theo sau bởi ().
Bạn không thể tự gọi một khai báo hàm.
Bạn phải thêm dấu ngoặc đơn xung quanh hàm để cho biết đó là biểu thức hàm:
Hàm trên thực chất là một hàm tự gọi ẩn danh (hàm không có tên).
Các hàm có thể được sử dụng làm giá trị
Các hàm JavaScript có thể được sử dụng làm giá trị:
Các hàm JavaScript có thể được sử dụng trong các biểu thức:
Hàm là đối tượng
Toán tử typeof
trong JavaScript trả về "hàm" cho các hàm.
Tuy nhiên, các hàm JavaScript tốt nhất có thể được mô tả dưới dạng đối tượng.
Các hàm JavaScript có cả thuộc tính và phương thức .
Thuộc tính arguments.length
trả về số lượng đối số nhận được khi hàm được gọi:
Phương thức toString()
trả về hàm dưới dạng một chuỗi:
Một hàm được định nghĩa là thuộc tính của một đối tượng, được gọi là một phương thức của đối tượng.
Một hàm được thiết kế để tạo các đối tượng mới được gọi là hàm tạo đối tượng.
Chức năng mũi tên
Hàm mũi tên cho phép sử dụng cú pháp ngắn để viết biểu thức hàm.
Bạn không cần từ khóa function
, từ khóa return
và dấu ngoặc nhọn .
Ví dụ
// ES5
var x = function(x, y) {
return x * y;
}
// ES6
const x = (x, y) => x * y;
Hãy tự mình thử » Chức năng mũi tên không có this
riêng của nó. Chúng không phù hợp lắm để định nghĩa các phương thức đối tượng .
Chức năng mũi tên không được nâng lên. Chúng phải được xác định trước khi sử dụng.
Sử dụng const
an toàn hơn sử dụng var
, vì biểu thức hàm luôn có giá trị không đổi.
Bạn chỉ có thể bỏ qua từ khóa return
và dấu ngoặc nhọn nếu hàm là một câu lệnh. Vì lý do này, việc luôn giữ chúng có thể là một thói quen tốt:
Chức năng mũi tên không được hỗ trợ trong IE11 trở về trước.