eslint/docs/rules/no-extra-bind.md

   1 # Disallow unnecessary function binding (no-extra-bind)
   2
   3 The `bind()` method is used to create functions with specific `this` values and, optionally, binds arguments to specific values. When used to specify the value of `this`, it's important that the function actually uses `this` in its function body. For example:
   4
   5 ```js
   6 var boundGetName = (function getName() {
   7     return this.name;
   8 }).bind({ name: "ESLint" });
   9
  10 console.log(boundGetName());      // "ESLint"
  11 ```
  12
  13 This code is an example of a good use of `bind()` for setting the value of `this`.
  14
  15 Sometimes during the course of code maintenance, the `this` value is removed from the function body. In that case, you can end up with a call to `bind()` that doesn't accomplish anything:
  16
  17 ```js
  18 // useless bind
  19 var boundGetName = (function getName() {
  20     return "ESLint";
  21 }).bind({ name: "ESLint" });
  22
  23 console.log(boundGetName());      // "ESLint"
  24 ```
  25
  26 In this code, the reference to `this` has been removed but `bind()` is still used. In this case, the `bind()` is unnecessary overhead (and a performance hit) and can be safely removed.
  27
  28 ## Rule Details
  29
  30 This rule is aimed at avoiding the unnecessary use of `bind()` and as such will warn whenever an immediately-invoked function expression (IIFE) is using `bind()` and doesn't have an appropriate `this` value. This rule won't flag usage of `bind()` that includes function argument binding.
  31
  32 **Note:** Arrow functions can never have their `this` value set using `bind()`. This rule flags all uses of `bind()` with arrow functions as a problem
  33
  34 Examples of **incorrect** code for this rule:
  35
  36 ```js
  37 /*eslint no-extra-bind: "error"*/
  38 /*eslint-env es6*/
  39
  40 var x = function () {
  41     foo();
  42 }.bind(bar);
  43
  44 var x = (() => {
  45     foo();
  46 }).bind(bar);
  47
  48 var x = (() => {
  49     this.foo();
  50 }).bind(bar);
  51
  52 var x = function () {
  53     (function () {
  54       this.foo();
  55     }());
  56 }.bind(bar);
  57
  58 var x = function () {
  59     function foo() {
  60       this.bar();
  61     }
  62 }.bind(baz);
  63 ```
  64
  65 Examples of **correct** code for this rule:
  66
  67 ```js
  68 /*eslint no-extra-bind: "error"*/
  69
  70 var x = function () {
  71     this.foo();
  72 }.bind(bar);
  73
  74 var x = function (a) {
  75     return a + 1;
  76 }.bind(foo, bar);
  77 ```
  78
  79 ## When Not To Use It
  80
  81 If you are not concerned about unnecessary calls to `bind()`, you can safely disable this rule.
  82
  83 ## Further Reading
  84
  85 * [Function.prototype.bind](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind)
  86 * [Understanding JavaScript's Function.prototype.bind](https://www.smashingmagazine.com/2014/01/understanding-javascript-function-prototype-bind/)