Tham số “this” là một thành phần quan trọng trong JavaScript hướng đối tượng và sự hiểu biết sâu sắc về cách nó hoạt động là chìa khóa để mở khóa rất nhiều khái niệm khác. Bài viết này cung cấp cho bạn cái nhìn sâu sắc cần thiết để có thể xóa đi những điều khó khăn đối với khái niệm này.
Chính xác thì “this” là gì?
Khi một hàm được gọi, ngoài các đối số được truyền một cách tường minh, nó nhận được các tham số ngầm khác có thể truy cập được bên trong nội dung của hàm. Một trong số đó là tham số this đại diện cho đối tượng được liên kết với lệnh gọi hàm. Nó thường được gọi là ngữ cảnh hàm.
Tuy nhiên, this và cách nó được xác định là một trong những thứ khá phức tạp trong JavaScript. Giá trị của this không chỉ được quy định bởi cách thức và vị trí một hàm được xác định, mà còn phần lớn bởi cách nó được gọi. Để bắt đầu tìm hiểu xem “this” trong một hàm được xác định như thế nào, chúng ta phải xem lại kiến thức của mình về hành vi của hàm.
Gọi hàm
Có bốn cách hàm có thể được gọi trong JavaScript, mỗi cách có đặc thù riêng:
1. Dưới dạng một hàm — averageJoe(), trong đó hàm được gọi một cách trực tiếp.
2. Là một phương thức — averageJoe.talk (), liên kết lời gọi với một đối tượng, cho phép lập trình hướng đối tượng.
3. Là một phương thức khởi tạo — new averageJoe(), trong đó một đối tượng mới được tạo ra.
4. Thông qua các phương thức call hoặc apply — averageJoe.call(someObject) hoặc averageJoe.apply(someObject)
Như một hàm
function averageJoe() {
console.log(this)
}
function strictJoe() {
"use strict"
console.log(this)
}
averageJoe() // window object
strictJoe() // undefined
Như một phương thức
averageJoe = {
name: "Joe",
talk: function() {
console.log(this)
}
}
averageJoe.talk() // {name: "Joe", talk: ƒ}
Như một phương thức khởi tạo
function AverageJoe() {
console.log(this) // {} 'new object'
this.name = "Joe"
console.log(this) // {name: "Joe"}
}
new AverageJoe()
Thông qua phương thức call hay apply
let averageJoe = {
name: "Joe"
}
function randomGuy() {
console.log(this)
}
randomGuy.call(averageJoe) // {name: "Joe"}
Chúng ta đã có một số ví dụ liên quan đến thông số this sử dụng với hàm. Hy vọng vài viết hữu ích đối với bạn. Cảm ơn vì đã đọc. Xem thêm các khóa học của tôi về Javascript: