Four invocation patterns of functions

Four invocation patterns of functions
1. Function mode
Characteristics
is a simple function call with no boot content in front of the function name
This meaning
This represents the global object in function mode, which is the Windjow object in the browser
2. Method mode
Characteristics
The method must be dependent on an object, assigning the function to a property of the object, then it becomes the method
This meaning
This represents the attached object in a method pattern invocation.
3. Constructor invocation mode
The difference between this and the method pattern
Because the constructor knowledge adds a member to this, there is no other thing to do, and the method can do this, and for this, there is no essential difference between the constructor and the method.
Characteristics
Use the New keyword to guide the constructor
The difference of this
The This in the constructor is the same as in the method, which represents the object, when the object in the constructor is the object that was just created
return keyword
Additional notes about the return keyword in the constructor
Return is not required in the constructor, it will be the default return this;
If the value is not written after a manual add return, it is equivalent to return this;
If you manually add the return base type, it is not valid, or the original return this is returned this;
If you add the return null or return undefined manually; Invalid
If you add the return object type manually, the original created this will be discarded, returning the object after return
Creating a schema for an object
1. Factory method
The factory is used for production, so if the function creates the object and returns it, it is called the factory function
function Createperson (name, age, gender) {
var o = {};
O.name = name;
O.age = age;
O.gender = gender;
return o;
}
Document.createelement ()
2. Construction method
function person (name, age, gender) {
THIS.name = name;
This.age = age;
This.gender = gender;
}

var p = new Person ("Zhangsan", 19, "male");
3. Parasitic object creation
function person (name, age, gender) {
var o = {};
O.name = name;
O.age = age;
O.gender = gender;
return o;
}

var p = new Person ("Jack", "male");
4. Mixed-type creation
Hybrid inheritance is to put all the attributes in the constructor, and then put all the methods in the prototype, using the construction method and the prototype to create the object together
4. Context Invocation Mode
Concept
Meaning of context invocation
That is, customize, set the meaning of this
The concept of context
Context, which is the environment in which a function call is located
Conditions of production
In the other three invocation modes, when the function/method is called, the value of this is specified, and we have no way to set it ourselves, if we try to assign a value to this, an error will be given.
Syntax for context invocation
1. Apply
Name of the function. Apply (object, [parameter]);
Apply can have only two parameters, the first parameter is the object inside the function this substitution, and the second is the parameter of the function name--passed as a pseudo-array or an array
2. Call
Function name. Call (object, parameter, parameter, parameter);
The functions of the two methods are identical, but differ when passing parameters.
Function description
1, the function name in the syntax is the function itself, when using the function call pattern, this is the global object by default
2, the syntax of the function name can also be a method (such as Obj.method), when using the method mode, this default refers to the current object
3. When using apply and call, the default this will be invalidated, the value of this has the decision of the first parameter of apply and
Additional Information
1, if the function or method does not have this operation, then no matter what the call is actually the same
2, if the function calls Foo (), then a bit like foo.apply (window);
3, if the method call O.method (), then a bit like o.method.apply (O);
Parameter issues
Call and apply are exactly the same in the case where no arguments are followed (the function has no arguments, the method has no arguments).
Rules for using the first parameter
1, if the admixture is an object, then it is equivalent to set the function of this is the parameter
2, if not the input parameters, or pass in null, undefined, etc., then the equivalent of this default window
3. If the basic type is passed in, this is a reference to the wrapper type corresponding to the base type
Rules for using the second parameter
When using context invocation, the original function (method) may have parameters, then this parameter is represented in the context call using the second (nth) parameter.
Apply method
Features: Apply can expand pseudo-arrays
The method has only two parameters, the first parameter is the same as call, however, the second parameter of the method is a pseudo-array, or the original function may have parameters that are wrapped in a group to pass
Call method
The first parameter is no different from apply, when it is possible to have multiple arguments---the number of arguments that the original function can accept
5. Application of context Invocation
The context call can only modify this, but the most used place is the function borrowing
1. Convert pseudo-array to array
A) Cancat method
Traditional practices
var a = {};
a[0] = ' a ';
a[1] = ' B ';
A.length = 2;

