JS Как использовать вложенную карту?

Question

Вот код, ниже часть console.log - моя проблема.

Он регистрирует все 3 класса смещения в теге так:

<tag id="id1" class="$offset1, $offset2, $offset3">

Но мне просто нужно 1 класс смещения в теге, как это:

<tag id="id1" class="$offset1">

Как мне исправить эту проблему?

Объяснение:

добавить новые классы в элемент HTML

function $addClsls(element, ...newClass) {
    return element.classList.add(...newClass);
}

удалить классы из HTML-элемента

function $rmClsls(element, ...rmClass) {
    return element.classList.remove(...rmClass);
}

выберите идентификатор элемента или класс

function $select(element) {
    return document.querySelector(element);
}

функция для добавления или удаления класса из выбранного элемента

function $switch(selectEle, eleClass, indexNum) {
    switch (indexNum) {
        case 0:
            $addClsls(selectEle, eleClass);
            break;
        case 1:
            $rmClsls(selectEle, eleClass);
            break;
        default:
    }
}

получить 3 идентификатора элемента в массив

let groupElements = [$select('#id-1'), $select('#id-2'), $select('#id-
3')];

получить 3 класса элементов в массив (не нужно помещать.)

let groupOffsets = ['offset1', 'offset2', 'offset3'];

установить начальное значение времени

let addTime = 0;

проверьте значение true для сопоставления через groupElements и groupOffsets и установите время задержки

if (true) {
    groupElements.map( i => {
      setTimeout( () => {
        $switch(i, groupOffsets.map( x => x ), 0)
        console.log(i) // <= logs out results
      }, 0 + addTime );
      addTime += 1000;
    });
}

ЦЕЛЬ - выйти из системы так:

<tag id="id-1" class="offset1"> </tag>
<tag id="id-2" class="offset2"> </tag>
<tag id="id-3" class="offset3"> </tag>

но проблема такова:

<tag id="id-1" class="offset1,offset2,offset3"></tag>
<tag id="id-2" class="offset1,offset2,offset3"></tag>
<tag id="id-3" class="offset1,offset2,offset3"></tag>

Answer 1

Ну, я исправил это. Так что я собираюсь ответить на свой вопрос.;)

Я попробовал другой способ сделать функцию карты, я использовал 2-мерный массив вместо 2 отдельных массивов

let groupItems = [ 
    [$select('#id-1'), 'offset1'],
    [$select('#id-2'), 'offset2'],
    [$select('#id-3'), 'offset3']
]
groupitems.map( items => {
            setTimeout( () => {
                // destruct first dimensional
                let [ x ] = [items];
                // destruct second dimensional
                let [ i, j ] = x;
                // first round i = $select('#id-1'); j = 'offset2';
                // second and third round so forth
                sectionSwitch( i, j, 1);
            }, 0 + addTime);
            addTime += 1000;
        })