Students who have knowledge of programming know that object-oriented is a very difficult concept to understand. Let me share with you the understanding of object. This article mainly shares object-oriented encapsulation. Of course, object-oriented in real life is also quite difficult, hahaha~
One, the original mode of the instance object
First of all, we know that every object is an object. For example, "dog" as an object has two attributes: "type" and "color".
Then, we need to create two instantiated objects
This is also the most basic object encapsulation, that is, putting the two attributes of "type" and "color" in one object. But here comes the problem. There are two problems with this way of writing: one is that if you want to generate a lot of instantiated objects, you need to repeat it many times, which is very troublesome; the other is that they are very similar to the prototype Dog structure, but in fact they are not directly established. contact.
Second, the original model upgrade
Duplicate code, we can write a function to solve
Then call the function to generate an instantiated object
This method can solve the complex problem of generating multiple instantiated object codes, but there is no association between dog1 and dog2, that is, it still does not reflect that they are actually instances of the prototype object Dog.
Three, the constructor
In order to solve the problem that the instantiated object needs to be generated from the prototype object, js provides the concept of a constructor. Of course, the constructor is essentially an ordinary function, but the function uses this inside. In order to distinguish it from ordinary functions, we generally capitalize the first letter of the constructor. The specific code is as follows:
With this constructor, we can generate instantiated objects, the specific code is as follows:
Here we can see the keyword new, which means that Dog is actually an object, and dog1 and dog2 are instantiated objects of Dog; in order to verify this, js provides a property constructor, which is used to point to their construction function
Of course, js also has another operator instanceof, which can verify the relationship between the prototype object and the instantiated object.
The constructor seems to be perfect here, but there is a big drawback here, that is, memory waste. For example, we now add a constant property and method to the Dog object as follows:
当然这里生成实例化方法也还是一样的，但是这里会有一个很大的问题：也就是我们会发现age属性和eat()方法明明是一模一样的内容，但是由于每次生成实例化对象时，都会生成同样的内容，多造成内存浪费。
console.log(dog1.eat == dog2.eat); // false
如果能让age和eat()在内存中只生成一次，让实例化对象指向同一个内存地址就更完美了。
四，prototype模式
js为每一个构造函数都提供了一个prototype属性，让他指向另一个对象，而这个对象的所有属性和方法都会被构造函数的实例对象继承。这也就意味着，只要我们把那些不变的属性和方法定义在prototype对象上即可。
接着再生成实例，此时，所有实例的age个eat()方法都会指向同一个内存地址，也就是prototype对象，这样也就避免了内存浪费问题，从而提供运行效率。
console.log(dog1.eat == dog2.eat); // true
当然为了验证这一问题，js定义了一些辅助属性。
1. isPrototypeOf() , 此方法用于验证prototype对象和实例化对象之间的关联
console.log(Dog.prototype.isPrototypeOf(dog1)); // true
console.log(Dog.prototype.isPrototypeOf(dog2)); // true
2. HasOwnProperty() , 每个实例化对象都有此方法，顾名思义，这个方法是用于验证属性是自有的还是继承自prototype对象的 ； 这里很显然type是自有属性，而age是继承自prototype对象。
console.log(dog1.hasOwnProperty('type')) // true
console.log(dog1.hasOwnProperty('age')) // false
This article is from Qianfeng Education , please indicate the source for reprinting