Создание собственной карусели с использованием pure Javascript

Question

Я хочу создать чистую JS карусель, даже не используя классы CSS Мой реальный код работает нормально, но я чувствую, что можно сделать лучше.

let imgArray = document.querySelectorAll('.carousel-img-list img');
let displayedImgSrc = document.querySelector('.displayed-img');
let next = document.querySelector('.carousel-right');
let prev = document.querySelector('.carousel-left');

let i = 0;

count.innerHTML = i + '/' + imgArray.length;


displayedImgSrc.setAttribute('src' , imgArray[0].src);


next.addEventListener('click' , selectNextImg);
prev.addEventListener('click' , selectPrevImg);

function selectNextImg() {
    displayedImgSrc.setAttribute('src' , imgArray[(i+1)%imgArray.length].src);
    i++;
}

function selectPrevImg() {
    if ( i === 0) {
        i = 8;
        displayedImgSrc.setAttribute('src' , imgArray[(i-1)%imgArray.length].src);
        i--;
    } else {
        displayedImgSrc.setAttribute('src' , imgArray[(i-1)%imgArray.length].src);
        i--;
    }
}

Я хочу imgArray, который будет повторно создан, когда я щелкну далее по индексу [imgArray.length] и когда я щелкну предыдущий по индексу [0]

Каков наилучший метод?