Tìm Hiểu Về this Trong JavaScript

Trong JavaScript, this là một từ khóa quan trọng và cũng là một khái niệm dễ gây nhầm lẫn cho nhiều lập trình viên, đặc biệt là người mới học. this đại diện cho ngữ cảnh thực thi hiện tại và giá trị của nó phụ thuộc vào cách và nơi mà nó được gọi. Dưới đây là giải thích chi tiết về từ khóa this trong các trường hợp khác nhau.

1. this Trong Phạm Vi Toàn Cục (Global Context)

Trong phạm vi toàn cục (global scope) hoặc khi được gọi từ một hàm toàn cục, this tham chiếu đến đối tượng toàn cục. Trong trình duyệt, đối tượng này chính là window.

Ví dụ:

this

2. this Trong Một Đối Tượng (Object Context)

Khi sử dụng this trong một đối tượng, this tham chiếu đến đối tượng đó, cho phép bạn truy cập các thuộc tính và phương thức của nó.

Ví dụ:

this

Ở đây, this trong hàm tạo Person tham chiếu đến đối tượng mới (tức là đối tượng john) khi hàm được gọi bằng từ khóa new.

4. this Trong Phương Thức Mũi Tên (Arrow Function)

Với arrow function, this không bị ràng buộc theo cách thông thường. Nó kế thừa giá trị this từ ngữ cảnh mà nó được định nghĩa, thay vì từ ngữ cảnh mà nó được gọi.

Ví dụ:

this

Ở đây, this tham chiếu đến phần tử DOM mà sự kiện click được gán.

6. this Trong Strict Mode (Chế Độ “Strict”)

Trong Strict Mode (chế độ nghiêm ngặt), this trong một hàm toàn cục sẽ là undefined, thay vì tham chiếu đến đối tượng toàn cục như bình thường.

Ví dụ:

this

bind()

bind() tạo ra một hàm mới mà giá trị của this được ràng buộc với đối tượng cụ thể. Không giống như call() và apply(), nó không gọi hàm ngay lập tức mà chỉ trả về một bản sao của hàm với giá trị this mới.

Ví dụ:

const greetPerson = greet.bind(person);
greetPerson(); // 'John'

Kết Luận

Từ khóa this trong JavaScript có thể thay đổi tùy thuộc vào ngữ cảnh gọi hàm và cách sử dụng. Việc hiểu rõ về this sẽ giúp bạn tránh được các lỗi phổ biến khi làm việc với các đối tượng và hàm trong JavaScript.

• JavaScript