location.href赋值后页面不立即条状

Question

<script>

setTimeout(function(){
    location.href = "http://www.baidu.com"
    for(var i = 0;i<100;i++){
        console.log(1)
    }
    
}, 1000)

</script>
如上述代码，执行完location.href后，控制台输出了33左右个1页面才跳转，为什么会这样，希望有知道的朋友解答一下。

Answer 1

href异步加载百度主页，所以不会耽误你下面代码的运行。

Answer 2

其实题主的代码是跳转过程中for循环才开始执行、

页面转圈圈的时候、for循环还没执行完、就好像你跳转代码下面放几行console是一样的效果

只不过for循环没执行完就跳转了、

也就是说、location.href是异步操作、跳转的时间内可以完成你的for循环就会打印完、如果没打印完就跳转了就是你尝试的这种情况、可以在网速慢的时候试一下、让跳转变慢

Answer 3

可以不断调整for循环break条件，效果比较明显，跳转是异步操作，执行到

location.href = "http://www.baidu.com"

这一步骤时，操作放到异步队列当中，同步的for循环逻辑执行完之后才会从异步队列当中取出跳转任务来执行。

setTimeout(function(){
    location.href = "http://www.baidu.com"
    for(var i = 0;i<=10000;i++){
        console.log(i)
    }
    
}, 1000)