I. Common Objects and Function Objects
In JavaScript, everything is an object! But the objects are also different. It is divided into ordinary objects and Function objects. Object and Function are function objects built in JS. The following is an example
var o1 = {};
var o2 =new Object();
var o3 = new f1();
function f1(){};
var f2 = function(){};
var f3 = new Function('str','console.log(str)');
console.log(typeof Object); //function
console.log(typeof Function); //function
console.log(typeof f1); //function
console.log(typeof f2); //function
console.log(typeof f3); //function
console.log(typeof o1); //object
console.log(typeof o2); //object
console.log(typeof o3); //object
In the above example, o1 o2 o3 is an ordinary object,
F1 f2 f3 is a function object.
How to distinguish, in fact, is very simple, all objects created by new Function () are function objects, and the others are ordinary objects.
F1,f2, in the final analysis, are all created through the new Function ().
Function Object is also created through New Function ().
II. Constructors
Let’s review the knowledge of constructors first:
function Person(name, age, job) {
this.name = name;
this.age = age;
this.job = job;
this.sayName = function() { alert(this.name) }
}
var person1 = new Person('Zaxlct', 28, 'Software Engineer');
var person2 = new Person('Mick', 23, 'Doctor');
In the above example, person1 and person2 are both examples of Person. Both instances have a constructor attribute, which is a pointer to Person. That is:
console.log(person1.constructor == Person); //true
console.log(person2.constructor == Person); //true
We have to remember two concepts (constructor, instance):
Person1 and person2 are both instances of the constructor Person
A formula:
The instance’s constructor property points to the constructor.
III. Prototype Objects
In JavaScript, whenever you define an object (a function is also an object), the object contains some predefined attributes. Each function object has a prototype attribute that points to the prototype object of the function.
function Person() {}
Person.prototype.name = 'Zaxlct';
Person.prototype.age = 28;
Person.prototype.job = 'Software Engineer';
Person.prototype.sayName = function() {
alert(this.name);
}
var person1 = new Person();
person1.sayName(); // 'Zaxlct'
var person2 = new Person();
person2.sayName(); // 'Zaxlct'
console.log(person1.sayName == person2.sayName); //true
We got the first “law” of this article:
1. Each object has an attribute named _ __proto__;
2. Each constructor (constructor standard starts with uppercase, such as Function (), Object (), and other constructors built in JS, as well as those created by itself) has a method named prototype (note: since it is a method, it is an object (function in JS is also an object), so prototype also has _ _ prototype _ _ attribute);
3. The _ _ prototype _ _ property of each object points to the prototype of its constructor;
4. Each object has, __proto__ attributes, but only function objects have prototype attributes.
IV. Prototype chain
V prototype chain
Prototype objects are also common objects. Almost all objects may be prototype objects or instance objects, and they may also be prototype objects and instance objects at the same time. Such an object is exactly a node of the prototype chain. Therefore, if we understand the prototype, then the prototype chain is not a very complicated concept.
We know that all functions have a method called toString. So where exactly is this method?
First declare a function at will:
function add() {}
Then we can use the following diagram to represent the prototype chain of this function.
Prototype chain
Where add is an instance of a Function object. The prototype Object of Function is also an instance of Object prototype. This forms a prototype chain. In fact, the visit of prototype chain is very similar to that of scope chain. They are all a one-way search process. Therefore, the instance object can access all the attributes and methods of the object on the prototype chain through the prototype chain. This is also why foo can finally access the toString method on the Object prototype object.
Based on the characteristics of prototype chain, we can easily implement inheritance.
After understanding the specific basic knowledge, we analyze the following figure
First
First analyze from instance add ()
Instance add () is an instance of Function
so
The _ _ prototype _ _ of add () points to the prototype of its constructor, which is Function.prototype
var add = function () {}
add.__proto__ === Function.prototype//true
Pay special attention to the __proto__ of the constructor Funciton pointing to its own Function.prototype
Function.__proto__ === Function.prototype//true
So both _ _ prototype _ _ and prototype of the constructor Function point to Function.prototype
Second
Because Function and Object are js’s own functions.
And Object was also created by new Function.
typeof Function
"function"
typeof Object
"function"
So the _ _ prototype _ _ of Object points to the prototype object of Function, namely Function.prototype
Object.__proto__ === Function.prototype
true
Therefore, both prototype of Object and _ _ prototype _ _ of Function.prototype point to Object.prototype
Third
Object.prototype is called the e end of the prototype chain because its _ _ prototype _ _ is null