Từ khóa JavaScript này
Ví dụ
const person = {
firstName: "John",
lastName : "Doe",
id : 5566,
fullName : function() {
return this .firstName + " " + this .lastName;
}
};
Hãy tự mình thử »Cái này là cái gì ?
Trong JavaScript, từ khóa this
đề cập đến một đối tượng .
Đối tượng nào phụ thuộc vào cách this
được gọi (được sử dụng hoặc được gọi).
Từ khóa this
đề cập đến các đối tượng khác nhau tùy thuộc vào cách nó được sử dụng:
Trong một phương thức đối tượng, this đề cập đến đối tượng . |
Một mình, this đề cập đến đối tượng toàn cầu . |
Trong một hàm, this đề cập đến đối tượng toàn cục . |
Trong một hàm, ở chế độ nghiêm ngặt, this là undefined . |
Trong một sự kiện, this đề cập đến phần tử đã nhận được sự kiện. |
Các phương thức như call() , apply() và bind() có thể tham chiếu this tới bất kỳ đối tượng nào . |
Ghi chú
this
không phải là một biến. Đó là một từ khóa. Bạn không thể thay đổi giá trị của this
.cái này trong một Phương thức
Khi được sử dụng trong một phương thức đối tượng, this
đề cập đến đối tượng .
Trong ví dụ ở đầu trang này, this
đề cập đến đối tượng người .
Bởi vì phương thức fullName là một phương thức của đối tượng người .
fullName : function() {
return this .firstName + " " + this .lastName;
}
Hãy tự mình thử »điều này một mình
Khi được sử dụng một mình, this
đề cập đến đối tượng chung .
Bởi vì this
đang chạy trong phạm vi toàn cầu.
Trong cửa sổ trình duyệt, đối tượng chung là [object Window]
:
Trong chế độ nghiêm ngặt , khi được sử dụng một mình, this
cũng đề cập đến đối tượng chung :
cái này trong Hàm (Mặc định)
Trong một hàm, đối tượng chung là ràng buộc mặc định cho this
.
Trong cửa sổ trình duyệt, đối tượng chung là [object Window]
:
cái này trong một hàm (nghiêm ngặt)
Chế độ nghiêm ngặt của JavaScript không cho phép liên kết mặc định.
Vì vậy, khi được sử dụng trong một hàm, ở chế độ nghiêm ngặt, this
là undefined
.
cái này trong Trình xử lý sự kiện
Trong trình xử lý sự kiện HTML, this
đề cập đến phần tử HTML đã nhận sự kiện:
Liên kết phương thức đối tượng
Trong các ví dụ này, this
là đối tượng người :
Ví dụ
const person = {
firstName : "John",
lastName : "Doe",
id : 5566,
myFunction : function() {
return this ;
}
};
Hãy tự mình thử »Ví dụ
const person = {
firstName: "John",
lastName : "Doe",
id : 5566,
fullName : function() {
return this .firstName + " " +
this .lastName;
}
};
Hãy tự mình thử »tức là this.firstName là thuộc tính firstName của this (đối tượng người).
Ràng buộc chức năng rõ ràng
Các phương thức call()
và apply()
là các phương thức JavaScript được xác định trước.
Cả hai đều có thể được sử dụng để gọi một phương thức đối tượng với một đối tượng khác làm đối số.
Ví dụ bên dưới gọi Person1.fullName với Person2 làm đối số, điều này đề cập đến Person2, ngay cả khi fullName là một phương thức của Person1:
Ví dụ
const person1 = {
fullName: function() {
return this.firstName + " " + this.lastName;
}
}
const person2 = {
firstName:"John",
lastName: "Doe",
}
// Return "John Doe":
person1.fullName.call(person2);
Chức năng vay mượn
Với phương thức bind()
, một đối tượng có thể mượn một phương thức từ một đối tượng khác.
Ví dụ này tạo 2 đối tượng (người và thành viên).
Đối tượng thành viên mượn phương thức fullname từ đối tượng người:
Ví dụ
const person = {
firstName:"John",
lastName: "Doe",
fullName: function () {
return this.firstName + " " + this.lastName;
}
}
const member = {
firstName:"Hege",
lastName: "Nilsen",
}
let fullName = person.fullName.bind(member);
Hãy tự mình thử »Ưu tiên này
Để xác định đối tượng this
đề cập đến; sử dụng thứ tự ưu tiên sau đây.
Quyền ưu tiên | Sự vật |
1 | trói buộc() |
2 | áp dụng() và gọi() |
3 | Phương thức đối tượng |
4 | Phạm vi toàn cầu |
this
có phải là một hàm được gọi bằng cách sử dụng bind() không?
this
có phải là một hàm đang được gọi bằng cách sử dụng apply() không?
this
có phải là một hàm đang được gọi bằng cách sử dụng call() không?
this
có phải là một hàm đối tượng (phương thức) không?
this
có phải là một chức năng trong phạm vi toàn cầu.