关于event loop的一些疑惑

Question

以下这段代码按照事件循环机制，不应该是先打印出‘heap over'再打印xhr.readyState最后打印responseText吗，为什么最终结果是先打印了xhr.readyState的状态码1再打印’heap over'，再继续打印readyState的其他状态码，onreadystatechenge到底是同步还是异步？当我把open方法放到onreadystate之前又先打印‘heap over’，有点搞不懂

var xhr = new XMLHttpRequest();

    xhr.onreadystatechange = function() {

            console.log(xhr.readyState)

                if(xhr.readyState == 4 && xhr.status == 200){

                    console.log(xhr.responseText);

                }

            }



xhr.open("GET",'data.txt',true); 

    xhr.send(null);



    for(var i = 0; i < 1000000000; i ++) {}

    console.log('heap over')

Answer 1

你得先了解一下, readystate的状态
open在前, 调用的时候, onreadystatechange还未设置,所以状态1的时候不会被打印出来
在后,调用的时候, onreadystatechange已设置,所以状态1的时候会被打印出来,然后才是 heap over

Answer 2

调用xhr.open("GET",'data.txt',true); 的时候会改变readyState，所以先触发了一次onreadystatechange