Learning notes for call and apply in Javascript, and learning notes for apply

Source: Internet
Author: User

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.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.