javascript - 了解模运算符

我有一些代码遍历列表元素和颜色的集合。确保每个列表元素都指定了一种颜色。

除了模运算符，我了解所有有关此的信息。我知道它可以找到并使用剩余的数字，但是我一生无法理解它在做什么？

var li = document.getElementsByTagName('li');
var colors = ["salmon", "teal", "orange", "grey", "blue"];
var colorsCount = colors.length;

for ( var i = 0; i < li.length; i++ ) {
    li[i].style.backgroundColor = colors[ i % colorsCount  ]; // why does this work?
}

最佳答案

由于li数组中(可能)有很多项目，因此可以防止i超出colors数组的范围，因为i % colorsCount永远不能超过colorsCount。

例如，如果我们在li中有10个元素和5种颜色，则i % colorsCount将是:

i     i % colorsCount     Color
-------------------------------
0     0                   salmon
1     1                   teal
2     2                   orange
3     3                   grey
4     4                   blue
5     0                   salmon
6     1                   teal
7     2                   orange
8     3                   grey
9     4                   blue

More Information on Modulo Operations.

关于javascript - 了解模运算符，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/18729180/