ajax封裝

function ajax(options) {
            // 存儲(chǔ)的是默認(rèn)值
            var defaults = {
                type: 'get',
                url: '',
                data: {},
                header: {
                    'Content-Type': 'application/x-www-form-urlencoded'
                },
                success: function () { },
                error: function () { }
            };
            // 使用options對(duì)象中的屬性覆蓋defaults對(duì)象中的屬性
            Object.assign(defaults, options);

            // 創(chuàng)建ajax對(duì)象
            var xhr = new XMLHttpRequest();

            // 拼接請(qǐng)求參數(shù)的變量
            var params = '';
            // 循環(huán)用戶傳遞進(jìn)來(lái)的對(duì)象格式參數(shù)
            for (var attr in defaults.data) {
                // 將參數(shù)轉(zhuǎn)換為字符串格式
                params += attr + '=' + defaults.data[attr] + '&';
            }
            // 將參數(shù)最后面的&截取掉 
            // 將截取的結(jié)果重新賦值給params變量
            params = params.substr(0, params.length - 1);
            // 判斷請(qǐng)求方式
            if (defaults.type == 'get') {
                defaults.url = defaults.url + '?' + params;
            }


            // 配置ajax對(duì)象
            xhr.open(defaults.type, defaults.url);

            // 如果請(qǐng)求方式為post
            if (defaults.type == 'post') {
                // 用戶希望的向服務(wù)器端傳遞的請(qǐng)求參數(shù)的類型
                var contentType = defaults.header['Content-Type']
                // 設(shè)置請(qǐng)求參數(shù)格式的類型
                xhr.setRequestHeader('Content-Type', contentType);
                // 判斷用戶希望的請(qǐng)求參數(shù)格式的類型
                // 如果類型為json
                if (contentType == 'application/json') {
                    // 向服務(wù)器端傳遞json數(shù)據(jù)格式的參數(shù)
                    xhr.send(JSON.stringify(defaults.data))
                } else {
                    // 向服務(wù)器端傳遞普通類型的請(qǐng)求參數(shù)
                    xhr.send(params);
                }
            } else {
                // 發(fā)送請(qǐng)求
                xhr.send();
            }
            // 監(jiān)聽(tīng)xhr對(duì)象下面的onload事件
            // 當(dāng)xhr對(duì)象接收完響應(yīng)數(shù)據(jù)后觸發(fā)
            xhr.onload = function () {
                // xhr.getResponseHeader()
                // 獲取響應(yīng)頭中的數(shù)據(jù)
                var contentType = xhr.getResponseHeader('Content-Type');
                // 服務(wù)器端返回的數(shù)據(jù)
                var responseText = xhr.responseText;

                // 如果響應(yīng)類型中包含applicaition/json
                if (contentType.includes('application/json')) {
                    // 將json字符串轉(zhuǎn)換為json對(duì)象
                    responseText = JSON.parse(responseText)
                }

                // 當(dāng)http狀態(tài)碼等于200的時(shí)候
                if (xhr.status == 200) {
                    // 請(qǐng)求成功 調(diào)用處理成功情況的函數(shù)
                    defaults.success(responseText, xhr);
                } else {
                    // 請(qǐng)求失敗 調(diào)用處理失敗情況的函數(shù)
                    defaults.error(responseText, xhr);
                }
            }
        }