no-extra-bind

禁止对 .bind() 的不必要调用

🔧

此规则报告的一些问题可以通过 --fix 命令行选项自动修复。

bind() 方法用于创建具有特定 this 值的函数，并且可以选择将参数绑定到特定值。当用于指定 this 的值时，重要的是函数在其函数体中实际使用 this。例如

var boundGetName = (function getName() {
    return this.name;
}).bind({ name: "ESLint" });

console.log(boundGetName());      // "ESLint"
1
2
3
4
5

此代码是良好使用 bind() 设置 this 值的示例。

有时在代码维护过程中，this 值会从函数体中移除。在这种情况下，您最终可能会调用 bind() 但它没有任何作用

// useless bind
var boundGetName = (function getName() {
    return "ESLint";
}).bind({ name: "ESLint" });

console.log(boundGetName());      // "ESLint"
1
2
3
4
5
6

在此代码中，对 this 的引用已被移除，但仍然使用了 bind()。在这种情况下，bind() 是不必要的开销（以及性能损失），可以安全地移除。

规则详情

此规则旨在避免不必要地使用 bind()，因此只要立即调用的函数表达式 (IIFE) 使用 bind() 并且没有相应的 this 值，就会发出警告。此规则不会标记包含函数参数绑定的 bind() 用法。

注意：箭头函数永远无法使用 bind() 设置其 this 值。此规则将所有使用 bind() 的箭头函数标记为问题

此规则的错误代码示例

在游乐场中打开

/*eslint no-extra-bind: "error"*/

var x = function () {
    foo();
}.bind(bar);

var x = (() => {
    foo();
}).bind(bar);

var x = (() => {
    this.foo();
}).bind(bar);

var x = function () {
    (function () {
      this.foo();
    }());
}.bind(bar);

var x = function () {
    function foo() {
      this.bar();
    }
}.bind(baz);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

此规则的正确代码示例

在游乐场中打开

/*eslint no-extra-bind: "error"*/

var x = function () {
    this.foo();
}.bind(bar);

var x = function (a) {
    return a + 1;
}.bind(foo, bar);
1
2
3
4
5
6
7
8
9

何时不使用它

如果您不关心对 bind() 的不必要调用，则可以安全地禁用此规则。

版本

此规则是在 ESLint v0.8.0 中引入的。

进一步阅读

Function.prototype.bind() - JavaScript | MDN
developer.mozilla.org

理解 JavaScript Bind () — Smashing Magazine
www.smashingmagazine.com

资源

编辑此页面