本文約定:不特殊聲明的情況下,屬性代指屬性或方法。
創建對象、對象繼承實際上是一回事:我們所需要的實例對象通過構造函數獲得私有屬性、通過原型鏈獲得共享的屬性。什麼是好的方式?私有屬性通過構造函數的方式獲得(不考慮實例中自定義私有屬性)且不需要重寫,共享屬性通過原型鏈找到且不需要重復創建。
普適的方式
組合使用構造函數模式和原型模式創建對象
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);
原型式繼承和寄生式繼承用於創建與已有對象類似的實例對象。