In JavaScript, there are 4 ways to call:
(1) Basic function call
(2) method invocation
(3) Constructor call
(4) calls via call () and apply ()
1. Basic function calls
Normal function call patterns, such as:
JavaScript Code?
1234 |
function fn(o){ …… } fn({x:1}); |
In the basic function call,
(1) Each parameter is passed to the formal parameter defined when the function is declared as an argument;
(2) This is bound to a global variable (direct invocation generally refers to window)
JavaScript Code?
12345678910 |
var
object = {value:1};
var
value = 2;
object.printProps =
function
(){
var
printValue =
function
(){
console.log(
this
.value);
};
printValue();
console.log(
this
.value);
}
object.printProps();
|
The result of this operation is:
2
1
When the Printvalue () function executes, the This.value value is 2, which means that this refers to the global object, not the object.
(3) Return value: The return value of the function becomes the value of the invocation expression.
I. If the function returns to the end of the interpreter, that is, there is no statement executed to return XXX. The return value is undefined.
II. If the function returns because the receiver executes to the return XXX statement, returns the value after the return.
III. If there is no value after the return statement, which is return, returns undefined.
2. Method invocation
When a function is saved as a property of an object, it is called a method.
(1) The processing of parameters and return values is consistent with the function invocation;
(2) Call context this is the object
JavaScript Code?
1234567891011 |
function
print(){
console.log(
this
.value);
}
var
value=1;
var
object = {value:2};
object.m = print;
//作为函数调用
print();
//作为方法调用
object.m();
|
The result of the operation is:
1
2
When print is called, this binds to the global object, which prints the global variable value 1.
However, when OBJECT.M () is called, this binds the object that the method m belongs to, so the printed value is Object.value, which is 2.
3. Constructor invocation
A function or method call is preceded by the keyword new, which constitutes a constructor call. Such as:
JavaScript Code?
12 |
function fn(){……} var obj = new fn(); |
(1) Parameter processing: general case the constructor parameter processing and the function call pattern are consistent. However, if the constructor does not have formal parameters, the JavaScript constructor call syntax allows you to omit the argument list and parentheses.
For example, the following two lines of code are equivalent.
JavaScript Code?
12 |
var obj = new Object(); var obj = new Object; |
(2) The calling context of the function is the newly created object.
JavaScript Code?
12345678910 |
function fn(value){
this
.value =value;
}
var
value =1;
var
obj =
new
fn(2);
console.log(value);
console.log(obj.value);
fn(3);
console.log(value);
console.log(obj.value);
|
Operation Result:
1
2
3
2
I. The first call to the FN () function is called as a constructor, at which point the call context this is bound to the newly created object, obj. So the global variable value does not change, and obj adds a property value of 2;
II. The second call to the FN () function is called as a normal function, at which point the call is bound to the global object, and the window is in the browser. So the value of the global object is changed to 3, and the property value of obj is unchanged.
(3) The constructor usually does not use the return keyword, and the return value is the new object. The invocation expression value is the object, if the constructor displays the return statement with the returned object. If the constructor uses a return statement but does not specify a return value or returns a raw value, the return value is ignored and the new object is used as the result of the call.
4. Calls via call () and apply ()
Although in a separate function call, depending on whether it is strict mode, this point points to undefined or window, however, we can still control the point of this! To specify which object this function is pointing to, you can use the Apply () or call () methods of the function itself, all of which receive two parameters.
The call () method uses its own argument list as the argument for the function, and the Apply () method requires that the parameter be passed in as an array
The first parameter of the Apply method is the changed call object, the second parameter is to pass in the function argument as an array [], and call () the first parameter is the same as the calling () method, the second parameter is the original parameter sequence ....
JavaScript function calls the various methods!!