promise封装ajax简单实现

全称AsynchronousJavaScriptXML，异步JavaScript和XML交互
一个ajax交互是从XMLHttpRequest对象开始的，将客户端执行的http请求解析为一个XML格式的服务器响应
1、创建一个XMLHttpRequest实例
2、使用HTTP方法来处理请求，并将目标的URL设置到XMLHttpRequest对象上
3、同时向XMLHttpRequest注册一个回调函数，异步的派发请求，这时控制权马上返回到浏览器，到服务器的请求到达，回调函数将被调用
4、将响应写回HttpServletResponse

ajax的机制是先定义响应函数，也就是onreaderstatechange函数来询问调用是否完成，当完成后会调用onread函数，对返回的结构进行一个包装和解析，之后才能发出请求。
ajax本身的状态和状态码

• 0 未发送，此时生成了XMLHttpRequest对象，为调用open（初始化xhr）方法做准备
  -1 载入，调用open方法根据参数(method,url,true初始化并将请求发送，此时正在向服务端发送请求
• 2 载入完成，表示接受完服务端的原始响应数据，此时并不能进行调用，需要加工
• 3 交互，正在对数据进行解析，据服务器端响应头部返回的MIME类型解析成responseText，responseXML，responseBody的格式，此时解析中的部分数据也是可以获取
• 4 完成，表示解析完成，客户端可以通过XML.httpRequest来进行数据的获取

其中MIME（多功能网际邮件扩充协议），被定义在content-type中

function ajax(method, utl, params = {}) {
    return new Promise((resolve, reject) => {
        const xhr = new XMLHttpRequest()
        if (method === 'get' && params) {
            url = url.indexOf('?') > -1 ? url + params : url + `?${params}`
        }
        xhr.open(method, url)
        xhr.onreadystatechange(() => {
            if (xhr.readyState === 4 && xhr.stauts >= 200 && xhr.status < 300 || xhr.status === 304) {
                resolve(xhr.responseText)
            } else { reject(result) }
        })
        xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded')
        xhr.ontimeout(() => { reject(new TypeError('请求超时'))})
        if (method === 'post') { xhr.send(params) }
        else { xhr.send() }
    })
}
// key-value拼接
let dataString = ''
for (let key in params) {
    dataString += `${key}=${params[key]}`
}