This is the 5th day of my participation in the August More Text Challenge

preface

Yesterday’s constructor trivia can be solved with the prototype pattern by looking at the factory functions and constructors directly into the code.

    let Person = function () {};
    Person.prototype.name = "jackson";
    Person.prototype.age = 22;
    Person.prototype.sayName = function () {
        console.log(this.name);
    };
    let person1 = new Person();
    person1.sayName(); // "jackson"
    let person2 = new Person();
    person2.sayName(); // "jackson"
    console.log(person1.sayName == person2.sayName); // true
Copy the code

All of the attributes and the sayName() method are added directly to the Person prototype property, as well as to the constructor. We can see that after this definition, the new object created by the constructor still has the corresponding properties and methods. The properties and methods defined using this prototype pattern are shared by all instances. To understand this, we must first understand the prototype.

To understand the prototype

In javascript, whenever a function is created, a special property called prototype is created for that function. By default, all prototype objects automatically get a property called constructor. For example, in front of the Person. The prototype. The constructor is pointing to the Person. Constructors can also add other properties and methods to the prototype object.

    / / prototype
    function Person(){}
    console.log(Person.prototype);//
    console.log(typeof Person.prototype); //Object
Copy the code

The constructor has a prototype property that refers to its prototype object, and the prototype object has a constructor property that refers to the constructor. In other words, the two reference in a loop: let’s print them

console.log(Person.prototype.constructor === Person); //true
Copy the code

Note: the constructor, the prototype object, and the instance are three completely different objects

Let’s draw a picture. It’s a little ugly

Person. The prototype to the prototype object, and the Person. The prototype. Its constructor refers back to the Person the constructor. The prototype object contains the Constructor attribute and other attributes added later. Person1 and person2, two instances of Person, each have only one internal attribute that refers back to Person.prototype, and neither has a direct connection to the constructor. Also note that person1.sayname () is called normally, although neither instance has properties or methods. This is due to the object attribute lookup mechanism.

Prototype chain

When an attribute is accessed through an object, the search begins by the name of the attribute and returns the value of the attribute if it has one, or if it doesn’t, it looks for its prototype object and returns the value of that name.

The prototype pattern solves the problem of member sharing, as long as properties and methods added to the prototype constructor are shared.

If you have a license and you want to drive, but you don’t have a car, you can drive your father’s car. If you had a car, you could just drive it instead of driving your dad’s.