Learning notes for call and apply in Javascript, and learning notes for apply
First, let's look at the call explanation in MDN.
The call () method calls a function or method when a specified this value and several specified parameter values are used.
Note: The function of this method is similar to that of the apply () method. The only difference is that the call () method accepts a list of several parameters, while the apply () method () the method accepts an array containing multiple parameters.
Syntax
fun.call(thisArg[, arg1[, arg2[, ...]]])
Parameters
ThisArg
This value specified when the fun function is running. It should be noted that the specified this value is not necessarily the true this value during function execution. If this function is in non-strict mode, the value of this specified as null and undefined automatically points to the Global Object (window object in the browser), and the value is the original value (number, String, Boolean value) this will point to the automatic packaging object of the original value.
Arg1, arg2 ,...
The list of specified parameters.
The example on MDN is not very easy to understand at the beginning. I will post it here. If you are interested, go and check the call-Javascript.
Here thisArg is interpreted as the this value specified during fun runtime. That is to say, after call is used, this in fun points to thisArg? View code
var p="456"; function f1(){ this.p="123"; } function f2() { console.log(this.p); } f2(); //456 f2.call(f1()); //123 f2.apply(f1()); //123
The first output is the global variable to be called. After call and apply are used, this in f2 points to f1. Therefore, the output is 123, in fact, f1 uses the f2 method to output its own p
In this case, this. p in f1 () is deleted and three 456 values are output. this confirms that when this is null or undefined, it actually points to the global variable.
As for the packaging object that points to the original value, because I understand that the packaging object is temporary, and only the type of the original value is output during testing, how can I prove it to anyone who knows it? I 'd like to discuss it with you. Thank you!
Since call can implement one object to borrow another object, can it implement inheritance? View code
function f1(){ this.father="father" } function f2() { f1.call(this); this.child="child"; } var test=new f2(); console.log(test.father); //father
There is no father in test, because
F1.call (this );
Here this points to f2, that is, f2 uses the f1 method to implement inheritance.
Let's talk about the parameters here. The parameters here are passed to fun. Check the code.
function f1(){ this.p="123"; } function f2(x) { console.log(this.p); console.log(x); } f2.call(f1(),456); //123 //456
Output 123 First is because p in f1, and the second 456 is the parameter passed to f2, which is easy to understand.
Pay attention to the differences between parameters in call and apply.
Call is input one by one, while apply is an input array.
Function f1 () {this. p = "test call";} function f2 (x, y, z) {console. log (this. p); console. log (x); console. log (y); console. log (z);} function f3 () {this. p = "test apply";} f2.call (f1 (), 6); f2.call (f1 (), [, 6]); f2.apply (f3 (), [4,5, 6]); f2.apply (f3 (), 4,5, 6 );
The result is displayed here.
The first test call is correct.
The second part of the test call is passed into an array, so an array is output first and then two undefined
The third test applies correct output
In section 4, an error is reported directly due to a parameter format error.
The difference here should be obvious.
Javascript call apply is not understood
Call and apply can be called using variables as function names. For example, the callback function of a function. The specific usage is: executed function. call (a, B, c ...), a is the object that this needs to be specified in the executed function. It can be null. Other parameters are used as parameters of the executed function. The usage of apply is similar, but the second parameter is an array.
Example:
Function doPost (url, param, callback ){
// Process post requests here
Var str = xhr. responseText;
Callback. apply (this, [str]); // It is equivalent to calling callback (str); and setting this in callback as a doPost object
}
Javascript: Are Object and Function implemented by the apply and call methods?
The apply and call methods only have Function objects and Object objects.
For example:
Funtion (){
}
A has the apply and call methods.
Var aa = new a (); aa does not have the apply and call methods, but aa has the contructor attribute. The value of constructor is function.