Lời mời hàm JavaScript
Mã bên trong JavaScript functionsẽ thực thi khi "thứ gì đó" gọi nó.
Gọi một hàm JavaScript
Mã bên trong một hàm không được thực thi khi hàm được xác định .
Mã bên trong một hàm được thực thi khi hàm được gọi .
Người ta thường sử dụng thuật ngữ " gọi một hàm " thay vì " gọi một hàm ".
Người ta cũng thường nói "gọi một hàm", "bắt đầu một hàm" hoặc "thực thi một hàm".
Trong hướng dẫn này, chúng tôi sẽ sử dụng lệnh gọi , vì một hàm JavaScript có thể được gọi mà không cần gọi.
Gọi một hàm dưới dạng một hàm
Thí dụ
function myFunction(a, b) {
return a * b;
}
myFunction(10, 2); //
Will return 20
Hàm trên không thuộc đối tượng nào. Nhưng trong JavaScript luôn có một đối tượng toàn cục mặc định.
Trong HTML, đối tượng toàn cục mặc định là chính trang HTML, vì vậy chức năng trên "thuộc về" trang HTML.
Trong trình duyệt, đối tượng trang là cửa sổ trình duyệt. Chức năng trên tự động trở thành một chức năng cửa sổ.
myFunction () và window.myFunction () là cùng một chức năng:
Thí dụ
function myFunction(a, b) {
return a * b;
}
window.myFunction(10, 2); // Will also return 20
Đây là một cách phổ biến để gọi một hàm JavaScript, nhưng không phải là một cách thực hành tốt.
Các biến, phương thức hoặc hàm toàn cục có thể dễ dàng tạo ra xung đột tên và lỗi trong đối tượng toàn cục.
Từ khoá này
Trong JavaScript, thứ được gọi thislà đối tượng "sở hữu" mã hiện tại.
Giá trị của this, khi được sử dụng trong một hàm, là đối tượng "sở hữu" hàm.
Lưu ý rằng đó thiskhông phải là một biến. Nó là một từ khóa. Bạn không thể thay đổi giá trị của this.
Mẹo: Đọc thêm về thistừ khóa tại JS Từ khóa này .
Đối tượng toàn cầu
Khi một hàm được gọi mà không có đối tượng chủ sở hữu, giá trị của this
sẽ trở thành đối tượng toàn cục.
Trong trình duyệt web, đối tượng chung là cửa sổ trình duyệt.
Ví dụ này trả về đối tượng window dưới dạng giá trị của this:
Thí dụ
let x = myFunction();
// x will be the window object
function myFunction() {
return this;
}
Gọi một hàm dưới dạng một hàm toàn cục, làm cho giá trị của hàm này là đối tượng toàn cục.
Việc sử dụng đối tượng window như một biến có thể dễ dàng làm hỏng chương trình của bạn.
Gọi một hàm dưới dạng một phương thức
Trong JavaScript, bạn có thể định nghĩa các hàm dưới dạng các phương thức đối tượng.
Ví dụ sau tạo một đối tượng ( myObject ), với hai thuộc tính ( firstName và lastName ) và một phương thức ( fullName ):
Thí dụ
const myObject = {
firstName:"John",
lastName: "Doe",
fullName: function () {
return this.firstName + " " + this.lastName;
}
}
myObject.fullName(); // Will return "John Doe"
Phương thức fullName là một hàm. Chức năng thuộc về đối tượng. myObject là chủ sở hữu của hàm.
Thứ được gọi thislà đối tượng "sở hữu" mã JavaScript. Trong trường hợp này giá trị của this
là myObject .
Kiểm tra nó! Thay đổi phương thức fullName để trả về giá trị của this:
Thí dụ
const myObject = {
firstName:"John",
lastName: "Doe",
fullName: function () {
return this;
}
}
// This will return [object Object] (the owner object)
myObject.fullName();
Gọi một hàm như một phương thức đối tượng, khiến giá trị của chính this
là đối tượng.
Gọi một hàm với một hàm tạo hàm
Nếu một lời gọi hàm được đặt trước newtừ khóa, nó là một lời gọi hàm tạo.
Có vẻ như bạn tạo một hàm mới, nhưng vì các hàm JavaScript là các đối tượng nên bạn thực sự tạo một đối tượng mới:
Thí dụ
// This is a function constructor:
function myFunction(arg1, arg2) {
this.firstName = arg1;
this.lastName = arg2;
}
// This creates a new object
const myObj = new myFunction("John", "Doe");
// This will return "John"
myObj.firstName;
Một lệnh gọi phương thức khởi tạo tạo ra một đối tượng mới. Đối tượng mới kế thừa các thuộc tính và phương thức từ phương thức khởi tạo của nó.
Từ thiskhóa trong hàm tạo không có giá trị.
Giá trị của thiswill là đối tượng mới được tạo khi hàm được gọi.