javascript - ESLint prefer-arrow-callback 错误

Question

我遇到了 ESLint 的问题

这是我的功能:

$productItem.filter(function (i, el) {
        return el.getBoundingClientRect().top < evt.clientY
    }).last()
    .after($productItemFull)

这是 ESLint 告诉我的:

warning  Missing function expression name  func-names
error    Unexpected function expression    prefer-arrow-callback

如何解决这个错误？

Answer 1

基本上就是说用Arrow function filter 回调函数中的语法。

$productItem.filter((i, el) => el.getBoundingClientRect().top < evt.clientY)
    //              ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    .last()
    .after($productItemFull);

这是ESLINT documentation for prefer-arrow-callback说

Arrow functions are suited to callbacks, because:

• this keywords in arrow functions bind to the upper scope’s.

• The notation of the arrow function is shorter than function expression’s.

并且，在以下情况下会抛出错误

/*eslint prefer-arrow-callback: "error"*/

foo(function(a) { return a; });
foo(function() { return this.a; }.bind(this));

您的代码与第一个代码段相同。因此，错误 prefer-arrow-callback 由 ESLint 显示。

要解决这个错误，你可以

1. 使用 Arrow function语法(如上图)

2. 使用 options 抑制错误和命名函数

   /*eslint prefer-arrow-callback: ["error", { "allowNamedFunctions": true }]*/
   
   foo(function bar() {});