JavaScript中%符号的不同用法

时间:2017-08-13 21:22:52

标签: javascript function banner

所以我试图分开一个简单的滑块来学习它,但我对某些东西感到困惑,似乎无法找到答案:

var slides = document.querySelectorAll('#slides .slide');
var currentSlide = 0;
var slideInterval = setInterval(nextSlide, 2000);

function nextSlide(){
    slides[currentSlide].className = 'slide';
    currentSlide = (currentSlide+1)%slides.length;
    slides[currentSlide].className = 'slide showing';
}

这是脚本中的函数:

currentSlide = (currentSlide+1)%slides.length;

此行是%符号。我知道它可以用来查找余数甚至使用奇数和偶数但我无法弄清楚它在这里做了什么。

解释会很棒。 谢谢。

2 个答案:

答案 0 :(得分:4)

这实际上与您在其他示例中提到的运算符相同。 %运算符是模运算符,即它在执行整数除法时返回余数。

使用%查找偶数只是一个特定的(并且非常常见)示例,因为任何偶数除以2的余数为0.即even_number % 2 == 0

在这种情况下,它用于确保currentSlide不超过slides.length。对于任何除法,余数的范围介于0(精确倍数)和1小于除数之间,然后再次换行(在下一个完全倍数处)。所以当达到最后一张幻灯片时(在索引slides.length - 1处) )下一个数字将是slides.length的精确倍数,因此余数将为0,将您带回到第一张幻灯片。

答案 1 :(得分:1)

currentSlide = (currentSlide+1)%slides.length,将currentSlide增加1,但保持小于slides.length,每次currentSlide将等于slides.length增加后,由于mod(%)操作,它将再次变为0。请注意,如果没有%,您将继续增加currentSlide,一旦它变为> = slides.length,您将得到未定义。