Как избежать правила назначения "Присвоение свойству параметра функции 'elem'"?

Question

Я хочу понять, как вы, ребята, избегаете предупреждения eslint "Присвоение свойству параметра функции 'elem'". Я знаю, что это хороший шаблон, не меняйте значения параметров функции. Это держит наш код отделенным и с высоким обслуживанием. Однако в некоторых случаях я сталкиваюсь со следующей ситуацией. Мне нужно получить все элементы с определенным классом, а затем изменить его свойство стиля отображения. Это мой код:

const setDisplayStyleToElementsArray = (arr, display) => {
  arr.map((elem) => {
    elem.style.display = display;
    return elem;
  });
};

const elements = document.getElementsByClassName('.myClass');

const myFields = [].slice.call(elements, 0);

setDisplayStyleToElementsArray(myFields, 'block');

В этом случае я изменяю свойство "блок" всех моих элементов.myClass. Как это сделать без побочных эффектов? Как правильно это сделать? заранее спасибо

Answer 1

Я меняю собственность. Как это сделать без побочных эффектов?

Ты не можешь. Изменение этого свойства DOM является побочным эффектом. Если ваш линтер мешает вам сделать это, отключите его (по крайней мере, в этой строке).

Конечно, этого конкретного правила можно избежать, просто не используя map или функция обратного вызова. Гораздо более идиоматичным будет

function setDisplayStyles(arr, display) {
  for (const elem of arr) {
    elem.style.display = display;
  }
}

const elements = Array.from(document.getElementsByClassName('.myClass'));
setDisplayStyles(elements, 'block');

Answer 2

Во-первых, спасибо за все комментарии, спасибо. После некоторого исследования этой проблемы с моими коллегами и в Интернете я натолкнулся на лекцию Дугласа Крокфорда, в которой, среди прочего, говорилось об этом. Хотя ответ, приведенный выше, кажется простым и элегантным, он, похоже, не самый результативный ИМХО. Итак, если у кого-то есть лучшее мнение по этому поводу, пожалуйста, дайте мне знать.

В основном я решил использовать Object.keys(htmlCollection).forEach(...) вместо for Соглашаясь с мыслями Дугласа Крокфорда. Таким образом, кодовый климат не выдавал никаких предупреждений, и мой код казался более логичным и плавным.

const setDisplayStyleToElementsArray = (arr, display) => {
 Object.keys(arr).forEach(field => arr[field].classList.add('hidden'));
};

const elements = [... document.getElementsByClassName('myClass')];
setDisplayStyleToElementsArray(elements, 'none');

.myClass {
  border: 1px solid red;
}

.hidden {
  border: 1px solid blue; //could be display: none;
}

<div class="myClass">One</div>
<div class="myClass">Two</div>