通过将参数绑定到值来创建新函数

bind方法从另一个函数创建一个新函数，其中一个或多个参数绑定到特定值，包括隐式this参数。

局部应用

这是部分应用的示例。通常，我们提供一个函数及其所有参数，这些参数会产生一个值。这就是所谓的函数应用程序。我们正在将函数应用于其参数。

高阶函数（HOF）

部分应用程序是高阶函数（HOF）的一个例子，因为它生成了一个新函数，但参数数量较少。

绑定多个参数

可以使用bind将具有多个参数的函数转换为新函数。

函数乘法（x，y）{返回x*y；}让multiplyBy10=multiply.bind（null，10）；控制台日志（multiplyBy10（5））；

从实例方法转换为静态函数

在最常见的用例中，当使用一个参数调用时，bind方法将创建一个新函数，该函数将此值绑定到特定值。实际上，这将实例方法转换为静态方法。

函数乘数（因子）｛this.factor=系数；}Multiplier.prototype.multiply=函数（x）｛返回this.factor*x；}函数ApplyFunction（func，value）{返回func（值）；}var mul=新乘数（5）；//生成垃圾（NaN），因为将“undefined”乘以10console.log（ApplyFunction（多个，10））；//产生预期结果：50console.log（ApplyFunction（多乘绑定（多），10））；

实现有状态回调

以下示例显示了如何使用this的绑定使对象方法充当回调，从而可以轻松更新对象的状态。

函数ButtonPressedLogger（）{此计数=0；this.onPressed=函数（）{这个.计数++；console.log（“按下按钮”+this.count+“次数”）；}for（let d of document.getElementsByTagName（“button”））d.onclick=this.onPressed.bind（this）；}new ButtonPressedLogger（）；<button>按我</button><button>不按我</button>

如上所述，Function.bind（）允许您指定函数将在其中执行的上下文（也就是说，它允许您传递this关键字将解析到函数体中的对象）。

执行类似服务的两个类似工具包API方法：

jQuery.proxy（）

Dojo.hhitch（）

bind是一个在java脚本原型中可用的函数，因为名称建议bind用于将您的函数调用绑定到上下文，无论您正在处理什么，例如：

var rateOfInterest='4%'；var轴库={利率：“10%”，getRateOfInterest:函数（）{return this.rateOfInterest；}}axisBank.getRateOfInterest（）//“10%”让我们知道AxisBankInterest=axsBank.getRateOfInterest//当您想将函数调用分配给变量时，我们使用此语法knowAxisBankInterest（）；//默认情况下，您将在此处获得“4%”的输出，该函数称为wrt全局上下文let knowExactAxisBankInterest=knowAxisBankInterest.bind（axisBank）//因此这里我们需要将函数调用绑定到其本地上下文knowExactAxisBankInterest（）//“10%”

以下是最简单的解释：

说你有一个功能

function _loop(n) { console.log("so: " + n) }

显然，您可以像往常一样将其称为loop（69）。

重写如下：

var _loop = function() { console.log("so: " + this.n) }

注意现在有

无此类参数使用“this”获取命名参数

现在可以这样调用函数：

 _loop.bind( {"n": 420} )

就是这样。

最典型的用例：

真正典型的用法是需要向回调中添加参数。

回调不能有参数。

因此，只需如上所述“重写”回调。

Bind创建一个新函数，该函数将强制函数内部的this作为传递给Bind（）的参数。

下面是一个示例，展示了如何使用bind传递具有正确this的成员方法：

var myButton = {
  content: 'OK',
  click() {
    console.log(this.content + ' clicked');
  }
};

myButton.click();

var looseClick = myButton.click;
looseClick(); // not bound, 'this' is not myButton - it is the globalThis

var boundClick = myButton.click.bind(myButton);
boundClick(); // bound, 'this' is myButton

打印结果：

OK clicked
undefined clicked
OK clicked

您还可以在第一个（this）参数之后添加额外的参数，bind将把这些值传递给原始函数。稍后传递给绑定函数的任何其他参数将在绑定参数之后传递：

// Example showing binding some parameters
var sum = function(a, b) {
  return a + b;
};

var add5 = sum.bind(null, 5);
console.log(add5(10));

打印结果：

15

查看JavaScript函数绑定以获取更多信息和交互式示例。

更新：ECMAScript 2015增加了对=>函数的支持。=>函数更紧凑，不会从其定义范围更改this指针，因此您可能不需要经常使用bind（）。例如，如果您希望第一个示例中Button上的一个函数将单击回调连接到DOM事件，以下都是实现这一点的有效方法：

var myButton = {
  ... // As above
  hookEvent(element) {
    // Use bind() to ensure 'this' is the 'this' inside click()
    element.addEventListener('click', this.click.bind(this));
  }
};

Or:

var myButton = {
  ... // As above
  hookEvent(element) {
    // Use a new variable for 'this' since 'this' inside the function
    // will not be the 'this' inside hookEvent()
    var me = this;
    element.addEventListener('click', function() { me.click() });
  }
};    

Or:

var myButton = {
  ... // As above
  hookEvent(element) {
    // => functions do not change 'this', so you can use it directly
    element.addEventListener('click', () => this.click());
  }
};

简单解释：

bind（）创建一个新函数，即它返回给您的函数的新引用。

在该关键字后面的parameter中，传递要预配置的参数。实际上，它不会立即执行，只是准备执行。

您可以根据需要预配置任意多个参数。

理解绑定的简单示例：

function calculate(operation) {
  if (operation === 'ADD') {
   alert('The Operation is Addition');
  } else if (operation === 'SUBTRACT') {
   alert('The Operation is Subtraction');
  }
}

addBtn.addEventListener('click', calculate.bind(this, 'ADD'));
subtractBtn.addEventListener('click', calculate.bind(this, 'SUBTRACT'));