Ajax原生方式创建get和post请求方式（简易）

//实现目的：完成仿axios的原生方式函数
//一、两种请求方式，get和post
//二、三种数据类型，字符串，对象，FormDate


//把对象转换成字符串的函数
function objToString(obj) {
    //遍历对象，串成字符串
    let arr = [] //
    for (let key in obj) {
        arr.push(key + '=' + obj[key])
    }
    return arr.join('&') //join表示数组之间用&隔开
}


function myAjax(option) {
    let method = option.method //请求方式
    let url = option.url //资源路径地址
    let params = option.params //请求参数
    let data = option.data //post参数

    //1、创建XMLHttpRequest函数
    let xhr = new XMLHttpRequest()

    //2、如果是get请求和params有参时
    if (method.toLowerCase() == 'get' && params) {
        //如果是获取请求和有参数，有的话进行字符串拼接
        url = url + '?' + objToString(params) //进行拼接
        xhr.open(method, url) //请求方式和路径
        xhr.send() //发送 HTTP 请求
    }

    //3、如果是post方式请求，参数又分三种情况，字符串、对象、FormData。（1）而不同的参数对应的请求头有不一样，需要指定Content-Type的请求头。（2）而对象又需要转换成字符串才能传递

    if (method.toLowerCase() == 'post' && data) {
        //第一种：字符串型
        if (typeof data == 'string') {
            xhr.open(method, url) //请求方式和路径
            xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded') //字符串的请求头
            xhr.send(data) //发送 HTTP 请求
        }
        //第二种：对象类型
        else if (typeof data == 'object') {
            xhr.open(method, url) //请求方式和路径
            xhr.setRequestHeader('Content-Type', 'application/json') //对象的请求头
            let obj = JSON.stringify(data) //把对象转换成字符串再发送请求
            xhr.send(obj) //发送 HTTP 请求
        }
        //第三种：FormData型,则直接发送即可，不用设置请求头
        else {
            xhr.open(method, url) //请求方式和路径
            xhr.send(data) //发送 HTTP 请求
        }
    }
}


//以上代码重复性很高，这样写只是方便自己理解
//------------------------------------------------------------------------------------------