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() 與箭頭函數一起使用的情況為問題

此規則的錯誤程式碼範例

在 Playground 中開啟

/*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

此規則的正確程式碼範例

在 Playground 中開啟

/*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

Understanding JavaScript Bind () — Smashing Magazine
www.smashingmagazine.com

資源

編輯此頁面