Question

在这里，我从教程中获得了一些全屏图像滑块的代码，我理解了将滑块重置为功能的一部分旁边的所有代码！这让我感到困惑

current===sliderImages.length -1

然后

current = -1;

代码在这里

let sliderImages = document.querySelectorAll(".slide"),
    arrowLeft = document.querySelector("#arrow-left"),
    arrowRight = document.querySelector("#arrow-right"),
    current = 0;

// Clear all images
function reset() {
    for (let i = 0; i < sliderImages.length; i++) {
        sliderImages[i].style.display = "none";
    }
}

// Init slider
function startSlide() {
    reset();
    sliderImages[0].style.display = "block";
}

// Show prev
function slideLeft() {
    reset();
    sliderImages[current - 1].style.display = "block";
    current--;
}
// Left arrow click
arrowLeft.addEventListener("click", function () {
    if (current === 0) {
        current = sliderImages.length;
    }
    slideLeft();
});

// Show next
function slideRight() {
    reset();
    sliderImages[current + 1].style.display = "block";
    current++;
}

                        THIS FUNCTION I DONT UNDERSTAND HOW IT WORKS
// Right arrow click    !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
arrowRight.addEventListener("click", function () {
  !!!!  if (current === sliderImages.length - 1) {  
        current = -1;!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
    }
    slideRight();
});

startSlide();

Answer 1

if语句检查current是否为最后一个元素。如果代码在此条件之后仍然运行，则当前电流将等于length的{{1}}，并且电流将等于sliderImages，因为数组的最后一个元素的 index始终等于的长度。数组减1

undefined

如果到达最后一张图像，则将if (current === sliderImages.length - 1)更改为current。现在，您可能会问为什么将其设置为-1。数组索引从-1开始。这是因为0中的slideRight()将被添加到1中，因此它将变为current，即数组的第一个元素

Answer 2

在上面的代码中

var current = 0;
if slider image length 0 > then it's sliding arrow works. !

无法确定此功能的工作原理

2 个答案: