promise特性,及优缺点
作者:互联网
Promise有三种状态:pending(进行中)、fulfilled(已成功)、rejected(已失败)
Promise对象接受一个回调函数作为参数, 该回调函数接受两个参数,分别是成功时的回调resolve和失败时的回调reject;另外resolve的参数除了正常值以外, 还可能是一个Promise对象的实例;reject的参数通常是一个Error对象的实例。
then方法返回一个新的Promise实例,并接收两个参数onResolved(fulfilled状态的回调);onRejected(rejected状态的回调,该参数可选)
Promise优点:
1,统一异步 API:Promise 的一个重要优点是它将逐渐被用作浏览器的异步 API ,统一现在各种各样的 API ,以及不兼容的模式和手法。
2,Promise 与事件对比:和事件相比较,Promise 更适合处理一次性的结果。在结果计算出来之前或之后注册回调函数都是可以的,都可以拿到正确的值。Promise 的这个优点很自然。但是,不能使用 Promise 处理多次触发的事件。链式处理是 Promise 的又一优点,但是事件却不能这样链式处理。
3,Promise 与回调对比:解决了回调地狱的问题,将异步操作以同步操作的流程表达出来。
4,Promise 带来的额外好处是包含了更好的错误处理方式(包含了异常处理),并且写起来很轻松(因为可以重用一些同步的工具,比如 Array.prototype.map() )。
Promise缺点
1,无法取消Promise,一旦新建它就会立即执行,无法中途取消。
2,如果不设置回调函数,Promise内部抛出的错误,不会反应到外部。
3,当处于Pending状态时,无法得知目前进展到哪一个阶段(刚刚开始还是即将完成)。
4,Promise 真正执行回调的时候,定义 Promise 那部分实际上已经走完了,所以 Promise的报错堆栈上下文不太友好。
用原生js的Promise对象:
function axiosPro(option={}){
return new Promise((reslove,reject)=>{
var url=option.url;
var method=option.method||'GET';//获取请求
var data=option.data||'';//获取请求参数
var ajax=new XMLHttpRequest(); if(method=='GET'){ ajax.open(method,`${url}?${data}`); ajax.send(); }else if(method=='POST'){ ajax.open(method,`${url}`); ajax.setRequestHeader('Content-Type','application/x-www-form-urlencoded');//请求头 ajax.send(data); }
ajax.onreadystatechange=function(){ if(ajax.readyState==4&&ajax.status==200){ reslove(JSON.parse(ajax.responseText)); } } ajax.onerror=(err)=>{ reject(err) } }) }
var option={ url:"url", } axiosPro(option).then(res=>{ console.log(res); })
var option1={ url:"url" } axiosPro(option1).then(res=>{ console.log(res); })
//发出post请求 var option2={ url:'url', method:'POST', data:'username=123&password=123' } axiosPro(option2).then(res=>{ console.log(res); })
var ajax=new XMLHttpRequest(); if(method=='GET'){ ajax.open(method,`${url}?${data}`); ajax.send(); }else if(method=='POST'){ ajax.open(method,`${url}`); ajax.setRequestHeader('Content-Type','application/x-www-form-urlencoded');//请求头 ajax.send(data); }
ajax.onreadystatechange=function(){ if(ajax.readyState==4&&ajax.status==200){ reslove(JSON.parse(ajax.responseText)); } } ajax.onerror=(err)=>{ reject(err) } }) }
var option={ url:"url", } axiosPro(option).then(res=>{ console.log(res); })
var option1={ url:"url" } axiosPro(option1).then(res=>{ console.log(res); })
//发出post请求 var option2={ url:'url', method:'POST', data:'username=123&password=123' } axiosPro(option2).then(res=>{ console.log(res); })
标签:url,优缺点,特性,ajax,promise,var,Promise,回调,method 来源: https://www.cnblogs.com/Hollow-Z/p/16492142.html