Javascript:跳过数组中每 4 个项目

Javascript: Skipping every 4th item in array?

本文关键字：项目 数组 Javascript      更新时间：2023-09-26

>我有一个充满像素颜色值的数组，按顺序排序(R， G， B， A， R， G， B， A...等(我正在尝试通过它们来更改 R、G 和 B 的值，但我想让 A 一个人呆着。专门跳过数组的第 4 个(或第 n 个(值的最佳方法是什么？

我想做什么：

  • 对于每一帧，将第一个 R 值(数组中的第 1 项(增加 1。
    • 在
  • R 值中从 0 到 255。
  • 当 R = 255 时，将其重置为 0 并将 G 值(数组中的第 2 项(增加 1。
  • R 继续循环，从 0 到 255，每次增加 G，直到：
  • 当 G = 255 时，将其重置为 0 并将 B 值(第 3 项(增加 1。
  • 同样的事情，G循环每次增加B一个。
  • 当 B = 255 时，将其重置为 0 并跳过 A 值(第 4 项！(，而是增加下一个 R 值，即第 5 项。然后无限期地继续这个广告，直到数组的末尾。

我正在做的项目是P5.js但我认为这个问题更特定于Javascript。

谢谢大家！

ETA：既然人们问我在这里用的是什么，你去：

var m = 0;
var array = [0];
function draw() {
  var last = array[array.length-1];
  loadPixels();
  pixels[array[last]] += 1;
  updatePixels();
  if (pixels[array[last]] == 255) {
    loadPixels();
    pixels[array[last]] = 0;
    updatePixels();
    m += 1;
    array.push(m);
  }
}

这似乎工作得很好，我可以观察像素在颜色之间循环，但随后它们很快就会变成白色(可能是因为 if 语句在循环遍历 A 值后将 A 值重置为零。虽然我仍然希望它保持所有像素移动(有点像我在列表中描述的方式(，而不仅仅是做一个然后移动到下一个。

我

最初没有包括这个，因为我对Javascript仍然非常陌生，并且意识到到目前为止我的工作可能是如此深奥，以至于我担心大多数人都无法对它进行正面或反面。但如果可以的话，我想那就更好了。

您可以使用模算术非常简洁地执行此操作：

var myPixels = [255, 255, 255, 0.5, 255, 189, 22, 0.3];
function updatePixels(pixels) {
    var shouldContinue = true,
        i = 0;
    for ( ; i < pixels.length && shouldContinue; i += 1) {
        // Skip every 4th index
        if (i % 4 !== 3) {
            pixels[i] = (pixels[i] + 1) % 256;
            // keep going as long as the current RGB value has just been reset to 0
            shouldContinue = (pixels[i] === 0);
        }
    }
}
// EXAMPLE USAGE    
console.log(myPixels);
updatePixels(myPixels);
console.log(myPixels);
updatePixels(myPixels);
console.log(myPixels);

运行时，这将生成输出：

[255, 255, 255, 0.5, 0, 189, 22, 0.3]
[0, 0, 0, 0.5, 0, 190, 22, 0.3]
[1, 0, 0, 0.5, 0, 190, 22, 0.3]

专门跳过数组的第 4 个(或第 n 个(值的最佳方法是什么？

这个想法是创建一个以i作为索引的for循环，并检查i % 4 != 3是否为真。下面的代码将跳过数组的第 4n 项，其中 n 是一个正整数。

var arr = ['R', 'G', 'B', 'A', 'R', 'G', 'B', 'A', 'R', 'G', 'B', 'A', 'R', 'G', 
           'B', 'A', 'R', 'G', 'B', 'A','R'];
for (i = 0; i < arr.length; i++) {
    if (i % 4 != 3) {
        alert(arr[i]); // will display only R, G, and B
        // do your thing here for R, G, and B
    }
}

字符串元素仅供参考。您可以使用数字数组更改arr并使用相同的for循环。

工作演示：http://jsfiddle.net/o7epn1cb/

使用关键字 continue 跳过迭代：

for(var i = 0; i < ary.length; i++) {
    if(i % 4 === 3) {
        continue; // this keyword means skip following steps, jump to next iteration
    }
    // work to do
}
在

数组循环逻辑上跳过 4，然后在 RGB 上跳过三个嵌套循环来执行您想要的操作，请参见下文：

附言由于我的回答被错误地否决了，我添加了一个示例数组和一个控制台.log消息，为您提供一个完整的工作示例，您可以在 Node 或浏览器中运行该示例以查看它完全按照 OP 的要求进行操作。

var a=[0,0,0,1,0,0,0,2,0,0,0,3,0,0,0,4];
    for(i=0;i<a.length;i+=4) // notice the i+=4 instead of i++, this the trick.
    {
      for(b=0;b<256;b++) {
        for(g=0;g<256;g++) {
          for(r=0;r<256;r++) {
            a[i]=r; // R cycles from 0 to 255 
            console.log(i, a[i], a[i+1], a[i+2]);
          }
          a[i+1]=g; // G cycles from 0 to 255
        }
        a[i+2]=b; // B cycles from 0 to 255
      }
    }

相关文章：