Use the array to bring the method concat
If an array in the parameter expands the array of arguments
Syntax: Arr.concat (1, 2, 3, [4, [5]]);
Features: Do not modify the original array
var arr = [];
var newArr = Arr.concat (a);
However, the Apply method has an attribute that can use an array or a pseudo-array as an argument. (IE8 does not support array operations) foo.apply (obj, pseudo-array);//IE8 not supported
Since a is a pseudo-array, it just looks like an array, so the above code cannot succeed and cannot use the Cancat method
Using the Apply method, you can write the following code
Use pseudo-array A as the second parameter of apply
var newArr = Array.prototype.cancat.apply ([], a);
The process of array conversion is actually the removal of an element one at a time to form a new array, in which the method involved in the operation is theoretically possible.
b) Push method
Examples Show
Usage:
Arr.push (1); Adds this element to the array and returns the number of elements added
Arr.push (1, 2, 3); Add these three elements to the array in turn, returning the added number

var a = {length:0}; Pseudo-Array
a[a.length++] = ' abc '; a[0] = ' abc '; a.length++;
a[a.length++] = ' def ';

Using an empty array, place the elements in an array
var arr = [];
Arr.push (a); Instead of expanding the element, the pseudo-array is added to the array as an element
Use apply again to expand the characteristics of a pseudo-array
Arr.push.apply (arr, a);
Use apply to expand the properties of the pseudo-array, which is equivalent to Arr.push (A[0], a[1])
2. Find the maximum value in the array
A), in JS, the Math object provides a lot of mathematical functions Math.max (a)
b) or use apply to expand the properties of the array
var arr = [12, 23, 34, 45, 45, 56, 67];
Math.max.apply (null, arr);
3. Borrowing constructor inheritance
Example
function person (name, age, gender) {
THIS.name = name;
This.age = age;
This.gender = gender;
}

You need to provide a Student constructor to create a student object
Students should also have name, age, gender, and also need to have course courses
function Student (name, age, gender, course) {
Person.call (this, name, age, gender);
This.course = course;
}
1. Function mode
Characteristics
is a simple function call with no boot content in front of the function name
This meaning
This represents the global object in function mode, which is the Windjow object in the browser
2. Method mode
Characteristics
The method must be dependent on an object, assigning the function to a property of the object, then it becomes the method
This meaning
This represents the attached object in a method pattern invocation.
3. Constructor invocation mode
The difference between this and the method pattern
Because the constructor knowledge adds a member to this, there is no other thing to do, and the method can do this, and for this, there is no essential difference between the constructor and the method.
Characteristics
Use the New keyword to guide the constructor
The difference of this
The This in the constructor is the same as in the method, which represents the object, when the object in the constructor is the object that was just created
return keyword
Additional notes about the return keyword in the constructor
Return is not required in the constructor, it will be the default return this;
If the value is not written after a manual add return, it is equivalent to return this;
If you manually add the return base type, it is not valid, or the original return this is returned this;
If you add the return null or return undefined manually; Invalid
If you add the return object type manually, the original created this will be discarded, returning the object after return
Creating a schema for an object
1. Factory method
The factory is used for production, so if the function creates the object and returns it, it is called the factory function
function Createperson (name, age, gender) {
var o = {};
O.name = name;
O.age = age;
O.gender = gender;
return o;
}
Document.createelement ()
2. Construction method
function person (name, age, gender) {
THIS.name = name;
This.age = age;
This.gender = gender;
}

var p = new Person ("Zhangsan", 19, "male");
3. Parasitic object creation
function person (name, age, gender) {
var o = {};
O.name = name;
O.age = age;
O.gender = gender;
return o;
}

