在DOM对象上设置属性时如何避免无参数重新分配

Question

function (el) {
  el.expando = {};
}

我使用AirBnB的代码样式，这使得ESLint抛出一个no-参数-resign错误：

分配到函数参数“el”时出错无参数重新分配

如何操作作为参数传递的DOM对象，同时符合AirBnB的代码风格？

有人建议使用/*eslint反应/prop-type： 0*/引用另一个问题，但如果我没有弄错的话，这适用于反应，但不适用于本机DOM操作。

我也不认为改变代码风格是一个答案。我相信使用标准样式的好处之一是在项目之间拥有一致的代码，随意更改规则感觉就像滥用了AirBnB这样的主要代码样式。

为了记录在案，我在GitHub上问了AirBnB，他们认为在第766期的这些情况下该怎么做。

Answer 1

您可以在您的. eslintrc文件中重写此规则，并为像这样的参数属性禁用它

{
    "rules": {
        "no-param-reassign": [2, { 
            "props": false
        }]
    },
    "extends": "eslint-config-airbnb"
}

此方式规则仍处于活动状态，但不会对属性发出警告。更多信息：http://eslint.org/docs/rules/no-param-reassign

Answer 2

正如本文所解释的，此规则旨在避免对参数对象进行变异。如果分配给参数，然后尝试通过参数对象访问某些参数，可能会导致意外结果。

您可以通过使用另一个变量来获取对DOM元素的引用，然后修改它来保持规则不变并保持AirBnB样式：

function (el) {
  var theElement = el;
  theElement.expando = {};
}

在JS中，对象（包括DOM节点）是通过引用传递的，所以这里el和theElement是对同一个DOM节点的引用，但是修改theElement不会改变参数对象，因为参数[0]仍然只是对该DOM元素的引用。

该规则的文档中暗示了这种方法：

此规则的正确代码示例：

/*eslint no-param-reassign: "error"*/

function foo(bar) {
    var baz = bar;
}

就我个人而言，我只会使用“no param reassign”：[“error”，{“props”：false}]处理前面提到的几个其他答案。修改参数的属性不会改变该参数所指的内容，也不会遇到此规则试图避免的问题。

Answer 3

正如@Mathletics所建议的，您可以通过将其添加到您的来完全禁用该规则。eslintrc.json文件：

"rules": {
  "no-param-reassign": 0
}

或者，您可以禁用专门用于参数属性的规则

"rules": {
  "no-param-reassign": [2, { "props": false }]
}

或者，您可以禁用该函数的规则

/* eslint-disable no-param-reassign */
function (el) {
  el.expando = {};
}
/* eslint-enable no-param-reassign */

还是只为那一行

function (el) {
  el.expando = {}; // eslint-disable-line no-param-reassign
}