js 实现 ajax 异步交互

如果只是想单独封装js实现ajax异步交互，而不想使用整个jquery框架的话，请看下面代码:

/**
 * [ajax description] 异步交互
 * @param  {[type]} obj [description]
 * @return {[type]}     [description]
 */
var $win = window;
var ajax = function(obj) {
    if (!obj || typeof obj !== 'object') {
        return;
    }
    var _jsonToUrlParams = function(obj) {
        var str = '';
        for (var key in obj) {
            str += key + '=' + obj[key] + '&';
        }
        return str.substring(0, str.length - 1);
    };
    var type = obj.type ? obj.type : 'GET',
        url = obj.url ? obj.url : '',
        async = true,
        data = obj.data ? _jsonToUrlParams(obj.data) : null,
        headers = obj.headers ? (typeof obj.headers === 'object' ? obj.headers : null) : null,
        success = obj.success ? (typeof obj.success === 'function' ? obj.success : null) : null,
        error = obj.error ? (typeof obj.error === 'function' ? obj.error : null) : null;
    if (!url) {
        return;
    }
    if (type === 'GET' && data) {
        url = url.indexOf('?') > -1 ? url + '&' + data : url + '?' + data;
        data = null;
    }
    var _XHR = null;
    if ($win.XMLHttpRequest) {
        _XHR = new XMLHttpRequest();
    } else {
        _XHR = new ActiveXObject("Microsoft.XMLHTTP");
    }
    _XHR.onreadystatechange = function() {
        if (_XHR.readyState == 4 && _XHR.status == 200) {
            if (success) {
                success(!!_XHR.responseText ? JSON.parse(_XHR.responseText) : null);
            }
        }
        if (_XHR.readyState == 4 && _XHR.status != 200) {
            if (error) {
                error(_XHR);
            }
        }
    };
    _XHR.open(type, url, async);
    var send_header_content_type = false;
    if (headers) {
        for (var key in headers) {
            _XHR.setRequestHeader(String(key), String(headers[key]));
            if(key == "Content-Type")
                send_header_content_type = true;
        }
    }
    if(!send_header_content_type && type == "POST")
        _XHR.setRequestHeader("Content-Type","application/x-www-form-urlencoded;");

    _XHR.send(data);
};

这段代码把整个 XMLHttpRequest 请求处理封装为ajax函数，直接调用就很方便了，调用方法如下：跟jquery的ajax调用是一样的

ajax({
    type: "GET",           // 类型，POST || GET  默认GET
    url: "http://**/*",    //请求地址
    data: "",              //发送的数据
    success: function(data) {    //请求成功后做相应的处理
         console.log(data);
    },
    error: function(err) {       //请求失败后做相应的处理
         console.log(err);
    },
});