在沒有 if 語句的情況下，是否有更有效的方法來執行此代碼？

Question

我制作了這段代碼，它使用 set interval 函數來遍歷數組。

<img src="red.jpg" id="traffic" width="155" height="198">

<script>

var imgarray = ["red.jpg", "redandorange.jpg", "green.jpg", "orange.jpg"]
document.getElementById("traffic").innerHTML = traffic;

setInterval(function () {
ChangeLights() ;
}, 2000) ;

function ChangeLights() { 
if (traffic.src.match(imgarray[0])){
traffic.src = imgarray[1];
}else if (traffic.src.match(imgarray[1])){
traffic.src = imgarray[2];
}else if (traffic.src.match(imgarray[2])){ 
traffic.src = imgarray[3];
}else if (traffic.src.match(imgarray[3])){ 
traffic.src = imgarray[0];
}}

有沒有辦法在沒有所有 if 語句的情況下做到這一點？

Answer 1

您可以將ChangeLights()函數替換為：

function ChangeLights() {
    traffic.src = imgArray[imgArray.indexOf(trafficSrc) + 1 % imgArray.length];
}

Answer 2

var idx = 0;

function ChangeLights() { 
    idx++;
    if (idx > 2)
        idx = 0;
    traffic.src = imgarray[idx];
}

Answer 3

你的代碼歸結為這個

var i = 0;

setInterval(ChangeLights, 2000);

function ChangeLights() {
  i = i < imgarray.length - 1 ? i + 1 : 0;
  traffic.src = imgarray[i];

}

Answer 4

就在這里。

就像是：

for(var i = 0; i<imgarray.length; i++){
  if(traffic.src.match(imgarray[i])) {
       if(i+1 === traffic.length) {
         traffic.src = imgarray[0];
       } else {
          traffic.src = imgarray[i+1];
       }
       break;
  }
}