在数组中按特定顺序分配颜色

Question

我想循环数组并按特定顺序为每个数组元素分配颜色。

First, fifty, ninth等应为红色颜色。

第二、第六、第十等等应为绿色颜色。

第三，第七，第十一等等应该是蓝色颜色。

第四，第八，第十二等等应该是黄色颜色。

链接到小提琴游乐场

const colors = ['red', 'green', 'blue', 'yellow'];
const arr = [1, 'a', 3, 'b', 55, 69, 71, 8, 91, 10];
let color;
arr.forEach((el, i) => {
switch (i) {
case i % 1:
color = 'red';
break;
case i % 2:
color = 'green';
break;
case i % 3:
color = 'blue';
break;
case i % 4:
color = 'yellow';
break;
default:
color = 'red';
break;
}
console.log('color:', el, i, color);
});

Answer 1

您可以这样避免切换:

const colors = ["red", "green", "blue", "yellow"];
const arr = [1, "a", 3, "b", 55, 69, 71, 8, 91, 10];
let color;
arr.forEach((el, i) => {
color = colors[i % colors.length];
console.log("color:", el, i, color);
});

i % colors.length给出颜色指数

提示:你可以给你的数组添加更多的颜色，它仍然会工作

Answer 2

您需要做一些更改。switch(i)应该是switch ((i + 1) % 4)，这样你就可以打开index + 1 mod 4的求值表达式(加上1，这样你就不会对0进行建模，这是第一个索引，这样你就可以得到可用的结果)。此外，您的案例应该是case 1:,case 2:等。请看下面:

const colors = ['red', 'green', 'blue', 'yellow'];
const arr = [1, 'a', 3, 'b', 55, 69, 71, 8, 91, 10];
let color;
arr.forEach((el, i) => {
switch ((i + 1) % 4) {
case 1:
color = 'red';
break;
case 2:
color = 'green';
break;
case 3:
color = 'blue';
break;
case 0:
color = 'yellow';
break;
default:
color = 'red';
break;
}
console.log('color:', el, i, color);
});