JS Object-oriented, a variety of ways to create objects!

To start creating an object:

1. Object literal.

var clock={
Hour:12,
Minute:10,
Second:10,
Showtime:function () {
Alert (this.hour+ ":" +this.minute+ ":" +this.second);
}
}
Clock.showtime ();//Call

2. Creating an Object instance

var clock = new Object ();
clock.hour=12;
clock.minute=10;
Clock.showhour=function () {alert (clock.hour);};

Clock.showhour ();//Call

This shows that properties can be dynamically added, modified

Object creation Mode:

1. Factory mode : is a function, then put parameters, return objects, pipeline work

function Createclock (hour,minute,second) {
var clock = new Object ();
Clock.hour=hour;
Clock.minute=minute;
Clock.second=second;
Clock.showhour=function () {
Alert (this.hour+ ":" +this.minute+ ":" +this.second);
};
return clock;
};
var newclock = Createclock (12,12,12);//instantiation
Newclock.showhour ();//Call

Pros: Finally the concept of Merit abstraction. But it doesn't recognize the type of Object!

2. Constructor mode

function Clock (hour,minute,second) {
This.hour = hour;
This.minute = minute;
This.second = second;
This.showtime = function () {
Alert (this.hour+ ":" +this.minute+ ":" +this.second);
}
}
var newclock =new Clock (12,12,12);
alert (Newclock.hour);

Note: This new keyword is a must, if not added, clock will not be called as a constructor, but just a normal function. At the same time, the property is added unexpectedly to his external scope, window, because the this inside the constructor is mapped to an external scope. So for security reasons, you can create

function Clock (hour,minute,second) {
if (this instanceof clock) {
This.hour = hour;
This.minute = minute;
This.second = second;
This.showtime = function () {
Alert (this.hour+ ":" +this.minute+ ":" +this.second);
}
}
else{
throw new Error ("Add ' new ' to make a instance");
}
}

Disadvantages of the constructor: Because the this pointer changes to the new instance when the object instance is changed. The method of the new instance is also re-created, if n instances are going to rebuild the same method n times. So let's uncover the prototype pattern.

3. Prototype mode

function Clock (hour,minute,second) {
}
clock.prototype.hour=12;
clock.prototype.minute=12;
clock.prototype.second=12;
Clock.prototype.showtime=function () {
Alert (this.hour+ ":" +this.minute+ ":" +this.second);
}
var newclock = new Clock ();
Newclock.showtime ();

Deep understanding of prototype models is important,

First, each function has a prototype (prototype) attribute, which points to the Clock.prototype object. And this prototype object has a property constructor, which, by default, points to clock, which is readable and writable. And when we instantiate an object, the instance Newclock in addition to the properties and methods that have the constructor definition (note, just in the constructor), and a pointer to the constructor's prototype, ECMAScript called [[prototype]], When instantiating an object in this way, the method of the prototype object is not in a specific instance, because the prototype is not instantiated. (There's a lot of nonsense, not misleading you.) Don't faint)

So this pattern defines the object, when invoking the method of the process: Call Newclock.showtime (); see if there are any instances, there are tuning, no trace to the prototype, there is a tune, no error, the call failed.

Of course you can write this:

function Clock (hour,minute,second) {
}
clock.prototype={
Constructor:clock,//You must set this property manually, or it will break the link to the constructor function. There is no instance sharing the meaning of the prototype.
Hour:12,
Minute:12,
Second:12,
Showtime:function () {
Alert (this.hour+ ":" +this.minute+ ":" +this.second)
}
}
var newclock = new Clock ();
Newclock.showtime ();

Note: The connection of the instance to the constructor prototype is also linked by pointers, so the method of modifying the prototype can be added dynamically.

This purely prototype pattern problem is also obvious, all attributes, methods are shared, not to let the object materialized. Often we want each object to have its own properties. So, combining the first two, creating a new pattern

4. Construction-prototype combination mode.

function Clock (hour,minute,second) {
This.hour = hour;
This.minute = minute;
This.second = second;
}

Clock.prototype.showtime=function () {Alert (this.hour+ ":" +this.minute+ ":" +this.second);}
var newclock = new Clock (12,12,12);
Newclock.showtime ();

Here we put the attribute in the constructor, more of the object's specificity.

JS Object-oriented, a variety of ways to create objects!