JS Zhongyuan type and prototype chain

I. Common objects and Function objects

In JavaScript, everything is Object! But the object is also different. It is divided into ordinary objects and function objects, object, functions and so on are the function objects of JS. The following examples illustrate.

varO1 = {}; varO2 =NewObject ();varO3 =NewF1 ();functionF1 () {};varF2 =function(){};varF3 =NewFunction (' str ', ' Console.log (str) '); Console.log (typeofObject);//functionConsole.log (typeofFunction);//functionConsole.log (typeofF1);//functionConsole.log (typeofF2);//functionConsole.log (typeofF3);//functionConsole.log (typeofO1);//ObjectConsole.log (typeofO2);//ObjectConsole.log (typeofO3);//Object

In the above example O1 O2 O3 is a normal object, F1 F2 F3 is a function object. How to distinguish, in fact, very simple, all objects created by the new function () are function objects (functions), others are normal objects (object). F1,f2, in the final analysis, is created by means of new Function (). Function object is also created through the New function ()。 Two. Prototype objects

function= ' Test '; Person.prototype.age  =; Person.prototype.job  = ' software Engineer 'function() {  alert (  this. name);  }
var person = new person ();

In JavaScript, when you define an object (the function is also an object), the object contains some predefined properties. Each of these function objects has a prototype property that points to the prototype object of the function. And the prototype object is an ordinary object ( no object created by the new Function () is a normal object ), that is, the prototype object is Person.prototype, and if you are still afraid of it, think of it as a letter a:var a = Person.prototype. One thing to emphasize here is that only function objects have the prototype property, but each object has a __proto__ property (except null).

In the above we have added four attributes to a: Name, age, job, Sayname. In fact, it also has a default property: constructor. By default, all prototype objects automatically get a constructor (constructor) attribute, which is a pointer to the function (person) where the prototype property resides. That is:Person.prototype.constructor = = person. when we create the object var person = new Person (), the personcan inherit the constructor property of the prototype object Person.prototype, so person.constructor = = Person.

Person.constructor == = Person

From this perspective, we can understand Person.prototype as an instance of person. (However, the prototype object (Person.prototype) is not an instance of a constructor (person), but rather a property of the constructor, and is a predefined addition).

var New  = A;

But there is a very special prototype object: Function.prototype, it is not a normal object, but a function object, and this function object does not have a prototype property ("Each function object has a prototype property, This property points to the prototype object of the function ", which does not apply to Function.prototype.)

function Person () {}; Console.log (typeof//Objectconsole.log (typeof//  Function, this special Console.log (typeof//  Objectconsole.log (typeof//  Undefined

Why is Function.prototype a function object?

var New  = A;

As mentioned above , all objects created through the new function () are function objects, others are normal objects. Because A is a function object, Function.prototype is a function object.

three. __proto__

JS has a built-in property called __proto__ that points to the prototype object that created its constructor when creating an object, whether it is a normal object or a function object. The object person has a __proto__ property, the constructor that created it is person, the constructor's prototype object is Person.prototype, so:person.__proto__ = = Person.prototype

Person.prototype.constructor = = = =person;

Similarly, person.__proto__ = = Function.prototype;person.prototype.__proto__ = = Object.prototype;object.__proto__ = = Function.prototype; object.prototype.__proto__ = = null, according to the above understanding Object.prototype is a normal object, and the normal object constructor is an object , then object.prototype.__proto__ = = Object.prototype, thus forming a dead loop on the prototype chain cannot be terminated, so define object.prototype.__proto__ = = NULL,NULL is the top of the prototype chain.

However, it is really important to be clear that this connection exists between the instance (person) and the prototype object (Person.prototype) of the constructor (person), not between the instance (person) and the constructor (person) .

var function (){}; var function  = n= animal; var New  //undefined//  

An instance (tidy) and a prototype object (Dog.prototype) exist with a connection. This connection exists between the instance (tidy) and the prototype object (Dog.prototype) of the constructor, rather than between the instance (tidy) and the constructor (dog).

Four. Function objects

The __proto__ of all function objects is a pointer to Function.prototype, which is an empty function.

number.__proto__ = = = Function.prototype//trueNumber.constructor = = Function//trueboolean.__proto__= = = Function.prototype//trueBoolean.constructor = = Function//truestring.__proto__= = = Function.prototype//trueString.constructor = = Function//true//all constructors are from Function.prototype, even the root constructor object and the function itselfobject.__proto__ = = = Function.prototype//trueObject.constructor = = Function//true//all constructors are from Function.prototype, even the root constructor object and the function itselffunction.__proto__ = = = Function.prototype//trueFunction.constructor = = Function//truearray.__proto__= = = Function.prototype//trueArray.constructor = = Function//trueregexp.__proto__= = = Function.prototype//trueRegexp.constructor = = Function//trueerror.__proto__= = = Function.prototype//trueError.constructor = = Function//truedate.__proto__= = = Function.prototype//trueDate.constructor = = Function//true

All constructors come from Function.prototype, even the root constructor object and the function itself. All constructors inherit the properties and methods of the Function.prototype. function.__proto__ = = Function.prototype, as previously said, Function.prototype it is not an ordinary object, but a function object, then function.prototype.__proto__ = = ?, according to the above, function.prototype.__proto__ = = Function.prototype, but also appeared in the prototype chain of the dead loop, JS has always emphasized everything objects, function objects are objects, give him to recognize an ancestor, pointing to Object.prototype,object.prototype.__proto__ = = nullto ensure that the prototype chain ends normally.

In particular, Math,json are present in the form of ordinary objects.

math.__proto__ = = = Object.prototype  //  true//  true= = = Object.prototype  //  true//true

Four. Summary

Prototype and prototype chain is a model of JS implementation inheritance.

The formation of the prototype chain is really by __proto__ rather than prototype.


Reference: https://www.jianshu.com/p/dee9f8b14771

JS Zhongyuan type and prototype chain