Question

我正在寻找使用for循环来完成以下任务。

我将在数组中具有一组定义的值，一组十六进制值作为图表的默认颜色。我想使用带有2个选项的循环来获取定义数量的那些值。

如果定义的颜色集中的值数小于所请求的值数，则一旦到达最后一个值，它将从一个开始返回并继续循环。
不太重要，但可能会有所帮助的是，从获取默认值集中任何索引的值开始，并使用与＃1相同的条件，因为如果它到达colors数组中的最后一个值，它将循环回到起点并继续前进。

下面是我所拥有的代码的开头，并带有一些小的值以显示我在寻找什么。

var defaultColors = ["#90CAF9","#B39DDB","#7E57C2","#78909C","#AED581"] ;
var chartData = [12,24,30,40,15,23,35] ;

var dynamicColors = function (a) {
    var colors = [];
    for(i=0;i<a;i++){
        colors.push(defaultColors[i]);
    }
    return colors;
}

还有颜色的呼唤

backgroundColor: dynamicColors(chartData.length),

在上面的示例中，数据点比颜色值更多，因此需要循环从颜色数组的开头开始。

＃1的预期输出只是从数组的开头开始循环。

["#90CAF9","#B39DDB","#7E57C2","#78909C","#AED581","#90CAF9","#B39DDB"]

＃2的预期输出-指定起始索引。

["#7E57C2","#78909C","#AED581","#90CAF9","#B39DDB","#7E57C2","#78909C"]

Answer 1

您可以将modulo (aka remainder)运算符%与列表长度一起使用，以循环遍历列表：

var defaultColors = ["#90CAF9", "#B39DDB", "#7E57C2", "#78909C", "#AED581"];
var chartData = [12, 24, 30, 40, 15, 23, 35];

var dynamicColors = function(a) {
  var colors = [];
  for (i = 0; i < a; i++) {
    colors.push(defaultColors[i % defaultColors.length]);
  }
  return colors;
}

console.log(dynamicColors(10))

要从其他位置开始，只需将其添加到i并再次使用mod运算符即可：

var defaultColors = ["#90CAF9", "#B39DDB", "#7E57C2", "#78909C", "#AED581"];
var chartData = [12, 24, 30, 40, 15, 23, 35];

var dynamicColors = function(a, start) {
  var colors = [];
  for (i = 0; i < a; i++) {
    colors.push(defaultColors[(i + start) % defaultColors.length]);
  }
  return colors;
}

console.log(dynamicColors(7, 3)) // seven values starting at index 3

有条件的JavaScript循环

1 个答案: