Detailed description of practical methods for creating objects and inheriting objects using javascript, and detailed description of javascript
This article stipulates that attributes refer to attributes or methods without special declarations.
Creating objects and inheriting objects are actually one thing: the instance objects we need get private attributes through constructors and share attributes through prototype chains. What is a good method? Private attributes are obtained through Constructor (without considering custom private attributes in the instance) and do not need to be overwritten. shared attributes are found through the prototype chain and do not need to be created again.
Universal approach
Create an object by combining the constructor mode and the prototype mode
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 is rewritten literally, And the constructor of the prototype points to the Object. If necessary, the constructor needs to be redefined.
Parasitic combined inheritance
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 (): changes the object passed in as a parameter to the instance prototype. The attributes of this object are shared by all instances.
Shared attributes: inheritPrototype (Student_2011, HNU_student); the sub-constructor prototype is an instance of the Super constructor prototype, and the attributes in the super constructor prototype are shared to the sub-constructor.
Private property: HNU_student.call (this, name);. When an instance is created using a sub-constructor, The superconstructor is called to create a private property.
Other methods for creating objects
Dynamic Prototype
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');
Put the shared attribute defined in the prototype into the constructor and use the judgment statement to initialize the shared attribute of the prototype when the constructor is called to create an instance for the first time.
Parasitic constructor Mode
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');
Adds special attributes for native constructors.
Other methods of Object Inheritance
Combination inheritance
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);
Shared attributes: Student_2011.prototype = new HNU_student (); the sub-constructor prototype points to the hyper-constructor prototype, and the instance finds all shared attributes through the prototype chain.
Private property: HNU_student.call (this, name);. When an instance is created using a sub-constructor, The superconstructor is called to create a private property.
Defect: The superconstructor is called twice. Student_2011.prototype = new HNU_student (); at the same time, a private attribute defined by the super constructor is created in the subconstructor prototype. The private attributes in these prototypes are overwritten and blocked by attributes of the same name in the instance.
Original Type inheritance and parasitic inheritance
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 () is a new method added by ECMAScript5. It accepts two parameters: one is the original object of the prototype, and the other is the object for rewriting or adding properties, which has the same role as the custom object.
var student1 = { name: 'xujian', school: 'HNU'};var student2 = Object.create(student1, { name: { value: 'huangjing' }});
Additional attributes are added to the original type inheritance to enhance the object.
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);
Original Type inheritance and parasitic inheritance are used to create instance objects similar to existing objects.
Articles you may be interested in:
- Create objects in JS (several common methods)
- Create an object using JavaScript
- Three methods for creating objects in JavaScript
- Javascript Object-oriented Inheritance
- Thoughts on the call mechanism caused by the call () method in JavaScript
- Typical Implementation of javaScript Object-oriented Inheritance
- How to create an object using JavaScript
- Examples of how to create objects in js
- Prototype chain inheritance instance of js Object Inheritance