Не работает код, если выставить else if

Question

По учебнику если несколько if, то второй if нужно записывать как else if, верно? Но в моём коде, когда я пытаюсь следовать этому правилу, то есть на втором if пишу else if сразу после этого пропадает цикличность.

Почему помеченная внизу строка кода работает лишь с if, а не с else if?

let a = document.querySelectorAll('.item');

let colors = [
{name:'red', interval: 1000},
{name:'', interval: 1000},
{name:'blue', interval: 1000},
{name:'', interval: 1000},
]

let count = 0;
let countColor = 0;

let go = setTimeout(function change(){
    
if(count === colors.length){
count = 0;  
}   

if(countColor === colors.length){   // Если вместо if, поставить else if, то цикличность пропадает
countColor =0;  
}
    
a[count].style.background = colors[countColor].name;    
go = setTimeout(change, colors[count].interval);
    
if(countColor % 2){
count = count + 1;  
}
countColor = countColor + 1;        
},1000)

body{   
user-select:none;
}

.main{
margin-top:100px;
margin-left:200px;  
width:250px;
height: 100px;  
background: blue;
}

.item{
height: 100%;   
background: gray;   
margin-bottom: 30px;
}

<div class = "main">
<div class = "item" data-color='red'>1</div>
<div class = "item" data-color='blue'>2</div>
<div class = "item" data-color='orange'>3</div>
<div class = "item" data-color='gold'>4</div>
</div>

Answer 1

Код читается сверху вниз

if код читает всегда, даже если их 99 штук, он все их прочитает, но если проверка false, блок кода не будет выполнен.

else if имеет ряд особенностей. Такое условие не может быть первым, оно стоит по середине между if и else (else может быть опущен). Оно выполняется, если условие if не было выполнено. Пример работы if/else/else if

БЛОГ НА HUSL

Не работает код, если выставить else if

Ответы (1 шт):