动手封装Ajax

/*
1.创建异步对象        var xhr = new XMLHttpRequest();
2.设置请求行          xhr.open('get', '/getStudentsJSON');
3.设置请求头
4.设置请求体
5.设置监视异步对象状态
*/

function Ajax (params) { // 传入的参数是一个对象
    // 这个parmas对象里面应该包括：type，url，data，callback
    // 定义变量获取数据, 短路运算
    var type = params.type || 'get';  // 获取请求的方式
    var url = params.url || location.pathname;  //location.href也可以;  获取要发送的目标地址
    var data = this.convertTostring(params.data || {}); // 获取要发送的数据
    var success = params.success;
    var dataType = params.dataType || 'text/plain';   // 什么都没有就以纯字符串

    // 创建异步AJAX对象
    var xhr = new XMLHttpRequest();

    if(type=='get'){
      url = url+"?"+data; //http://baidu.com:3002/submit?userName=jack&passPWd=jack1234
      data = null;
    }
    // 设置请求行
    xhr.open(type, url);
    // 设置请求头
    if(type=='post'){
      xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    }
    // get请求可以省略这一步
    // 设置请求体
    xhr.send(data);   // 这里的data就是通过convertTostring方法拼接的字符串
    // 监听异步对象状态
    xhr.onreadystatechange = function () {
      // 判断数据是否全部接收完成
      if (xhr.status == 200 && xhr.readyState == 4) {
        var res;
        // 把服务器响应回来的数据进行判断然后保存起来
        if(dataType =='json'){
          res = JSON.parse(xhr.responseText)
        }else if(dataType=='xml'){
          res = xhr.responseXML;
        }else{
          res = xhr.responseText;   // 当成纯文本字符串接收
        }
          success(res);
      }
    }
  }
}


var $ = {
  // 创建一个名为convert方法，把对象转换成拼接字符串的方法
  convertTostring: function(obj){
    var str = '';
    for(var key in obj){
      str += key + '=' + obj[key] + '&';
      console.log(str);
    }
    console.log(str.slice(0,-1));
    return str.slice(0,-1);
  }