introduce
Prototype refers to the type of objects that are created with prototype instances and create new objects by copying these prototypes.
text
For prototype mode, we can use JavaScript's unique prototype inheritance feature to create objects, that is, one object is created as the prototype attribute value of another object. The prototype object itself effectively utilizes the objects created by each constructor. For example, if a constructor prototype contains a name attribute (see the example below), the objects created through this constructor will have this attribute.
Looking at the definition of prototype patterns in existing literature, there is no JavaScript. You may find that many of the explanations are about classes, but the reality is that JavaScript based on prototype inheritance completely avoids the concept of class. We simply copy the existing object to create the object.
The real prototype inheritance is proposed as the latest version of the ECMAScript5 standard. The Object.create method is used to create such an object. This method creates a specified object. The prototype of its object has a specified object (that is, the first parameter object passed into by the method), and can also contain other optional specified attributes. For example, Object.create(prototype, optionalDescriptorObjects), you can also see this usage in the following example:
The code copy is as follows:
// Because it is not a constructor, it does not need to be capitalized
var someCar = {
drive: function () { },
name: 'Mazda 3'
};
// Create a new car with Object.create x
var anotherCar = Object.create(someCar);
anotherCar.name = 'Toyota Kami';
Object.create runs you inherit directly from other objects. Using the second parameter of this method, you can initialize additional properties. For example:
The code copy is as follows:
var vehicle = {
getModel: function () {
console.log('The mold of the vehicle is:' + this.model);
}
};
var car = Object.create(vehicle, {
'id': {
value: MY_GLOBAL.nextId(),
enumerable: true // Default writable:false, configurable:false
},
'model': {
value: 'Ford',
enumerable: true
}
});
Here, you can use the object literal to pass in the second parameter of Object.create to use the object literal to enter the additional properties to be initialized, and its syntax is the same as the Object.defineProperties or Object.defineProperty method types. It allows you to set properties of properties such as enumerable, writable or configurable.
If you want to implement the prototype mode yourself, instead of using Object.create directly. You can use code like the following to implement the above example:
The code copy is as follows:
var vehiclePrototype = {
init: function (carModel) {
this.model = carModel;
},
getModel: function () {
console.log('vehicle mold is:' + this.model);
}
};
function vehicle(model) {
function F() { };
F.prototype = vehiclePrototype;
var f = new F();
f.init(model);
return f;
}
var car = vehicle('Ford Escort');
car.getModel();
Summarize
The use of prototype mode in JavaScript is simply ubiquitous. Many other modes are also based on prototype, so I won’t say much. What you should pay attention to here is the problem of shallow copy and deep copy to avoid citation issues.