1. Constructor
Facing the characteristics of object programming, such as encapsulation and inheritance, can be realized with the help of constructors, but there will be a waste of memory
<script> // Constructor function names usually start with uppercase letters // Instance object pointed to by this function Person(x, y) { this.uname = x, this.age = y, this.sing = function() { console.log('I can sing'); } } // obj is an instance object, which obtains all the logic encapsulated in the constructor const obj = new Person('Zhang San', 20) console.log(obj); //Person {uname: 'Zhang San', age: 20, sing: ƒ} const obj2 = new Person('Li Si', 25) console.log(obj.sing === obj2.sing) //false instance objects are independent of each other and do not affect each other </script>
2. prototype
Each constructor has a prototype attribute that points to another object, which is also called a prototype object. This object can mount functions. We can directly define those Invariant Methods on the prototype object, so that all object instances can share these methods
<script> function Person(x, y) { this.uname = x, this.age = y } // Writing public methods to prototype objects saves memory Person.prototype.sing = function() { console.log('I can sing'); } const obj = new Person('Zhang San', 20) const obj2 = new Person('Li Si', 25) obj.sing() obj2.sing() console.log(obj.sing === obj2.sing) //true indicates that the function of sing is the same and shared </script>
3. constructor property
Each prototype object has a constructor attribute, which points to the constructor of the prototype object;
If there are methods of multiple objects, we can assign values to the prototype object in the form of objects, but this will overwrite the original content of the constructor prototype object, so that the constructor property of the modified prototype object will no longer point to the current constructor. At this time, we can add a constructor to the modified prototype object to point to the original constructor
<script> function Person() { } Person.prototype = { // constructor: Person, sing: function () { console.log('I can sing') } } console.log(Person.prototype.constructor === Person) //false function Person() { } Person.prototype = { // After adding the pointing, the output result is true constructor: Person, sing: function () { console.log('I can sing') } } console.log(Person.prototype.constructor === Person) //true </script>
4. Object prototype__ proto__
1. Every object has an attribute__ proto__ The prototype object that points to the constructor. The reason why our object can use the properties and methods of the constructor prototype is that the object has__ proto__ Existence of prototype
2,__ proto__ There is also a constructor attribute in the object prototype, which points to the constructor that creates the instance object
5. Prototype inheritance
<script> // Attributes and methods of human public function Person() { this.eyes = 2, this.head = 1 } // man function Man() { } // Replace the original fixed object with new Person() Man.prototype = new Person() // Let the constructor point back to the original constructor Man.prototype.constructor = Man // Get the instance object of the constructor Man() const obj = new Man() // Adding the smoking method to Man's prototype Man.prototype.smoking = function(){ console.log('smoking') } console.log(obj) //The smoking function is added to the man's print result // woman function Woman() { } // Replace the original fixed object with new Person() Woman.prototype = new Person() Woman.prototype.constructor = Woman const obj2 = new Woman() console.log(obj2) //There is no smoking function in women's print results console.log(Man.prototype === Woman.prototype) //false </script>
6. Prototype chain
Based on the inheritance of prototype objects, the prototype objects of different constructors are associated together, and the relationship of this association is a chain deconstruction. We turn the chain structure relationship of prototype objects into prototype chain
Prototype chain lookup rules:
1. When accessing the properties (including methods) of an object, first find out whether the object itself has the property;
2. If not, find its prototype (that is, the prototype object pointed to by _proto _)
3. If not, find the prototype of the prototype Object (the prototype Object of the Object)
4. And so on until the Object is found (null)
5,__ proto__ The significance of object prototype is to provide a direction, or a line, for the object member search mechanism