JavaScript Zhongyuan and prototype chains

Prototype [prototype]:

An object that provides shared properties for other objects.

Each function has a prototype (prototype) attribute, which is a pointer to an object that contains some properties and methods shared by a particular instance.

In the case of convincing:

This example shows that the prototype object is shared and is a pointer, and an instance of the object also has a pointer to the object that prototype points to.

functionAnimal (name) { This. Name = Name | | Animal;} Animal.prototype.runs=function() {Console.log ( This. Name + ', run up \ n ')}varDog =NewAnimal (' Puppy ') dog.runs ()//output "Puppy's running."//can the dog object be used with the added method below? Animal.prototype.hi =function() {console.log (' Hi '))}dog.hi ()//output "Hi", stating that the prototype property is a pointer to a shared object that can be called regardless of whether the method is added first or later//Dog as a animal instance, his __proto__ attribute and Animal.prototype point to the same object, so the prototype method can be used. Console.dir (dog)//View dog.__proto__//dog.__proto__ & Animal.prototypeConsole.log (dog.__proto__ = = = Animal.prototype)//true, with the same pointer address

prototype object for native constructors [Not only functions have prototype objects]

Console.dir (Object.prototype)

Console.dir (Array.prototype)

Console.dir (String.prototype)

Console.dir (Date.prototype)

See an example of __proto__ & prototype

var obj = {}obj.tostring ()   //  "[Object Object]"//obj Object Why has the ToString method? Because the Obj object is an instance of the object constructor, the prototype pointer to the Obj object points to the Object.prototype object. Console.log (obj.__proto__  = = = Object.prototype)

understood through the prototype diagram:

Look again at an example of a function's prototype

var obj = {name: ' Jack '}function  getName () {    Console.log (this). Name)}//  question: Where does the Animal.call method come from? getname.call (obj)  // from Function object console.dir (getName) Console.log (getname._ _proto__  = = = Function.prototype)  //trueconsole.log (function.prototype.__ proto__  = = = Object.prototype)  //true

Understanding through prototype diagrams

Prototype Inheritance:

functionAnimal () { This. Name = ' Animal '}animal.prototype.runs=function() {Console.log ( This. Name + ', run up \ n ')    return  This}functionBird () { This. Name = ' Bird '}bird.prototype=NewAnimal () Bird.prototype.fly=function() {Console.log ( This. Name + ', fly away \ n ')    return  This}functionCrow (name) { This. Name = Name | | Crow}crow.prototype=NewBird () Crow.prototype.drink=function() {Console.log ( This. Name + ', full of water \ n ')    return  This}varCrow =NewCrow (' A cute little crow ')) Crow.drink (). runs (). Fly () Console.dir (Crow)

Output Result:

Prototype Summary:

Each constructor has a prototype object corresponding to it.

The prototype property of the constructor and the "__proto__" property of its instance object point to the same object.

All instance objects of a constructor, sharing a copy of the prototype object.

All objects can be connected to the Object.prototype object through the "__proto__" property.

The constructor uses prototype to define the properties and methods of the prototype, and the instance object uses "__proto__" to find the properties and methods of the prototype.

When a property or method of an object is found, the JS engine traverses its prototype chain up until it finds a property of the given name. If this property or method is still not found in the Object.prototype object, the undefined value is returned.

JavaScript Zhongyuan and prototype chains