Định nghĩa hàm trong JavaScript

Hàm JavaScript được định nghĩa bằng cách sử dụng function từ khóađịnh nghĩađể.

Bạn có thể sử dụng hàmkhai báohoặc hàmBiểu thức

khai báo hàm

Trong phần hướng dẫn này trước đó, bạn đã học cách sử dụng ngữ pháp sau:khai báohàm:

function tên hàm(tham số) {
   Mã cần thực thi
}

Hàm được khai báo sẽ không được thực thi trực tiếp. Họ được ‘lưu trữ để sử dụng sau này’ và sẽ được thực thi sau này, khi chúng được gọi.

Ví dụ

function myFunction(a, b) {
     return a * b;
}

Thử nghiệm trực tiếp

dấu chấm phẩy được sử dụng để phân隔 các câu lệnh JavaScript có thể thực thi.

Do hàmkhai báokhông phải là câu lệnh có thể thực thi, thường không kết thúc bằng dấu chấm phẩy.

biểu thức hàm

Hàm JavaScript cũng có thể sử dụngBiểu thứcđể định nghĩa.

Biểu thức hàm có thể được lưu trữ trong biến:

Ví dụ

var x = function (a, b) {return a * b};

Thử nghiệm trực tiếp

Sau khi lưu trữ biểu thức hàm trong biến, biến đó có thể được sử dụng như một hàm:

Ví dụ

var x = function (a, b) {return a * b};
var z = x(4, 3);

Thử nghiệm trực tiếp

hàm trên thực chất là mộtHàm ẩn danh(hàm không có tên)。

Hàm lưu trữ trong biến không cần tên hàm. Họ luôn sử dụng tên biến để gọi.

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 có thể thực thi.

hàm xây dựng Function()

Như bạn đã thấy trong ví dụ trước, hàm JavaScript được định nghĩa bằng cách sử dụng function định nghĩa.

Hàm cũng có thể được định nghĩa bằng cách sử dụng từ khóa Function() của các hàm JavaScript được xây dựng sẵn.

Ví dụ

var myFunction = new Function("a", "b", "return a * b");
var x = myFunction(4, 3);

Thử nghiệm trực tiếp

thực tế bạn không cần sử dụng hàm constructor. Ví dụ trên cũng có thể viết như sau:

Ví dụ

var myFunction = function (a, b) {return a * b};
var x = myFunction(4, 3);

Thử nghiệm trực tiếp

trong hầu hết các trường hợp, bạn có thể tránh sử dụng new ký tự từ khóa.

nâng cao hàm

trong hướng dẫn này, bạn đã học về "nâng cao" (hoisting) từ trước.

Hoisting là cách mà JavaScript sẽkhai báohành vi mặc định là di chuyển lên đầu khung cảnh hiện tại.

Hoisting được áp dụng cho 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 được khai báo:

myFunction(5);
 function myFunction(y) {
     return y * y;
}

hàm được định nghĩa bằng biểu thức sẽ không được nâng cao.

hàm tự gọi

Biểu thức hàm có thể là "tự gọi".

Biểu thức tự gọi sẽ tự động được gọi (bắt đầu), mà không cần gọi.

Biểu thức hàm sẽ tự động thực thi, nếu biểu thức sau đó theo sau ()

Bạn không thể tự gọi biểu thức hàm.

Bạn cần thêm dấu ngoặc đơn xung quanh hàm để chỉ ra rằng nó là biểu thức hàm:

Ví dụ

(function () {
    var x = "Hello!!";      // Tôi sẽ gọi chính tôi
})();

Thử nghiệm trực tiếp

hàm trên thực chất là mộthàm tự gọi ẩn danh(hàm không có tên)。

hàm có thể được sử dụng như giá trị

các hàm JavaScript có thể được sử dụng như giá trị:

Ví dụ

function myFunction(a, b) {
    return a * b;
}
var x = myFunction(4, 3);

Thử nghiệm trực tiếp

các hàm JavaScript có thể được sử dụng trong biểu thức:

Ví dụ

function myFunction(a, b) {
    return a * b;
}
var x = myFunction(4, 3) * 2;

Thử nghiệm trực tiếp

hàm là đối tượng

trong JavaScript typeof toán tử sẽ trả về "function"。

nhưng tốt nhất là nên mô tả hàm JavaScript dưới dạng đối tượng.

các hàm JavaScript đều cóthuộc tínhphương thức

arguments.length sẽ trả về số lượng tham số được nhận khi hàm được gọi:

Ví dụ

function myFunction(a, b) {
    return arguments.length;
}

Thử nghiệm trực tiếp

toString() phương thức trả về hàm dưới dạng chuỗi:

Ví dụ

function myFunction(a, b) {
    return a * b;
}
var txt = myFunction.toString();

Thử nghiệm trực tiếp

Các hàm được định nghĩa là thuộc tính đối tượng được gọi là phương pháp đối tượng.

Các hàm được thiết kế để tạo đối tượng mới được gọi là hàm构造 đối tượng (hàm constructor) của đối tượng.

Hàm mũi tên

Hàm mũi tên cho phép sử dụng ngữ pháp ngắn gọ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花括.

Ví dụ

// ES5
var x = function(x, y) {
  return x * y;
}
// ES6
const x = (x, y) => x * y;

Thử nghiệm trực tiếp

Hàm mũi tên không có this riêng. Chúng không phù hợp để định nghĩa phương pháp đối tượng.

Hàm mũi tên không được提升. Chúng phải được định nghĩa trước khi sử dụng.

Sử dụng const an toàn hơn var vì biểu thức hàm luôn là giá trị cứng.

Nếu hàm là một câu lệnh duy nhất, bạn chỉ có thể bỏ qua từ khóa return và dấu ngoặc花括. Do đó, giữ chúng có thể là một thói quen tốt:

Ví dụ

const x = (x, y) => { return x * y };

Thử nghiệm trực tiếp

IE11 hoặc các phiên bản sớm hơn không hỗ trợ hàm mũi tên.