ajax封装

/**
 * 封装ajax工具函数
 * 
 * options = {
 *     method:'get',
 *     url:'http://10.7.176.87:8088/api/list',
 *     data:{
 *         username:'admin',
 *         password:123
 *     },
 *     success:function(data){
 *         //处理成功
 *     },
 *     error:function(error){
 *         //处理失败
 *     }
 *
 * }
 * 
 *  ajax(options)  使用ajax工具函索进行网络请求
 * 
 */

function ajax(options){
    //1. 创建XMLHttpRequest对象
    const xhr = new window.XMLHttpRequest

    //2. 处理参数，对象参数转成名称值对形式
     //username='admin'&password=1234
     let parame = formateParame(options.data)

     //3. 判断请求方式,建立连接，发送请求
     let method = options.method.toUpperCase() //小写转大写
     if(method == 'GET'){
         xhr.open(method, options.url + '?'+ parame)   //4.建立连接 
         xhr.send()//5.发送请求
     }else if(method == 'POST'){
         xhr.open(method,options.url)  //4.建立连接 
         xhr.setRequestHeader('content-type','application/x-www-form-urlencoded')
         xhr.send(parame)//5.发送请求
     }

     //6.处理响应结果
     xhr.onreadystatechange = function(){
         if(xhr.readyState == 4){
             if(xhr.status == 200){
                 let result = xhr.responseText //响应数据，字符串形式
                 let data = JSON.parse(result)
                 //调用处理成功的回调函数success
                 options.success(data)
             }else{
                 options.error(xhr)
             }
         }
     }

}

/**
 *     {
 *         username:'admin',
 *         password:123                 =>   username='admin'&password=1234
 *     }
 * @param {*} obj 
 */
function formateParame(obj){
    let arr = []
    for(let key in obj){
        let item = `${key}=${obj[key]}`  // username='admin
        arr.push(item)  //['username='admin', password=1234]
    }
    let str = arr.join('&') // username='admin'&password=1234
    return str
}