简单认识Promise
什么是Promise
Promise是异步编程的一个解决方案:从语法上讲它是一个对象,可以获取到异步操作的消息,从本意上讲,它是一个承诺,承诺过一段时间后它会给你一个结果。Promise有三种状态:pending(等待),fulfilled(成功),rejected(失败),状态一旦改变就不会再变,创建Promise后会立即执行。
为什么要使用Promise
避免回调地狱
// 请求 代表 一个异步网络调用。
// 请求结果 代表网络请求的响应。
请求1(function(请求结果1){
请求2(function(请求结果2){
请求3(function(请求结果3){
请求4(function(请求结果4){
请求5(function(请求结果5){
请求6(function(请求结果3){
...
})
})
})
})
})
})
解决办法
new Promise(请求1)
.then(请求2(请求结果1))
.then(请求3(请求结果2))
.then(请求4(请求结果3))
.then(请求5(请求结果4))
.catch(处理异常(异常信息))
Promise 的常用 API
Promise.resolve(value)
类方法,该方法返回一个以 value 值解析后的 Promise 对象
1、如果这个值是个 thenable(即带有 then 方法),返回的 Promise 对象会“跟随”这个 thenable 的对象,采用它的最终状态(指fulfilled/rejected/pending)
2、如果传入的 value 本身就是 Promise 对象,则该对象作为 Promise.resolve 方法的返回值返回。
3、其他情况以该值为成功状态返回一个 Promise 对象。
let p0=Promise.resolve('success');
p0.then(
res=>{
console.log(res);
},
err=>{
console.log(err);
}
)
// success
// 和p1效果相同
let p1=new Promise((resolve,reject)=>{
resolve('success')
})
p1.then(
res=>{
console.log(res);
},
err=>{
console.log(err);
}
)
// success
//如果传入的 value 本身就是 Promise 对象,则该对象作为 Promise.resolve 方法的返回值返回。
function fn(resolve){
setTimeout(function(){
resolve(123);
},3000);
}
let p2 = new Promise(fn);
let p3 = Promise.resolve(p2);
// 返回为true,返回的 Promise 即是 入参的 Promise 对象。
console.log(p2 === p3);
// true
Promise.reject
类方法,且与 resolve 唯一的不同是,返回的 promise 对象的状态为 rejected。
Promise.prototype.then
实例方法,为 Promise 注册回调函数,函数形式:fn(vlaue){},value 是上一个任务的返回结果,then 中的函数一定要 return 一个结果或者一个新的 Promise 对象,才可以让之后的then 回调接收。
Promise.prototype.catch
实例方法,捕获异常,函数形式:fn(err){}, err 是 catch 注册 之前的回调抛出的异常信息。
let p=Promise.resolve('0 success');
p.then(
res=>{
console.log(res);
return '1 success'
}
)
.then(res=>{
console.log(res);
throw new Error('2 error')
})
.catch(err=>{
console.log('catch',err);
})
// 0 success
// 1 success
// catch Error: 2 error
catch方法可以统一捕获then链式调用中产生的错误
Promise.finally
实例方法,用于指定不管Promise对象最后状态如何,都会执行的操作,不管Promise最后的状态,在执行完then或者catch指定的回调以后都会执行finally方法。可以进行任何必要的清理工作
let p=Promise.resolve('0 success');
p.then(
res=>{
console.log(res);
return '1 success'
}
)
.then(res=>{
console.log(res);
throw new Error('2 error')
})
.catch(err=>{
console.log('catch',err);
})
.finally(()=>{
console.log('p finally');
})
// 0 success
// 1 success
// catch Error: 2 error
// p finally
Promise.all([...])
类方法,多个 Promise 任务同时执行,返回最先执行结束的 Promise 任务的结果,不管这个 Promise 结果是成功还是失败。 。
let p1 = Promise.resolve('p1 success');
let p2 = Promise.resolve('p2 success');
let p3 = Promise.reject('p3 error')
let arr = [p1, p2, p3]
Promise.all(arr)
.then(
res => {
console.log(res);
},
err => {
console.log(err);
}
)
// p3 error
Promise.race([...])
类方法,多个 Promise 任务同时执行,返回最先执行结束的 Promise 任务的结果,不管这个 Promise 结果是成功还是失败。
let p1 = Promise.resolve('p1 success');
let p2 = Promise.resolve('p2 success');
let p3 = Promise.reject('p3 error')
let arr = [p1, p2, p3]
Promise.race(arr)
.then(
res => {
console.log(res);
},
err => {
console.log(err);
}
)
// p1 success
Promise.any([...])
与all相似,但是会忽略拒绝,所以只需要完成一个而不是全部
let p1 = Promise.reject('p1 error');
let p2 = Promise.resolve('p2 success');
let p3 = Promise.reject('p3 error')
let arr = [p1, p2, p3]
Promise.any(arr)
.then(
res => {
console.log(res);
},
err => {
console.log(err);
}
)
// p2 success
变式
Promise.none([...])
类似于all不过完成和拒绝的情况互换,只有所有的函数都被拒绝,该函数转化为完成值,反之亦然
Promise.first([...])
类似于any的竞争,只要第一个Promise完成,会忽略后边任何的拒绝和完成
Promise.last([...])
类似于first,但是只有最后一个完成胜出
简单认识Promise的更多相关文章
- 一个简单的Promise 实现
用了这么长时间的promise,也看了很多关于promise 的文章博客,对promise 算是些了解.但是要更深的理解promise,最好的办法还是自己实现一个. 我大概清楚promise 是对异步 ...
- 实现简单的promise
只考虑成功时的调用,方便理解一下promise的原理promise的例子: 1. 接下来一步步实现一个简单的promise step1:promise 接受一个函数作为构造函数的参数,是立即执行的,并 ...
- 如何用原生JS实现一个简单的promise
我又又又回来了,最近真是累的跟狗一样,急需一个大保健回复一下子精力 我现在是一边喝着红牛一边写着博客,好了好了,不扯了,回归整体好吧 先简单来说一下啥是promise吧 它是什么?Promise是一个 ...
- 简单版 Promise/A+,通过官方872个测试用例
promise 标准 在实现 Promise 之前要清楚的是 JavaScript 中的 Promise 遵循了 Promises/A+ 规范,所以我们在编写 Promise 时也应当遵循这个规范,建 ...
- 聊一聊看似简单的Promise.prototype.then()方法
Promise.prototype.then() Proise实例的then方法是定义在原型对象Promise.prototype上的,它的作用是为Promise实例添加状态改变时的回调函数. 该方法 ...
- 简单模拟 Promise
class promise { constructor(fn) { this.data = null; this.err = null; this.isPromise = false; this.er ...
- [手写系列] 带你实现一个简单的Promise
简介 学习之前 需要先对Promise有个基本了解哦,这里都默认大家都是比较熟悉Promise的 本次将带小伙伴们实现Promise的基本功能 Promise的基本骨架 Promise的then Pr ...
- 简单的 Promise 实现
参考 http://www.tuicool.com/articles/RzQRV3 var PENDING = undefined, FULLFILLED = 1, REJECTED = 2; var ...
- 简单的 Promise 实现 一
const Promise = function(fn){ let state = { pending: "pending", fulfilled: "fulfilled ...
- 手写简单的promise
function Promise(fn) { var that = this; this.status = "pedding"; this.value = undefined; / ...
随机推荐
- Semantic Kernel 入门系列:💬Semantic Function
如果把提示词也算作一种代码的话,那么语义技能所带来的将会是全新编程方式,自然语言编程. 通常情况下一段prompt就可以构成一个Semantic Function,如此这般简单,如果我们提前可以组织好 ...
- 关于Java中泛型的上界和下界理解
既然聊到了泛型的上下界问题,就先给出几个类的继承关系吧 class Fruit{}class Apple extends Fruit{}class Orange extends Fruit{}clas ...
- python:生成半年内的巡检日报execl
问题描述:使用脚本来生成半年内的数据,数据内容大概为每天的数据库巡检日报,临时抱佛脚.数据不可能是真实的,都是随机生成的,想要使用真实的数据后面直连操作系统或者数据库.后期可以慢慢实现自动化生成每天的 ...
- PHP大文件分割上传 PHP分片上传
这篇文章主要为大家详细介绍了PHP大文件分割上传,PHP分片上传,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 服务端为什么不能直接传大文件?跟php.ini里面的几个配置有关 upload_ma ...
- Java学习笔记04
1. 循环进阶 1.1 无限循环 概念 循环一直停不下来,又叫死循环. for格式 for (;;) { 循环语句; } while格式 while (true) { 循环语句; } do...w ...
- Qt+MySql开发笔记:Qt5.9.3的msvc2017x64版本编译MySql8.0.16版本驱动并Demo连接数据库测试
前言 mysql驱动版本msvc2015x32版本调好, mysql的mingw32版本的驱动上一个版本编译并测试好,有些三方库最低支持vs2017,所以只能使用msvc2017x64,基于Qt5 ...
- 笔记:网络IP数据包头部详解
笔记:网络IP数据包头部详解 传了无数次,每次图片都没了,真是郁闷,这编辑器,需要改下啊,各位CSDN的大神们!!! 由于最近看了一些相关的资料想起来这篇文章,所以补充 ...
- 快速上手Linux核心命令(九):文件备份与压缩
目录 tar 打包备份 gzip 压缩或解压文件 zip 打包和压缩文件 unzip 解压zip文件 scp 远程文件复制 rsync 文件同步工具 这期呢主要说一说Linux中文件备份与压缩命令,一 ...
- Python-HwTestReport的简单使用
一.工具包下载 https://github.com/hongweifuture/HwTestReport(出自此大神) 二.使用示例(直接上代码) 1.将 HwTestReport.py 导入项目 ...
- 自创简易CSS Tab 选项卡
前段时间我注册了 w3c.run域名,打算做一个W3C相关技术在线试验工具.没错,就是在线编写html.css.js代码然后在线运行,查看效果. 在设计首页时,我打算首页提供三个代码编辑器,介于界面大 ...