本文約定:在不特殊宣告的情況下,屬性代指屬性或方法。
建立物件、物件繼承其實是一回事:我們所需要的實例物件透過建構函式獲得私有屬性、透過原型鏈獲得共享的屬性。什麼是好的方式?私有屬性透過建構函數的方式取得(不考慮實例中自訂私有屬性)且不需要重寫,共享屬性透過原型鏈找到且不需要重複建立。
普適的方式
組合使用建構函式模式和原型模式建立物件
function HNU_student(name) { this.name = name; this.sayName = function() { return this.name; }; } HNU_student.prototype = { school: 'HNU', saySchool: function() { return this.school; } }; Object.defineProperty(HNU_student, 'constructor', {value: HNU_student}); var hiyohoo = new HNU_student('xujian');
透過字面量的方式會重寫prototype,且原型的constructor指向了Object,必要的情況下需要重新定義constructor。
寄生組合式繼承
function object(o) { function F() {}; F.prototype = o; return new F(); } function inheritPrototype(child, parent) { var prototype = object(parent.prototype); prototype.constructor = child; child.prototype = prototype; } function HNU_student(name) { this.name = name; this.sayName = function() { return this.name; }; } HNU_student.prototype.school = 'HNU'; HNU_student.prototype.saySchool = function() { return this.school; }; function Student_2011(name, number) { HNU_student.call(this, name); this.number = number; this.sayNumber = function() { return this.number; } } inheritPrototype(Student_2011, HNU_student); Student_2011.prototype.graduationTime = 2015; Student_2011.prototype.sayGraduationTime = function() { return this.graduationTime; }; var hiyohoo = new Student_2011('xujian', 20110803203);
object()的作用:將作為參數傳入的物件變成實例的原型,該物件的屬性被所有實例共享。
共享屬性:inheritPrototype(Student_2011, HNU_student);,子構造函數原型成為超構造函數原型的一個實例,超構造函數原型中的屬性共享給子構造函數。
私有屬性:HNU_student.call(this, name);,透過子建構函式建立實例時呼叫超建構函式建立私有屬性。
建立物件的其他方式
動態原型模式
function HNU_student(name) { this.name = name; this.sayName = function() { return this.name; }; if (!HNU_student.prototype.school) { HNU_student.prototype.school = 'HNU'; HNU_student.prototype.saySchool = function() { return this.school; }; } } var hiyohoo = new HNU_student('xujian');
將定義在原型中的共享屬性放入建構函式中,使用判斷語句,在第一次呼叫建構函式建立實例時,初始化原型共享屬性。
寄生建構子模式
function SpecialArray() { var values = new Array(); values.push.apply(values, arguments); values.toPipedString = function() { return this.join('|'); }; return values; } var colors = new SpecialArray('red', 'black', 'white');
用於為原生建構函式新增特殊的屬性。
其他物件繼承的方式
組合繼承
function HNU_student(name) { this.name = name; this.sayName = function() { return this.name; }; } HNU_student.prototype.school = 'HNU'; HNU_student.prototype.saySchool = function() { return this.school; }; function Student_2011(name, number) { HNU_student.call(this, name); this.number = number; this.sayNumber = function() { return this.number; }; } Student_2011.prototype = new HNU_student(); Student_2011.prototype.constructor = Student_2011; Student_2011.prototype.graduationTime = 2015; Student_2011.prototype.sayGraduationTime = function() { return this.graduationTime; } var hiyohoo = new Student_2011('xujian', 20110803203);
共享屬性:Student_2011.prototype = new HNU_student();,子構造函數的原型指向了超構造函數的原型,實例透過原型鏈找到所有共享的屬性。
私有屬性:HNU_student.call(this, name);,透過子建構函式建立實例時呼叫超建構函式建立私有屬性。
缺陷:超構造函數被呼叫了兩遍。 Student_2011.prototype = new HNU_student();的同時,在子建構函式原型中建立了超建構函式定義的私有屬性,這些原型中的私有屬性被實例中的同名屬性覆寫屏蔽。
原型式繼承、寄生式繼承
function object(o) { function F() {} F.prototype = o; return new F(); } var student1 = { school: 'HNU', saySchool: function() { return this.school; } }; var student2 = object(student1);
Object.creat()是ECMAScript5新增的方法,接受兩個參數:一是作為原型的原對象,二是重寫或新增屬性的對象,作用與自訂的object()相同。
var student1 = { name: 'xujian', school: 'HNU' }; var student2 = Object.create(student1, { name: { value: 'huangjing' } });
寄生式繼承在原型式繼承的基礎上增加了額外的屬性用來增強物件。
function object(o) { function F() {} F.prototype = o; return new F(); } function creatAnother(original) { var clone = object(original); clone.sayHi = function() { alert('Hi!'); }; return clone; } var student1 = { school: 'HNU', saySchool: function() { return this.school; } }; var student2 = creatAnother(student1);
原型式繼承和寄生式繼承用於建立與已有物件類似的實例物件。