当在数组和迭代器上迭代变得大于长度时(在图形渲染循环中)，如何返回开始

Question

我正在尝试制作一个动画记录器，将x，y位置记录到数组中，并允许调用动画。我特别考虑将p5.js作为图形库，但任何一个都应该有效。因为这只是数组工作。

在p5.js中，为了返回Sin((或Cos((的值，你可以给它们传递一个角度，这个角度可以一直递增，因为2PI==4PI(根据旋转的方向(等等。我想复制这种函数，但要返回存储在数组中的数据。

例如，你有一个像下面这样的数组

let demo = ['297', '298', '299', '300']

因为数组有4个项，所以很容易在数组上循环一次，但我想写一个函数，如果我们输入4，它会返回索引0，"297"，或者如果我们输入11，它会返"300"，或者我们输入22，它会回"299">

通过这种方式，函数可以不断地输入一个不断增加的值，该值向上移动每一帧，我们可以在循环中返回数组的值。

let survey = 0;
let demo = ['297', '298', '299', '300']
//a rendering loop
function draw(){
survey ++
let xPos = getPosition(survey) //this getPosition function is the one in question
ellipse(xPos,100,50)
}

我觉得这是一些模数学，但我不能完全把它排序。谢谢你看！

Answer 1

问题的解决方案是模(%(运算符。此运算符将返回除法的剩余部分。

例如11 % 4 = 3

const positions = [297, 298, 299, 300];
function getPosition(positions, i) {
return positions[i % positions.length];
}
console.log(getPosition(positions, 4));  // 297
console.log(getPosition(positions, 11)); // 300
console.log(getPosition(positions, 22)); // 299