How to apply Javascript technical difficulties and how to connect call with this _ javascript skills

Source: Internet
Author: User
This article mainly introduces the application of Javascript technical difficulties and relevant information on the connection between call and this. If you need it, refer to 1. apply definition.

Apply: Call a function, replace the this value of the function with a specified object, and replace the parameter of the function with a specified array.

Syntax: apply ([thisObj [, argArray])

ThisObj

Optional. The object to use as this object.

ArgArray

Optional. A set of parameters to be passed to the function.

2. call Definition

Call: call an object method to replace the current object with another object.

Syntax: call ([thisObj [, arg1 [, arg2 [, [, argN])

ThisObj

Optional. Will be used as the object of the current object.

Arg1, arg2, and argN

Optional. The list of parameters that will be passed to this method.

3. Differences

The second parameter of call can be of any type, and the second parameter of apply must be an array or arguments.

Definition is also different.

4. instance analysis

(1) official instance:

function callMe(arg1, arg2){  var s = "";  s += "this value: " + this;  s += "
"; for (i in callMe.arguments) { s += "arguments: " + callMe.arguments[i]; s += "
"; } return s;}document.write("Original function:
");document.write(callMe(1, 2));document.write("
");document.write("Function called with apply:
");document.write(callMe.apply(3, [ 4, 5 ]));document.write(callMe.call(3, 4, 5 ));// Output: // Original function: // this value: [object Window] // arguments: 1 // arguments: 2 // Function called with apply: // this value: 3 // arguments: 4 // arguments: 5

The first one uses the apply: Define: Call the function, and replace the this value of the function with the specified object to call the callMe function. Use the specified object 3 to replace this in the callMe function, in this case, this is changed from [object Window] to 3. First, use the call: Definition: call the method of an object, and replace the current object with another object. Call the callMe method and use another object 3 to replace the object in callMe. From the analysis of these results, we can see that both of them use the objects in the specified object or the specified value to change this in the object. It can also be said that the object (this) in a function is "hijacked" and the object (this) in another function to be executed ). In fact, the following question is raised: What is this? Why is it so important to change its direction over and over again? Portal: javascript technical difficulties (3) this, new, apply, and call details (this is great, it is definitely enough for you to have a pot) (2) Example:

function zqz(a,b){  return alert(a+b);}function zqz_1(a,b){  zqz.apply(zqz_1,[a,b])}zqz_1(1,2)  //->3 

Analysis: by definition: Call a function and replace the this value of the function with a specified object,

Here we call the zqz function and replace this value of zqz with the specified object zqz_1.

Note that the function name in js is actually an object, because the function name is a reference to the Funtion object!

function add(a, b){ alert(a + b);}function sub(a, b){ alert(a - b);}add.call(sub, 3, 1); // 4 

Analysis: According to definition: Call the method of an object and replace the current object with another object.

Here we call the add method of the object and use the add object to replace the current object sub;

Another example:

Function zqz (a, B) {this. name = a; this. age = B; alert (this. name + "" + this. age);} function zqz_1 (a, B) {zqz. apply (this, [a, B]) // We can also write zqz. apply (this, arguments)} zqz_1 ("Nic", 12) // Nic 12

Analysis: by definition: Call a function and replace the this value of the function with a specified object,

The zqz function is called here, and the specified object this is used to replace this of zqz.

Another example:

Function Obj () {this. value = "object! ";}Var value =" global variable "; function Fun1 () {alert (this. value);} Fun1 (); // global variable Fun1.call (window); // global variable Fun1.call (document. getElementById ('mytext'); // input textFun1.call (new Obj (); // object! Fun1 (); // global variable

Analysis: Definition: Call an object method and replace the current object with another object.

Call the Fun1 object method and replace the current Fun1 object with the window object.

Call the Fun1 object method and replace the object in current Fun1 with the object in input.

Call the method of the Fun1 object and replace the object in the current Fun1 with the object in the new obj.

Finally, let's summarize:

If the function's this pointer is not changed through new (including object literal definition), call, and apply in javascript, the function's this Pointer Points to window.

Ps: Other clever usage of apply:

Do you think that since the use of "apply" and "call" is similar, why are there two methods at the same time? You can lose one. Later, I found that applying has many other advantages due to the fact that its parameters are arrays.

A) Math. max can be used to obtain the largest entry in the array:

Because the Math. max parameter does not support Math. max ([param1, param2]), which is an array, but it supports Math. max (param1, param2, param3 ...), So we can solve var max = Math. max. apply (null, array) according to the characteristics of apply, so that we can easily obtain the largest item in an array. (Apply will convert an array to a parameter and pass it to the method)

This is the first parameter given a null value during the call. This is because there is no object to call this method. You only need to use this method to help the operation and obtain the returned result, therefore, a null is passed directly.

B) Math. min can be used to obtain the smallest entry in the array:

The same idea as max is var min = Math. min. apply (null, array ).

C) Array. prototype. push can merge two Arrays:

Similarly, the push method does not provide an array of push, but it provides push (param1, param ,... ParamN) so you can also use apply to convert the array, that is:

var arr1=new Array("1","2","3");var arr2=new Array("4","5","6");Array.prototype.push.apply(arr1,arr2); 

It can also be understood that arr1 calls the push method, and the parameter is a set that replaces the number assembly with the parameter list through apply.

D) Summary: Under what circumstances can I use special usage such as Math. min:

Generally, the target function only needs n parameter lists, instead of receiving an array ([param1 [, param2 [,... [, ParamN]). You can use the apply method to cleverly solve this problem.

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.