Deep understanding of the JavaScript series (42): Design Patterns in the prototype model of the detailed knowledge of the basics

Introduced

A prototype pattern (prototype) is a prototype instance that points to the kind of object being created and creates a new object by copying the prototypes.

Body

In the case of prototyping, we can use JavaScript-specific prototypes to create objects by using an object that is created as a prototype property value for another object. The prototype object itself is an effective use of the object created by each constructor, for example, if the prototype of a constructor contains a name attribute (see the following example), the object created through this constructor will have this attribute.

Looking at the definition of a prototype pattern in the existing literature, there is no JavaScript-specific, and 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 classes (class). We simply copy from an existing object to create the object.

Real prototype inheritance is presented as the newest version of the ECMASCRIPT5 standard, Use the Object.create method to create an object that creates a specified object whose object's prototype has the specified object (that is, the first parameter object that the method passes in), or it can contain other optional specified properties. For example Object.create (prototype, optionaldescriptorobjects), this usage can also be seen in the following example:

Copy Code code as follows:

Because it is not a constructor, you do not need to capitalize
var Somecar = {
Drive:function () {},
Name: ' Mazda 3 '
};

Use Object.create to create a new car X
var anothercar = object.create (Somecar);
Anothercar.name = ' Toyota Camry ';

Object.create run you inherit directly from other objects, using the second parameter of the method, you can initialize additional attributes. For example:

Copy Code code as follows:

var vehicle = {
Getmodel:function () {
Console.log (' Vehicle mould 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 object literals in the second argument of Object.create to pass in the extra attributes to initialize, with the syntax of the Object.defineproperties or Object.defineproperty method type. It allows you to set attributes such as enumerable, writable, or configurable.

If you want to implement the prototype model yourself, instead of using object.create directly. You can use code such as the following to implement the above example:

Copy Code code as follows:

var Vehicleprototype = {
Init:function (Carmodel) {
This.model = Carmodel;
},
Getmodel:function () {
Console.log (' Vehicle mould 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

Prototype mode in the use of JavaScript is almost everywhere, many other models are also based on prototype, there is no more to say, here we should note that the problem is still shallow copy and deep copy, so as to avoid the problem of reference.