Зачем для l oop циклически проходить массив, длина которого равна 1?

Question

В следующей программе вызывается одна из двух функций - функции либо добавляют (w3AddClass), либо удаляют (w3RemoveClass) элементы div в зависимости от того, соответствует ли значение c атрибуту класса в любом данном элементе div. В обеих функциях есть для l oop. Мой вопрос о for для l oop - в обеих функциях for l oop проходит через массив (arr2), длина которого равна 1 (т.е. "show"). Разве это не должно вместо этого l oop через более длинный массив (arr1)?

filterSelection("cars")

function filterSelection(c) {
  var x, i;
  x = document.getElementsByClassName("filterDiv");

  if (c == "all") c = " ";

  for (i = 0; i < x.length; i++) {
    w3RemoveClass(x[i], "show");

    if (x[i].className.indexOf(c) > -1)
      w3AddClass(x[i], "show");
  }
}

function w3AddClass(element, ** name ** ) {
  var i, arr1, arr2;

  arr1 = element.className.split(" "); **
  arr2 = name.split(" "); **

  for (i = 0; i < ** arr2.length ** ; i++) {

    if (arr1.indexOf(arr2[i]) == -1) {
      element.className = element.className + " " + arr2[i];
    }
  }
}

function w3RemoveClass(element, name) {
  //etc...
}

<div id="myBtnContainer">
  <button class="btn active" onclick="filterSelection('all')"> Show all</button>
  <button class="btn" onclick="filterSelection('cars')"> Show all</button>
  <button class="btn" onclick="filterSelection('animals')"> Animals</button>
  <button class="btn" onclick="filterSelection('fruits')"> Fruits</button>
  <button class="btn" onclick="filterSelection('colors')"> Colors</button>
</div>

<div class="container">
  <div class="filterDiv cars">BMW</div>
  <div class="filterDiv colors fruits">Orange</div>
  <div class="filterDiv cars">Volvo</div>
  <div class="filterDiv colors">Red</div>
  <div class="filterDiv cars animals">Mustang</div>
  <div class="filterDiv colors">Blue</div>
  <div class="filterDiv animals">Cat</div>
</div>

Answer 1

Разве не следует вместо этого l oop через более длинный массив (arr1)?

Нет, это не так. arr1 просто необходим для проверки, задал ли элемент класс.

Например, второй параметр w3AddClass может быть строкой, разделенной пробелом. w3AddClass(e, "a b c") добавит a, b и c класс к элементу.