深刻理解Promise/ajax

Promise 对象特色

1. 对象的状态不受外界影响。Promise对象表明一个异步操做，有三种状态：pending（进行中）、fulfilled（已成功）和rejected（已失败）。只有异步操做的结果，能够决定当前是哪种状态，任何其余操做都没法改变这个状态。
   
2. 一旦状态改变，就不会再变，任什么时候候均可以获得这个结果。Promise对象的状态改变，只有两种可能：从pending变为fulfilled和从pending变为rejected。只要这两种状况发生，状态就凝固了，不会再变了，会一直保持这个结果，这时就称为 resolved（已定型）。若是改变已经发生了，你再对Promise对象添加回调函数，也会当即获得这个结果。

Promise缺点

1. 没法取消promise,一旦新建它会当即执行，没法中途取消。
2. 若是不设置回调函数，promise内部抛出的错误，不会反应到外部
3. 当处于pending 状态时，没法得知目前进展到那一阶段。

原生ajxa/promise

// 0 未初始化未调用open // 1.启动 调用open 未调用 send // 2. 发送 已调用send() 可是未响应 // 3. 接收 已经接收部分响应数据 // 4.完成 完成所有数据响应 const ajax = function (params) { if (!params.url) return; const promise = new Promise((resolve, reject) => { const handler = function () { if (this.readyState !== 4) return if (this.status == 200) { resolve(this.responseText) } else { reject(this.statusText) } } const xhr = new XMLHttpRequest() if (params.method.toLowerCase() == 'get') { xhr.open('get', url + '?' + formatParams(params.data)); xhr.send() } else { xhr.open('post', url); xhr.send(JSON.stringify(params.data)); } xhr.onreadystatechange = handler xhr.responseType = 'json' xhr.setRequestHeader('Accept', 'application/json'); }) return promise function formatParams(obj) { if (!data) return var arr = [] for (let i in obj) { arr.push(`${encodeURIComponent(i)}=${encodeURIComponent(obj[i])}`) } return arr.join('&') } }













复制代码