Ajax同步与异步在代码中的体现

同步与异步在Ajax代码中的最大区别:

下面是同步的代码:xhr.readyState==4表示数据解析完成,而在同步操作中在xhr.sead(null)后已经xhr.readState==4了
所以我们不需要用回调函数了:
    username.addEventListener("blur",function(){
            var xhr =new XMLHttpRequest();
            xhr.open("get","checkUsername.php?uname="+username.value,false);
            console.log(xhr.readyState);//1
            xhr.send(null);
            console.log(xhr.readyState);//4
            xhr.onreadystatechange=function(){
                if(xhr.readyState==4){
                    if (xhr.status==200){
                        var result=xhr.responseText;
                        console.log(result);
                    }
                }
            }
        })
        所以代码一个换成:
                username.addEventListener("blur", function() {
                var xhr = new XMLHttpRequest();
                xhr.open("get", "checkUsername.php?uname=" + username.value, false);
                console.log(xhr.readyState);
                xhr.send(null);
                console.log(xhr.readyState);
                if (xhr.readyState == 4) {
                    if (xhr.status == 200) {
                        var result = xhr.responseText;
                        console.log(result);
                    }
                }
            })
            我是这样理解的:同步是要按照顺序先后来的,所以在执行了xhr.open的时候xhr.readyState==1;
            然后再执行xhr.send()这里是传递数据,这里时间长,同步会卡死,等执行xhr.send()完以后才开始下一步所以这个时候xhr.readyState已经==4了
            所以就不需要回调函数再去让xhr.readyState==4了;

下面是异步的代码:
    在异步操作中,在没有执行回调函数时,xhr.readyState==1的,所以要用到回调函数让xhr.readyState==4;
    useryx.addEventListener("blur", function() {
                var xhr = new XMLHttpRequest();
                xhr.open("post", "checkEmail.php", true);
                xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded",true );
                console.log(xhr.readyState);//1
                var parse = "e=" + useryx.value;
                xhr.send(parse);
                console.log(xhr.readyState);//1
                xhr.onreadystatechange = function() {
                    if (xhr.readyState == 4) {
                        if (xhr.status == 200) {
                            var result = xhr.responseText;
                            console.log(result);
                        }
                    }
                }
            })
            异步操作时在执行xhr.send()时,正常来说异步这里也会卡死,因为JS是单线程,但是游览器是多线程的,
            在异步中,xhr.send()在传递数据时时间,游览器会执行下面的语句,所以我们在xhr.send()下面的输出语句是==1,
            正常来说send()执行完以后,xhr.readyState应该不是==1.因为JS是单线程.