JS prototype prototype chain value and reference type

1 Review

1.1 Object type

1. establish Object Object of type
   ① Direct quantity {}
   ② Object Constructor
   ③ Object function
   
2. Read / write object properties
   .
   []
   Must use[]There are two cases of syntax:① The attribute name does not conform to the identity name specification ② Use variables to represent attribute names
   
3. Traverse all properties in the object
   for (var i in object) {
   		object[i];
   }
   
4. Delete attributes from objects
   delete object.Attribute name;
   
5. Determine whether an attribute always exists in an object
   "Attribute name" in object;

1.2 constructor

1. Concept of constructor
   Constructor is the function used to create the object
   Constructors are equivalent to data types, and object constructors of the same data type are the same
   
2. Relationship between constructor and object
   A constructor is an abstraction (description) of an object, and an object is an instance of a constructor
   A constructor can correspond to multiple objects, and an object can only have one constructor
   

3. Custom constructor
   function User(name，age) {
   		this.name = name;
   		this.age = age;
   }

1.3 this

1. Use in constructor this
   this The value of is an instance of the constructor
   
   
2. Use in method this
   Who calls the method, this To whom

2 prototype

2.1 concept of prototype

• Any object has a prototype. The prototype is also an object.
• Objects can inherit properties (Methods) on prototypes.

2.2 how to get the prototype of an object

① Implicit prototyping

object.__proto__

② Display prototype mode

Object Constructors .prototype

Note: two objects with the same constructor have the same prototype.

2.3 relationship among object, constructor and prototype

① Objects and constructors

• A constructor is an abstraction (description) of an object, and an object is an instance of a constructor.
• A constructor can create multiple objects, but an object can only have one constructor.

② Objects and prototypes

• Every object has a prototype.
• Objects can use properties (Methods) on prototypes.

③ Constructors and prototypes

• The constructor can obtain the prototype of the instance of the constructor through the attribute prototype.
• Objects with the same constructor have the same prototype.

2.4 application of prototype in custom constructor

// Custom constructor
function User(name, age, address) {
    // Set the properties of the object
    this.name = name;
    this.age = age;
    this.address = address;
}

// Set the method on the object to the prototype of the object
User.prototype.getInfo = function() {
    console.log('My name is'+this.name+'，My age'+this.age+',I live in'+this.address);
};

User.prototype.addShopcart = function() {
    console.log(this.name + 'Added items to shopping cart');
}

2.5 judge whether the attribute belongs to the object itself

object.hasOwnProperty('Attribute name')；   

Rules:

1. hasOwnProperty() judges that only properties on the object itself return true, and properties on the prototype and nonexistent return false.
2. in operator, the attributes on the object itself and the prototype return true, and only non-existent attributes return false

2.6 specifying prototypes while creating objects

// Setting a method on the prototype of an object does not change the prototype of the object
 object.__proto__.add = function() {   };

// Modified the direction of the prototype of the object
 object.__proto__ = New object;


// Add methods to the prototype of the constructor instance without changing the direction of the prototype
 Constructor.prototype.add = function() {   }

// Modify the direction of the prototype of the constructor instance
 Constructor.prototype = New object;

// Specify the prototype while creating the object
Object.create(object);

// Create an object without a prototype
Object.create(null);

3 prototype chain

3.1 concept of prototype chain

Every object has a prototype. The prototype is still an object, so the prototype also has a prototype. Until an object without a prototype (top-level prototype), it forms a prototype chain.

3.2 attribute search process

When using an attribute in an object:

1. First, search from the object itself. If it is returned directly by this attribute, search from the prototype if there is no such attribute.
2. If the attribute is specified on the prototype, return directly; If the prototype does not have this attribute, continue to search from the prototype of the prototype.
3. Until the top-level prototype object is found, it will stop where it is found. Finally, the top-level prototype object has no properties and returns undefined

3.3 constructor and prototype chain

1. The prototype of array, number, character and custom constructor are all instances of Object.
2. The prototype object at the top level is object prototype
3. The constructor attribute on the prototype object does not point to its own constructor, but to the constructor of the object based on the prototype object.

[the external chain image transfer fails, and the source station may have anti-theft chain mechanism. It is recommended to save the image and upload it directly (img-CpjKU9B5-1620368822547)(C:\Users \ Wang Xiu \ appdata \ roaming \ typora user images \ image-20210408112809428. PNG)]

4 value type and reference type

4.1 concept of value type and reference type

Primitive types, also known as value types, can also be called immutable types.

Object types, also known as reference types, can also be called variable types.

4.2 storage method of value type and reference type

1. Variables and original type data are stored in the stack structure of the content, and object type data is stored in the heap structure of the content.
2. If the value of the variable is the original type, the variable and value are in the stack structure; If the value of the variable is the object type, the object exists in the heap structure, and the address of the variable and object is stored in the stack structure.
3. If variable a is assigned to variable b, if the value of variable a is the original type, the value is directly assigned to b. If the value of variable a is an object type, give the address to b, so that a and b point to an object.
4. The assignment method of the original type becomes value transfer; The assignment method of object type is called reference passing.

4.3 immutable and variable

Immutable type: data of original type cannot be modified. Data of an original type must be taken as a whole.

Variable type: data of object type. You can modify part of the data (modify attributes and elements).

[the external chain image transfer fails. The source station may have anti-theft chain mechanism. It is recommended to save the image and upload it directly (img-gjkOnq3i-1620368822550)(C:\Users \ Wang Xiu \ appdata \ roaming \ typora user images \ image-20210408112946408. PNG)]

summary

1. prototype
   What is a prototype
   How to get a prototype
   Relationship between object, prototype and constructor
   
2. Prototype chain
   
3. Reference type and value

To change a part of data, an original type of data must be taken as a whole.

Variable type: data of object type. You can modify part of the data (modify attributes and elements).

[external chain picture transferring... (img-gjkOnq3i-1620368822550)]