Difference Call,apply,bind

Source: Internet
Author: User

First, explore the principle of call method

function (obj) {///  1, let the this in FN point to obj//  eval (this.tostring (). Replace ("This", "obj")); // 2. Let the FN method execute again // This ();}
functionfn1 () {Console.log (1); Console.log ( This);}functionfn2 () {Console.log (2); Console.log ( This);} Fn1.call (); //1,this point to WindowFn1.call (FN2);//1, the original this point Fn1,fn1.call (fn2) This point to fn2, and then let the Fn1 method to execute. Fn1.call.call ();//error, Fn1.call.call is not a function. Fn1.call.call (FN2);//2/*Set fn1.call = Test;test.call (fn2) The original this point to Test,test.call (FN2) to point this to fn2, and then let the test method execute, that is, Fn1.call's internal this () execution, that is, fn2 () Perform. */

Second, the call syntax of Call,apply,bind

function fn (NUM1, num2) {  + num2);  Console.log (this);} // Call method Fn.call (obj, +); // Apply Method fn.apply (obj, [+]); // Bind method var tempfn = Fn.bind (obj, 1, 2); Tempfn (); // or Fn.bind (obj, 1, 2) ();

1, the same point

    • Apply, call, and bind are all pointers to the This object that is used to change the function;
    • Apply, call, bind the first parameter is the object that this is to point to, that is, the context you want to specify;
    • Apply, call, bind three can use the following parameters to pass the parameter.

2, different points

    • When the call is passed a parameter to FN, it is passed by value, and apply is not a pass-through, but the value is placed in the array, passing through.
    • Call when you know the number of parameters, use apply when you are unsure of the number of parameters, then push the parameters into the array and pass them in, and inside the function you can also traverse all the parameters by arguments the array.
    • Bind is to return the corresponding function, which is convenient to call later; apply, call is called immediately.
    • Bind this method is incompatible under Ie6~8. In JavaScript, multiple bind () is invalid, because the implementation of BIND is equivalent to using a function inside a call/apply, the second bind () is equivalent to wrap the first bind (), so the second bind is not valid.

Iv. Application Scenarios
1. Verify that it is an array

function IsArray (obj) {  return Object.prototype.toString.call (obj) = = = ' [Object Array] ';}

2. Get the maximum minimum value of the array

var numbers = [5, 458, -215]; var // 458 // 458

3, array append

var arr1 = [N, "foo", {name "Camille"}, -2458]; var arr2 = ["Houyi", 555, +]; Array.prototype.push.apply (arr1, arr2);

4. Using array methods for pseudo-arrays

// define a log method that allows it to proxy the Console.log method, and the common workaround is to: function log (msg) {  console.log (msg);} Log (//MSG1//MSG1
// when the number of incoming parameters is not determined, the method above is invalid, so I think of apply. function log () {  console.log.apply (console, arguments);}; Log (//MSG1//MSG1 msg2
// If you add a "app_" prefix to the log message, it can be thought that Array.prototype.slice.call can convert the arguments pseudo-array into a standard array, and then use the array method unshift.  function  log () {  var args = Array.prototype.slice.call (arguments);  Args.unshift (' app_ ');  Console.log.apply (console, args);}; Log (//app_ MSG1

Difference Call,apply,bind

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.