Tóm Tắt
Giới thiệ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ó thể được hiểu nôm na là kế thừa ( kế thừa ) trong javascript.
Nguyên mẫu là gì?
Nguyên mẫu là cơ chế mà một đối tượng trong javascript kế thừa các đặc điểm 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à những đối tượng này kế thừa các thuộc tính và phương thức của nguyên mẫu của chúng.
Bạn đang xem: Javascript prototype la gi
Cần lưu ý 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.
Một điều cần nhớ:
- Trong Javascript, một hàm cũng được coi là một đố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.
- Nếu chúng tôi sử dụng hàm này để tạo một đối tượng nguyên mẫu, thì bạn có thể thêm các thuộc tính hoặc phương thức của thuộc tính nguyên mẫu của phương thức khởi tạo thực hiện kế thừa. 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.
- Các đối tượng 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 cách nào để tạo nguyên mẫu?
Xem thêm: Nhựa nguyên sinh là gì? Đặc tính của từng loại – Baby Của Tôi
Chúng ta khai báo một hàm tạo:
// Tạo một nguyên mẫu, cũng tạo một hàm đối tượng nguyên mẫu Person (_age, _name) {this.age = _age; this.name = _name;} / / các thuộc tính có thể được thêm vào thuộc tính nguyên mẫu của phương thức khởi tạo Person.prototype.height = 0; // tạo một cá thể Person // có tất cả 3 thuộc tính của phương thức khởi tạo Person var jack_holder = new Person (10, “Jack”); for (var att trong jack_woman) {console.log (att);} // Xem đối tượng nguyên mẫu của phiên bản mới được tạo jack_woman .__ proto__;
Ví dụ trên chỉ tạo một hàm khởi tạo hàm Person (_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. Vì vậy đố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 chứa 1 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 thuộc tính nguyên mẫu của phương thức khởi tạo này.
Xem thêm: Giá vốn hàng bán tiếng anh là gì
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 Prototype.
// Tạo phương thức khởi tạo cơ sở Animal (_age) {this.age = _age;} // Bạn có thể thêm một thuộc tính vào thuộc tính nguyên mẫu của phương thức khởi tạo Animal.prototype.showAge = function () {console.log ( this .age);}; // Tạo một hàm tạo con (sẽ được sử dụng để kế thừa hàm cơ sở) function Dog (_color) {this.color = _color;} // Thực hiện kế thừa, gán hàm tạo của Animal cho nguyên mẫu Dog của Dog . prototype = new Animal (); Dog.prototype.showColor = function () {console.log (this.color);}; // kiểm tra tính kế thừa var Chophuquoc = new Dog (‘yellow’); Chohuquoc.age = 3; chohuquoc .showAge (); //3chochuquoc.showColor (); // yellow
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 của Chó. Như vậy bạn có thể thấy rõ tính kế thừa trong js. Đối tượng chophhuquoc kế thừa nội dung của Dog.prototype và cũng kế thừa các thuộc tính của Animal.prototype.
Truy cập thuộc tính đối tượng: Chuỗi nguyên mẫu
Nguyên mẫu là để chúng ta truy cập các thuộc tính và phương thức của một đối tượng. Khi chúng ta truy cập 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ó sẽ 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à trả về kết quả (không xác định nếu không tìm thấy).
Quá trình 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.
Bạn có thể muốn xem thêm:
Xem thêm: Đất phát triển hạ tầng là gì? Câu chuyện có thật khi mua đất hạ tầng
- TypeScript thoáng qua
- Nguyên mẫu Javascript chuyên sâu
- Các bao đóng JavaScript là gì?
.
