Javascript Prototype là gì? Tạo ra Prototype như thế nào? | TopDev

Javascript prototype la gi

Video Javascript prototype la gi

Mở đầu

nguyên mẫu là một khái niệm cốt lõi cơ bản trong javascript và rất quan trọng để triển khai oop trong javascript. Vì javascript là ngôn ngữ dựa trên nguyên mẫu nên không có khái niệm về các lớp như các ngôn ngữ hướng đối tượng khác. Trong bài viết này, chúng ta sẽ xem cách nguyên mẫu được hiểu một cách lỏng lẻo trong javascript là kế thừa ( kế thừa ).

Nguyên mẫu là gì?

nguyên mẫu là cơ chế mà các đối tượng trong javascript kế thừa các thuộc tính từ một đối tượng khác. Tất cả các đối tượng trong javascript đều có một nguyên mẫu và các đối tượng này kế thừa các thuộc tính và phương thức từ nguyên mẫu của chúng.

Bạn nên nhận thấy rằng bản thân nguyên mẫu là một đối tượng trong js được gọi là đối tượng nguyên mẫu. Chúng ta cần biết điều này để tránh nhầm lẫn với thuộc tính nguyên mẫu của hàm.

Ghi chú:

  1. Trong javascript, các hàm cũng được coi như các đối tượng. Và hàm có một thuộc tính gọi là thuộc tính nguyên mẫu , bản thân nó là một đối tượng.
  2. Nếu chúng ta sử dụng các hàm để tạo các đối tượng nguyên mẫu, chúng ta có thể thêm các thuộc tính hoặc phương thức vào thuộc tính nguyên mẫu của phương thức khởi tạo kế thừa triển khai. Tất cả các đối tượng con được tạo bởi một hàm tạo đều mang một giá trị trong thuộc tính nguyên mẫu của hàm.
  3. Các đối tượng trong javascript có một khái niệm được gọi là thuộc tính nguyên mẫu có giá trị trỏ đến đối tượng nguyên mẫu mà từ đó nó kế thừa các thuộc tính. Chúng tôi sử dụng thuộc tính __proto__ để truy cập đối tượng nguyên mẫu.

Làm thế nào để tạo một nguyên mẫu?

Chúng tôi khai báo một hàm tạo:

prototype là gì

Ví dụ trên chỉ tạo một hàm khởi tạo người (_age, _name). Thuộc tính nguyên mẫu của hàm này chứa thuộc tính chiều cao. Do đó, đối tượng được tạo từ constructor này sẽ có 3 thuộc tính: age, name và height.

Chúng ta có thể truy cập đối tượng nguyên mẫu của đối tượng mới được tạo (đối tượng vừa được tạo), coi đối tượng này như một đối tượng có 1 thuộc tính hàm tạo và 1 thuộc tính chiều cao.

Tại sao nguyên mẫu lại quan trọng trong javascript?

Kế thừa trong javascript

Để triển khai kế thừa trong js, bạn chỉ cần tạo 1 hàm tạo. Sau đó, thêm các thuộc tính và phương thức vào các thuộc tính nguyên mẫu của phương thức khởi tạo này.

Thể hiện được tạo bởi hàm tạo này sẽ chứa các thuộc tính và phương thức được định nghĩa ở trên. Vì javascript không có khái niệm về các lớp, nên để thực hiện kế thừa như các ngôn ngữ oop khác để mở rộng ứng dụng, chúng ta cần các nguyên mẫu.

Trong đoạn mã trên, đối tượng chophuquoc sử dụng hàm showage () của nguyên mẫu động vật, vì chúng tôi đã gán hàm tạo của động vật cho nguyên mẫu con chó. Như vậy bạn có thể thấy rõ tính kế thừa trong js. Đối tượng chophuquoc kế thừa nội dung của dog.prototype và cũng kế thừa các thuộc tính mà animal.prototype có.

Truy cập thuộc tính đối tượng: Chuỗi nguyên mẫu

Nguyên mẫu rất quan trọng để cung cấp cho chúng tôi quyền truy cập vào các thuộc tính và phương thức của đối tượng. Khi chúng ta truy cập một thuộc tính của một đối tượng, javascript sẽ tìm kiếm thuộc tính đó bên trong chính đối tượng đó. Nếu không, nó tiếp tục tìm kiếm nguyên mẫu của đối tượng, v.v., cho đến khi gặp đối tượng.prototype, sau đó dừng lại và in kết quả (không xác định nếu không tìm thấy).

Quy trình lặp đi lặp lại này được gọi là nguyên mẫu (chuỗi nguyên mẫu) trong javascript. Chính điều này cộng với thuộc tính nguyên mẫu của hàm tạo thành cơ chế kế thừa dựa trên nguyên mẫu của JavaScript.

Có thể bạn muốn tìm hiểu thêm:

  • bảng định kiểu tạm thời
  • Các nguyên mẫu JavaScript chuyên sâu
  • Các bao đóng JavaScript là gì?