原生ajax分享

最近被大佬問了一個頗有趣的問題，你還能手打出一個ajax嗎？，我當時的想法是有現成的爲何要本身打，後來我反思了一下（只有靠本身才是強者），在這裏給你們分享一個我本身打的ajax，也是本身的一個知識點的記錄。

//後臺交互ajax方法
//參數1 集合 表明和後臺交互的全部數據
function ajax(obj) {
        obj.type = obj.type || "get"; //指定提交方式的默認值
        obj.data = obj.data || null; //設置數據的默認值
        var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP"); // 建立XMLHttpRequest對象
        var callback = function (xhr) {
            if (xhr.readyState == 4) {//判斷狀態碼爲4時，表示請求完畢可執行內容。
                if (xhr.status >= 200 && xhr.status < 300 || xhr.status == 304) {//若是狀態值爲200在300之間，或者是讀取緩存中的內容成功時，執行內容。
                    //這裏必需要try  catch。即便這裏mysql報錯，也不會影響到程序的使用。
                    try {
                        obj.success && obj.success(eval(xhr.responseText));
                    }
                    catch (e) {//若是錯誤，把錯誤輸出到控制檯。
                        console.log(xhr.responseText);
                    }
                } else {//若是狀態值不是200到300之間，或者不是304表示請求失敗，執行失敗的內容。
                    obj.error && obj.error();
                }
            }
        }
        var toData = function (obj) { //格式化參數
            if (obj == null) {
                return obj;
            }
            var arr = [];
            for (var i in obj) {
                var str = i + "=" + obj[i];
                arr.push(str);
            }
            return arr.join("&");
        }
        if (obj.type == "post") {//判斷是get仍是post請求
            xhr.open(obj.type, obj.url, obj.async);//打開鏈接，參數是：請求方式、請求地址、是否異步
            xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");//若是是post請求，設置請求頭信息。設置表單提交時的內容類型
            var data = toData(obj.data);//格式化參數
            xhr.send(data);//發送請求
            obj.async == false && callback(xhr);
        } else{ //get test.php?xx=xx&aa=xx
            var url = obj.url + "?" + toData(obj.data);//格式化yrl參數
            xhr.open(obj.type, url, obj.async);//打開連接
            xhr.send();//發送請求，由於是get請求，因此send（）不填參數
        }
        xhr.onreadystatechange = function () {//每次狀態改變時執行的函數
            callback(xhr);
        }
    }