A brief talk on JS prototype chain and inheritance

JS prototype chain and inheritance is the focus of JS, so we use the following three examples for detailed explanation.

First define an object obj, the object's prototype is obj._proto_, we can use the getprototypeof in ES5 to query the prototype of obj, we pass To determine if obj's prototype is equal to Object.prototype to prove the existence of Obj's prototype, the answer returns TRUE, so exists. Then we define a function of Foo (), any function has its prototype object, that is, the prototype of the function, we can add any attributes on the prototype of the function, and then a instantiated object can share its properties through the new one (the following two examples are described in detail).

function foo () {}
Foo.prototype.z = 3;
var obj = new Foo ();
Obj.x=1;
obj.y=2;
obj.x//1
Obj.y//2
Obj.z//3
typeof Obj.tostring; function
Obj.valueof (); Foo {x:1, y:2, Z:3}
Obj.hasownproperty ("Z"); False

Here, the prototype of obj (_proto_) points to the prototype attribute of the Foo function, the Foo.prototype prototype points to Object.prototype, and the end of the prototype chain is null. by hasOwnProperty to see if the Z property is on obj and displays false, there is no z attribute on obj, but by looking up its prototype chain, it is found on foo.prototype, so obj.z=3, and for the first obj.valueof () And ToString are all object.prototype, so any object has these two attributes, because the prototype of any object is object.prototype. Of course, in addition to one of the following exceptions,

var obj2 = object.create (null); Obj2.valueof (); Undefined

Object.create () Creates an empty object, and the prototype of this object points to a parameter. Here's a comprehensive example to show you how to implement a class to inherit another class

Declares a constructor person function person (name,age) {    this.name = name;     this.age = age;}
Person.prototype.hi = function () {    console.log ("hi,my name is" + THIS.name +, "I Age is" +this.age);
};
person.prototype.legs_num=2;
person.prototype.arms_num=2;
Person.prototype.walk = function () {    Console.log (this.name+ "is walking!"); function Student (name,age,classnum) {    person.call (this,name,age);    
This.classnum = Classnum;
//Create an empty object Student.prototype = Object.create (Person.prototype);
constructor specifies the function to create an object.
Student.prototype.constructor = Student; Student.prototype.hi = function () {    console.log ("hi,my name is" + THIS.name +), "+this.age+"
And my class is "+this.classnum";};
Student.prototype.learns = function (sub) {    Console.log (this.name+ "is learning" +sub);
Instantiate an object bosn var bosn = new Student ("Bosn", "Class 3"); Bosn.hi (); &nBsp
Hi,my The name is Bosn,my the ' is ' and my ' Class 3 bosn.legs_num; //2 bosn.walk (); //bosn is walking! Bosn.learns ("math"); //bosn is learning Math

The constructor person and student this point to the instantiated object (BOSN), and the prototype of this object points to the prototype of the constructor.

We use the Object.create () method to create an empty object, the object's prototype matter Person.prototype, the advantage of this writing is that we You can create any property of the studnet.prototype without affecting the Person.prototype property, and you can inherit the original property on Person.prototype because the subclass student inherits the base class person. If you write Person.prototype = Student.prototype directly, he points to an object at the same time, adding attributes to the student.prototype, and adding the same attributes to the person's prototype chain.

For the call method inside the constructor student, this point points to the newly created student instantiated object and implements inheritance by call.

Student.prototype.constructor = Student, the meaning of this sentence is to specify the function of the Student to create the Student.prototype object, or the function of the object if it is not written.

For inheritance, there are three ways to implement it,

function Person (name,age) {
THIS.name = name;
This.age = age;
}
function Student () {

			
}
Student.prototype = Person.prototype; 1
Student.prototype = Object.create (Person.prototype); 2
Student.prototype = new Person (); 3

The first, which has just been mentioned above, is written directly so that subclasses and base classes point to the BOSN instance at the same time;

The second, just right to avoid this point, and very good implementation of inheritance, let the instance first query the subclass, if there is no corresponding attribute, and then query the base class;

The third, although it also implements inheritance, invokes the constructor of person, which has two parameters name and age, but this third is not transmitted and is not instantiated.