学习js遇到的一个小问题

Question

window.onload=function(){    function test(){        var flag=true;        var timer=null;        timer=setInterval(function(){            for(var i=0;i<=8;i++){                document.getElementById('box').innerHTML+="------"+i+'---------'+'<br>';                if(i != 8){         //8不等于8 执行 导致定时器关闭不了                    flag=false;                }                if(flag){                    clearInterval(timer);                    console.log('执行到了');                }                document.getElementById('box').innerHTML+=i+'---'+flag+'<br>';            }        },300);    }    test();    }       <div id="box" style="background: orange;width: 200px;height: 200px;"></div>    为什么会出现这种问题？按理说8会等于8,不会执行flag=false; 于是false为true，关闭定时器，可是结果恰好相反