A summary of JS function invocation Patterns _js Object-oriented

Method Invocation Pattern
When a function is saved as an attribute of an object, we call it a method of the object, so this is bound to the object.

Copy Code code as follows:

var myobject={
Name: "MyObject",
value:0,
Increment:function (num) {
This.value + = typeof (num) = = ' number '? num:0;
} ,
Tostring:function () {
Return ' [Object: ' +this.name+ ' {value: ' +this.value+ '}] ';
}
}
alert (myObject);//[object:myobject {value:0}]

function Call pattern
When a function is not a function of an object, it is called as a function, this is bound to the global object. This is a mistake in language design. If the language is designed correctly, this should still be bound to the this variable of the external function when the internal function is called. Such as:

Copy Code code as follows:

var myobject={
Name: "MyObject",
value:0,
Increment:function (num) {
This.value + = typeof (num) = = ' number '? num:0;
} ,
Tostring:function () {
Return ' [Object: ' +this.name+ ' {value: ' +this.value+ '}] ';
},
Getinfo:function () {
Return (function () {
return this.tostring ()///Inside anonymous function This points to global object window
})();
}
}
Alert (Myobject.getinfo ());//[object window]

When luckily, there is an easy solution: Define a variable and assign it to this, so the internal function accesses this variable to the object, such as:

Copy Code code as follows:

var myobject={
Name: "MyObject",
value:0,
Increment:function (num) {
This.value + = typeof (num) = = ' number '? num:0;
} ,
Tostring:function () {
Return ' [Object: ' +this.name+ ' {value: ' +this.value+ '}] ';
},
Getinfo:function () {
var self=this;
Return (function () {
return self.tostring ()//to point to MyObject object by variable self
})();
}
}
Alert (Myobject.getinfo ());//[object:myobject {value:0}]

Constructor Call pattern
JavaScript is a language based on prototype inheritance. This means that an object can inherit properties directly from other objects. The language is of no class.
If a function is called with new on the front, a new object is created that hides the prototype member connected to the function, and this will be bound to an instance of the constructor.

Copy Code code as follows:

function MyObject (name) {
This.name=name | | ' MyObject ';
this.value=0;
This.increment=function (num) {
This.value + = typeof (num) = = ' number '? num:0;
};
This.tostring=function () {
Return ' [Object: ' +this.name+ ' {value: ' +this.value+ '}] ';
}
This.target=this;
}
Myobject.prototype.getinfo=function () {
return this.tostring ();
}
/*
Create a Myobject.prototype object at the same time, MyObject inherits all of Myobject.prototype's attributes,
This is bound to an instance of MyObject
*/
var myobject=new myObject ();
var otherobject=new MyObject ();
alert (myobject.target===myobject);//ture
Alert (MyObject.target.getInfo ());//[object:myobject {value:0}]
Myobject.increment (10);
Otherobject.increment (20);
alert (myobject.value);//10
alert (otherobject.value);//20

Apply Call Mode
JavaScript is a function-oriented object-oriented programming language, so functions can have methods.
function, as if the object owns this method, so that the object has this method. This point points to the object.
Apply receives two parameters, the first is the object to bind (this is the object), and the second is the parameter array.

Copy Code code as follows:

function MyObject (name) {
This.name=name | | ' MyObject ';
this.value=0;
This.increment=function (num) {
This.value + = typeof (num) = = ' number '? num:0;
};
This.tostring=function () {
Return ' [Object: ' +this.name+ ' {value: ' +this.value+ '}] ';
}
This.target=this;
}
function GetInfo () {
return this.tostring ();
}
var myobj=new MyObject ();
Alert (getinfo.apply (myobj));//[object:myobject {value:0}],this to point to MyObj
Alert (getinfo.apply (window));//[object window],this point to Window