var p = new Person ("Jack", "male");
4. Mixed-type creation
Hybrid inheritance is to put all the attributes in the constructor, and then put all the methods in the prototype, using the construction method and the prototype to create the object together
4. Context Invocation Mode
Concept
Meaning of context invocation
That is, customize, set the meaning of this
The concept of context
Context, which is the environment in which a function call is located
Conditions of production
In the other three invocation modes, when the function/method is called, the value of this is specified, and we have no way to set it ourselves, if we try to assign a value to this, an error will be given.
Syntax for context invocation
1. Apply
Name of the function. Apply (object, [parameter]);
Apply can have only two parameters, the first parameter is the object inside the function this substitution, and the second is the parameter of the function name--passed as a pseudo-array or an array
2. Call
Function name. Call (object, parameter, parameter, parameter);
The functions of the two methods are identical, but differ when passing parameters.
Function description
1, the function name in the syntax is the function itself, when using the function call pattern, this is the global object by default
2, the syntax of the function name can also be a method (such as Obj.method), when using the method mode, this default refers to the current object
3. When using apply and call, the default this will be invalidated, the value of this has the decision of the first parameter of apply and
Additional Information
1, if the function or method does not have this operation, then no matter what the call is actually the same
2, if the function calls Foo (), then a bit like foo.apply (window);
3, if the method call O.method (), then a bit like o.method.apply (O);
Parameter issues
Call and apply are exactly the same in the case where no arguments are followed (the function has no arguments, the method has no arguments).
Rules for using the first parameter
1, if the admixture is an object, then it is equivalent to set the function of this is the parameter
2, if not the input parameters, or pass in null, undefined, etc., then the equivalent of this default window
3. If the basic type is passed in, this is a reference to the wrapper type corresponding to the base type
Rules for using the second parameter
When using context invocation, the original function (method) may have parameters, then this parameter is represented in the context call using the second (nth) parameter.
Apply method
Features: Apply can expand pseudo-arrays
The method has only two parameters, the first parameter is the same as call, however, the second parameter of the method is a pseudo-array, or the original function may have parameters that are wrapped in a group to pass
Call method
The first parameter is no different from apply, when it is possible to have multiple arguments---the number of arguments that the original function can accept
5. Application of context Invocation
The context call can only modify this, but the most used place is the function borrowing
1. Convert pseudo-array to array
A) Cancat method
Traditional practices
var a = {};
a[0] = ' a ';
a[1] = ' B ';
A.length = 2;

Use the array to bring the method concat
If an array in the parameter expands the array of arguments
Syntax: Arr.concat (1, 2, 3, [4, [5]]);
Features: Do not modify the original array
var arr = [];
var newArr = Arr.concat (a);
However, the Apply method has an attribute that can use an array or a pseudo-array as an argument. (IE8 does not support array operations) foo.apply (obj, pseudo-array);//IE8 not supported
Since a is a pseudo-array, it just looks like an array, so the above code cannot succeed and cannot use the Cancat method
Using the Apply method, you can write the following code
Use pseudo-array A as the second parameter of apply
var newArr = Array.prototype.cancat.apply ([], a);
The process of array conversion is actually the removal of an element one at a time to form a new array, in which the method involved in the operation is theoretically possible.
b) Push method
Examples Show
Usage:
Arr.push (1); Adds this element to the array and returns the number of elements added
Arr.push (1, 2, 3); Add these three elements to the array in turn, returning the added number

var a = {length:0}; Pseudo-Array
a[a.length++] = ' abc '; a[0] = ' abc '; a.length++;
a[a.length++] = ' def ';

Using an empty array, place the elements in an array
var arr = [];
Arr.push (a); Instead of expanding the element, the pseudo-array is added to the array as an element
Use apply again to expand the characteristics of a pseudo-array
Arr.push.apply (arr, a);
Use apply to expand the properties of the pseudo-array, which is equivalent to Arr.push (A[0], a[1])
2. Find the maximum value in the array
A), in JS, the Math object provides a lot of mathematical functions Math.max (a)
b) or use apply to expand the properties of the array
var arr = [12, 23, 34, 45, 45, 56, 67];
Math.max.apply (null, arr);
3. Borrowing constructor inheritance
Example
function person (name, age, gender) {
THIS.name = name;
This.age = age;
This.gender = gender;
}

You need to provide a Student constructor to create a student object
Students should also have name, age, gender, and also need to have course courses
function Student (name, age, gender, course) {
Person.call (this, name, age, gender);
This.course = course;
}

Four invocation patterns of functions