JavaScript prototype chain

For a description of the prototype property, cite the article: http://www.cnblogs.com/dolphinX/p/3286177.html

1. What is the prototype chain?

Prototypes have a pointer to a constructor

What if we let the subclass prototype object be equal to another instance of the type new superclass ()? At this point, the subclass prototype object contains a pointer to the superclass prototype, and a pointer to the superclass constructor is included in the superclass prototype. This progression continues, forming a prototype chain.

2. Why define the concept of a prototype chain?

Many OO languages support two ways of inheriting: interface inheritance and implementation inheritance.

1. Interface inheritance only inherits method signatures

2. Implement inheritance to inherit the actual method

Because the function in ECMAScript is not signed, interface inheritance cannot be implemented. ECMAScript only supports implementation of inheritance, and the prototype chain as the primary way to implement the inheritance.

3. Example of a prototype chain implementation inheritance

Example 1. Define the class student and inherit it from the class person

function Student (name) {this.name = name;}; Student.prototype.sayName = function () {Console.log ("Student:" +this.name);} function person (name) {this.name = name;}; Person.prototype.sayName = function () {console.log (this.name);} Person.prototype.sayType = function () {Console.log ("I ' m person!");} Clear concept: Student.prototype is a Student class object (also known as a prototype of a Student instance), Student is a constructor for the Student class (that is, Student.prototype.constructor = Student)//core: Let Student inherit person is realized: Student.prototype._proto_ = Person.prototype can//mode 1. (recommended)//student.prototype.__proto__ = person.prototype;//Mode 2. Create an object and make the object prototype for person.prototype//student.prototype = Object.create (person.prototype)// Student.prototype.constructor = student;//Because the prototype object is re-bound, the newly bound object must be re-assigned to the constructor//mode 3.    (with drawbacks) Student.prototype binds an instance of the person class to implement, Student.prototype._proto_ = Person.prototypeStudent.prototype = new Person (); Student.prototype.constructor = student;//for the same reason as var Zhe = new Student ("Zhe"); Console.log (Zhe instanceof Student)// Trueconsole.log (Zhe instanceof Person);//Determine if the ZHE prototype chain has Person.prototype result:trueZhe.sayName ();//mode 1. Student:zhe Way 2, 3. Zhe----------> method 2.3 The embodiment of the malpractice Zhe.saytype ();//i ' m person

Explain the drawbacks:

Student.prototype is also an object, because the object in JavaScript is a reference type, so Student.prototype is only a reference to the prototype object. Mode 1. Do not change the reference object, find the Sayname method on the Reference object. And for Mode 2, 3 changed the reference object (that is, Student.prototype bound new object), because the new object does not have Sayname method, continue to find the prototype chain until the Sayname method is found on the person.prototype.

Example 2.

function Student () {}function person () {}

var Zhe = new Student ();//equals var Zhe = object.create (student.prototype) Student.prototype = Object.create ( Person.prototype)//Make Student inherit PersonStudent.prototype.constructor = Student;console.log (Zhe instanceof person);// Falsevar zheg = new Student () Console.log (zheg instanceof person);//true

Example 3.

function Student () {}function person () {}var Zhe = new Student ();//equals var Zhe = object.create (student.prototype) zhe.__ proto__ = Object.create (person.prototype)//Make Student inherit personzhe.__proto__.constructor = Student;console.log (Zhe instanceof person),//truevar zheg = new Student (); Console.log (zheg instanceof person);//false

4. Why does any object have the ToString method? Prototype chain of Inquiry?

Example 4.

function Student () {}; Student.prototype.learn = function () {Console.log ("learn");} Student.prototype.hi = function () {Console.log ("Student say hi");} function person () {}; Person.prototype.LEGS_NUM = 2; Person.prototype.ARMS_NUM = 2; Person.prototype.walk = function () {Console.log ("Walk");}; Person.prototype.hi = function () {Console.log ("person say hi");} student.prototype.__proto__ = person.prototype;//student inherit Personvar bosn = new Student (); Bosn.hi ();//student say Hibosn.learn ();//learnbosn.walk ();//walkconsole.log (bosn.tostring ());//[object Object]//q:bosn itself has no toString method, And its prototype chain of Student.prototype, Person.prototype also have no ToString method, then where does ToString come from? A: guess: Because the object instance has the ToString method, it is known that ToString is located on Object.prototype. Then the BOSN prototype chain has Object.prototype, verify: console.log (person.prototype.__proto__ = = Object.prototype);//trueconsole.log ( object.prototype.__proto__ = = null);//true//the complete prototype chain of Bosn objects: bosn---->student.prototype----> Person.prototype---->object.prototype---->nullconsole.log (Zhe.__proto__ = = Student.prototype);//trueconsole.log (student.prototype.__proto__ = = Person.prototype);//trueconsole.log ( person.prototype.__proto__ = = Object.prototype);//trueconsole.log (object.prototype.__proto__ = = null)//true// Student.prototype---->person.prototype//semantics: Student.prototype objects point to Person.prototype objects//implementation: Student.prototype._ Proto_ = person.prototype//Meaning: Student inherits an instance of Person/student.prototype as a person

Prototype chain diagram for BOSN objects:

Example 5.

function Student () {}//student is an instance of Funciton: Student---->function.prototype: Consolt.log (Student instanceof Function),//trueconsole.log (student._proto_ = = function.prototype)//false?var Zhe = new Student ();//q: Whether there is Funciton.prototype?console.log (Zhe instanceof Function) on the Zhe's prototype chain;//falseconsole.log (Zhe instanceof Object);// True//a:zhe---->student.prototype---->object.prototype---->null. The prototype chain on the Zhe object is not function.prototype!

JavaScript prototype chain