Giao thức原型 JavaScript

Tất cả các đối tượng JavaScript đều kế thừa thuộc tính và phương thức từ nguyên mẫu.

Trong chương trước, chúng ta đã học cách sử dụngHàm xây dựng đối tượng:

Mẫu

function Person(first, last, age, eyecolor) {
    this.firstName = first;
    this.lastName = last;
    this.age = age;
    this.eyeColor = eyecolor;
}
var myFather = new Person("Bill", "Gates", 62, "blue");
var myMother = new Person("Steve", "Jobs", 56, "green");

Thử nghiệm cá nhân

Chúng tôi đã nhận ra rằng bạnKhông thểThêm thuộc tính mới cho hàm xây dựng của đối tượng đã có:

Mẫu

Person.nationality = "English";

Thử nghiệm cá nhân

Nếu cần thêm một thuộc tính mới cho hàm xây dựng, thì bạn phải thêm nó vào hàm xây dựng:

Mẫu

function Person(first, last, age, eyecolor) {
    this.firstName = first;
    this.lastName = last;
    this.age = age;
    this.eyeColor = eyecolor;
    this.nationality = "English";
}

Thử nghiệm cá nhân

Kế thừa nguyên mẫu

Tất cả các đối tượng JavaScript đều kế thừa thuộc tính và phương thức từ nguyên mẫu.

Đối tượng ngày kế thừa từ Date.prototype. Đối tượng mảng kế thừa từ Array.prototype. Đối tượng Person kế thừa từ Person.prototype.

Object.prototype nằm ở đầu của chuỗi kế thừa nguyên mẫu:

Đối tượng ngày, đối tượng mảng và đối tượng Person kế thừa từ Object.prototype.

Thêm thuộc tính và phương thức vào đối tượng

Đôi khi, bạn muốn thêm thuộc tính (hoặc phương thức) mới cho tất cả các đối tượng đã có của loại đã cho.

Đôi khi, bạn muốn thêm thuộc tính mới (hoặc phương pháp) vào đối tượng xây dựng.

Sử dụng prototype Thuộc tính

Thuộc tính prototype của JavaScript cho phép bạn thêm thuộc tính mới cho đối tượng xây dựng:

Mẫu

function Person(first, last, age, eyecolor) {
    this.firstName = first;
    this.lastName = last;
    this.age = age;
    this.eyeColor = eyecolor;
}
Person.prototype.nationality = "English";

Thử nghiệm cá nhân

Thuộc tính prototype của JavaScript cũng cho phép bạn thêm phương pháp mới cho đối tượng xây dựng:

Mẫu

function Person(first, last, age, eyecolor) {
    this.firstName = first;
    this.lastName = last;
    this.age = age;
    this.eyeColor = eyecolor;
}
Person.prototype.name = function() {
    return this.firstName + " " + this.lastName;
};

Thử nghiệm cá nhân

Chỉ thay đổiBản thân bạn的原型。Chớ bao giờ thay đổi nguyên型 của đối tượng JavaScript tiêu chuẩn.