About the bind () example in function _javascript tips

Objective

Bind () accepts an infinite number of arguments, the first argument is the this point of the new function that it generates, such as I pass a window, no matter where it is invoked, this new function is pointing to window, and the new function's argument is bind() the second, third, fourth .... The nth parameter plus its original argument. (All right, I'm all covered in circles)

Example Introduction

We still have to look at chestnuts better understanding, for the bind() most basic use:

This.x = 9; 
var module = {
 x:81,
 getx:function () {return this.x;}
};

Module.getx (); Back to Bayi

var retrievex = module.getx;
Retrievex (); Returns 9, in which case, "this" points to the global scope

//Creates a new function, binds "This" to the Module object
//Novice may be confused by the Global x variable and the attribute X in module
var Boundgetx = Retrievex.bind (module);
Boundgetx (); Return 81

It's obvious here that we're going to drop the window object with Retrievex, and the result is definitely x under window, where we module bind the object, and the retrieveX problem is this solved, no matter where it is invoked, it this points module to Object.

There are bind() other parameters, I believe that the first contact bind() with the friend to see the above definition will be covered with a circle.

Or raise a chestnut:

Function List () {return
 Array.prototype.slice.call (arguments);
}

var list1 = list (1, 2, 3); [1, 2, 3]

//Create a function with preset initial parameters
var leadingthirtysevenlist = List.bind (Undefined,[69,37],{a:2});

var list2 = Leadingthirtysevenlist (); [[69,37],{a:2}]
var list3 = leadingthirtysevenlist (1, 2, 3);//[[69,37],{a:2}, 1, 2, 3]

The list function is very simple, inserting each parameter into an array, we use the bind() function to list set the initial value, because we do not need to change list this the point, so the direct transmission undefined , starting from the second argument, is to pass list the value of the function, list2and list3 The return value is a good illustration of everything.

The scene I used to use bind() is a matching setTimeout function, because when I do this, I setTimeout will default to the this window object, which bind() I did before I used it:

 function coder (name) {
  var = this;
  That.name = name;
  That.getname = function () {
   console.log (that.name)
  };
  That.delaygetname = function () {
   settimeout (that.getname,1000)
  };
 }
 var me = new Coder (' Jins ')
 me.delaygetname ()//delay one second output jins

A pointer to that cache is defined at the top of the function this so that no matter how it is invoked, it points to an that instance of coder, but it is always uncomfortable to define a variable more than one.

bind()the use is much simpler:

 function coder (name) {
  this.name = name;
  This.getname = function () {
   console.log (this.name)
  };
  This.delaygetname = function () {
   settimeout (This.getName.bind (this), 1000)
  };
 var me = new Coder (' Jins ')
 me.delaygetname ()//delay one second output jins

This is OK, directly to setTimeout the this binding to the outer layer this , which is certainly what we want!

Finally attach the reference address:

Function.prototype.bind ()

Summarize

The above is the entire content of this article, I hope the content of this article for everyone's study or work can bring some help, if there is doubt you can message exchange, thank you for the cloud Habitat Community support.