promise 理解与总结
对Promise的理解
Promise是异步编程的一种解决方案,可以获取异步操作的消息,避免了地狱回调,它比传统的解决方案回调函数和事件更合理和更强大。
所谓Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。从语法上说,Promise 是一个对象,从它可以获取异步操作的消息。
(1)Promise的实例有三个状态:
pending(进行中)fulfilled(已完成)rejected(已拒绝)
(2)Promise的实例有两个过程:
- pending -> fulfilled : resolve()
- pending -> rejected:rejecte()
特点:状态不受外界干;一旦状态改变,就不会再变,这也是promise这个名字的由来——“承诺”。
注意: 在构造 Promise 的时候,构造函数内部的代码是立即执行的。
状态的改变是通过 resolve() 和 reject() 函数来实现的,可以在异步操作结束后调用这两个函数改变 Promise 实例的状态,它的原型上定义了一个 then 方法,使用这个 then 方法可以为两个状态的改变注册回调函数。这个回调函数属于微任务,会在本轮事件循环的末尾执行。
Promise的缺点:
- 无法取消Promise,一旦新建它就会立即执行,无法中途取消。
- 如果不设置回调函数,Promise内部抛出的错误,不会反应到外部。
- 当处于pending状态时,无法得知目前进展到哪一个阶段(刚刚开始还是即将完成)。
Promise的基本用法
(1)创建Promise对象
Promise构造函数接受一个函数作为参数,该函数的两个参数分别是resolve和reject。
它们是两个函数,调用后只是改变状态,并不会终结 Promise 的参数函数的执行。
const promise = new Promise(function(resolve, reject) {
if (/* 异步操作成功 */){
resolve(value);
// 后续代码还可以继续执行
} else {
reject(error);
}
});
一般情况下都会使用new Promise()来创建promise对象,但是也可以使用promise.resolve和promise.reject这两个方法。
这两种方法是new Promise的快捷形式,也创建一个promise对象。
(2)Promise方法
then()
then方法是定义在promise原型对象上的,作用是为 Promise 实例添加状态改变时的回调函数。
promise.then(
function(value){
// 成功后执行的代码
}, function(error){
// 失败后执行的代码
}
);
then方法可以接受两个回调函数作为参数,其中参数是可选的。
- 第一个回调函数是Promise对象的状态变为
resolved时调用; - 第二个回调函数是Promise对象的状态变为
rejected时调用。
then方法返回的是一个新的Promise实例。因此可以采用链式写法,在then后再调用then方法。
catch()
Promise对象还有一个catch方法,该方法相当于then方法的第二个参数,指向reject的回调函数。在执行resolve回调函数时,如果出现错误,不会停止运行,而是进入catch方法中。
p.then((data) => {
console.log('resolved',data);
},(err) => {
console.log('rejected',err);
}
);
p.then((data) => {
console.log('resolved',data);
}).catch((err) => {
console.log('rejected',err);
});
finally()
finally方法用于指定不管 Promise 对象最后状态如何,都会执行的操作。
promise
.then(result => {···})
.catch(error => {···})
.finally(() => {···});
上面代码中,不管promise最后的状态,在执行完then或catch指定的回调函数以后,都会执行finally方法指定的回调函数。
finally方法的回调函数不接受任何参数,这表明,finally方法里面的操作,应该是与状态无关的,不依赖于 Promise 的执行结果。finally本质上是then方法的特例:
promise.then(
result => {
// 语句
return result;
},
error => {
// 语句
throw error;
}
);
使用finally方法,同样的功能,就不需要为成功和失败两种情况各写一次。
all()
Promise.all()方法用于将多个 Promise 实例,包装成一个新的 Promise 实例。
const p = Promise.all([p1, p2, p3]);
它接收一个数组,数组的每一项都是一个promise对象。当数组中所有的promise的状态都达到resolved的时候,all方法的状态就会变成resolved,如果有一个状态变成了rejected,那么all方法的状态就会变成rejected。
let promise1 = new Promise((resolve,reject)=>{
setTimeout(()=>{
resolve(1);
},2000)
});
let promise2 = new Promise((resolve,reject)=>{
setTimeout(()=>{
resolve(2);
},1000)
});
let promise3 = new Promise((resolve,reject)=>{
setTimeout(()=>{
resolve(3);
},3000)
});
Promise.all([promise1,promise2,promise3]).then(res=>{
console.log(res);
//结果为:[1,2,3]
})
调用all方法时的结果成功的时候是回调函数的参数也是一个数组,这个数组按顺序保存着每一个promise对象resolve执行时的值。失败的时候,返回失败对象执行reject的值。
race()
race方法和all一样,接受的参数是一个每项都是promise的数组,但是与all不同规则是,当最先执行完的事件执行完之后,就直接返回该promise对象的值。如果第一个promise对象状态变成resolved,那自身的状态变成了resolved;反之第一个promise变成rejected,那自身状态就会变成rejected。
let promise1 = new Promise((resolve,reject)=>{
setTimeout(()=>{
reject(1);
},2000)
});
let promise2 = new Promise((resolve,reject)=>{
setTimeout(()=>{
resolve(2);
},1000)
});
let promise3 = new Promise((resolve,reject)=>{
setTimeout(()=>{
resolve(3);
},3000)
});
Promise.race([promise1,promise2,promise3]).then(res=>{
console.log(res);
//结果:2
},rej=>{
console.log(rej)};
)
promise 理解与总结的更多相关文章
- angular的promise理解
promise承诺是angular的一个重点部分,是一种异步处理值(或非值)的方法.一般程序是从上至下执行,遇到某个地方需要花点时间,就干等着把这个地方执行完了,才继续做下一个,看着有点笨蛋.而pro ...
- promise理解
每个操作都返回一样的promise对象,保证链式操作 每个链式都通过then方法 每个操作内部允许犯错,出了错误,统一由catch error处理 操作内部,也可以是一个操作链,通过reject或re ...
- Promise 理解与使用
个人觉得这篇博客写的非常详细且易懂,推荐给小伙伴们~ https://www.cnblogs.com/lvdabao/p/es6-promise-1.html#!comments
- 理解Promise
一.Propmise基本用法 Promise用于发送一个异步完成的结果,是替代回调函数的另一种选择.可以把Promise理解为一种异步函数. 以下函数通过一个Promise来异步地返回一个结果 fun ...
- promise第一篇-简介
1. 创建一个promise对象 var promise = new Promise(function(resolve, reject){ //异步处理 //处理结束后调用resolve或reject ...
- angular $q promise详解
前言 通过本文,你大概能清楚angular promise是个啥,$q又是个啥,以及怎么用它.这里咱们先灌输下promise的思想. 下面写的全是废话,一些看着高逼格其实没什么大作用的概念,想知道$q ...
- Promise 知识点
.done() Promise 对象的回调链,不管以then方法或catch方法结尾,要是最后一个方法抛出错误,都有可能无法捕捉到(因为 Promise 内部的错误不会冒泡到全局).因此,我们可以提供 ...
- 一文了解Promise使用与实现
前言 Promise 作为一个前端必备技能,不管是从项目应用还是面试,都应该对其有所了解与使用. 常常遇到的面试五连问: 说说你对 Promise 理解? Promise 的出现解决了什么问题? Pr ...
- Apache Spark源码走读之6 -- 存储子系统分析
欢迎转载,转载请注明出处,徽沪一郎. 楔子 Spark计算速度远胜于Hadoop的原因之一就在于中间结果是缓存在内存而不是直接写入到disk,本文尝试分析Spark中存储子系统的构成,并以数据写入和数 ...
随机推荐
- 物理CPU,物理核,逻辑CPU,虚拟CPU(vCPU)区别 (转)
在做虚拟化时候,遇到划分CPU的问题,因此考虑到CPU不知道具体怎么划分,查询一些资料后就写成本文. a. 物理CPU:物理CPU是相对于虚拟CPU而言的概念,指实际存在的处理器,就是我们可以看的见, ...
- 【linux命令】wget
感谢作者:八雲苗 链接:https://www.jianshu.com/p/1c3847fa7e45 wget官方文档:wget wget是一个使用HTTP,HTTPS,FTP和FTPS协议来下载文件 ...
- Tomcat 下载安装,启动,停止,注册服务,开机自启
感谢大佬:https://blog.csdn.net/wangmx1993328/article/details/81013715 目录 Tomcat 下载 startup.bat 启动 Tomcat ...
- js获取 url?后面的参数取值
function GetRequest() { var url = location.search; //获取url中"?"符后的字串 var theRequest ...
- js--事件流、事件委托、事件阶段
前言 JavaScript 与 HTML 的交互是通过事件实现的,事件代表文档或浏览器窗口中某个有意义的时刻.可以使用仅在事件发生时执行的监听器(也叫处理程序)订阅事件.本文总结一下 JS 中的事件相 ...
- HMS Core机器学习服务助力Zaful用户便捷购物
Zaful是近年来发展良好的出海电商平台,主打快时尚.在洞察其用户有购买街头海报.生活中同款衣物的需求后,Zaful联合HMS Core机器学习服务打造拍照购物服务.用户拍照后可在预设的商品图片库中搜 ...
- Spring 初始化流程
开始 在SpringIOC中,前面讲述了如何配置BeanDefinition和如何注册BeanDefinition,但是这些知识容器初始化的一部分,在AbstractApplicationContex ...
- Solution -「AGC 026D」Histogram Coloring
\(\mathcal{Description}\) Link. 有 \(n\) 列下底对齐的方格纸排成一行,第 \(i\) 列有 \(h_i\) 个方格.将每个方格染成黑色或白色,求使得任意完 ...
- Solution -「LOCAL」模板
\(\mathcal{Description}\) OurOJ. 给定一棵 \(n\) 个结点树,\(1\) 为根,每个 \(u\) 结点有容量 \(k_u\).\(m\) 次操作,每次操作 ...
- SpringBoot 自定义MessageConvert
创建一个MessageConvert类,实现HttpMessageConvert接口 简单实现,只完成写功能.其他默认false package com.boot.converter; import ...