ES6 Promise对象(七)
一、Promise介绍
1、Promise简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果
2、Promise可以将异步操作以同步操作的流程表达出来,避免了层层嵌套的回调函数。此外,Promise对象提供统一的接口,使得控制异步操作更加容易
二、基本用法【使用时注意环境及异步操作相关包安装】
在node环境中使用ajax时需要安装jsdom、jqury包
配置常量:
//创建window环境
const {JSDOM} = require('jsdom');
const {window} = new JSDOM('<!DOCTYPE html>');
//获取jQuery函数
const $ = require('jquery')(window);
1、Promise构造函数接受一个函数作为参数,该函数的两个参数分别是resolve函数和reject函数【参数函数由JavaScript引擎提供,不用自己部署】
eg:
let promise = new Promise((resolve,reject)=>{});
a、resolve函数的作用:
将Promise对象的状态从“未完成”变为“成功”【从Pending 变为 Resolved】,在异步操作成功时调用,并将异步操作的结果,作为参数传递出去
b、reject函数的作用:
将Promise对象的状态从“未完成”变为“失败”【从 Pending 变为 Rejected】,在异步操作失败时调用,并将异步操作报出的错误,作为参数传递出去
Promise实例生成以后,可以使用实例then方法分别指定Resolved状态和Rejected状态的回调函数【一般建议使用then和catch分开指定回调函数】
then(fun1,fun2)
方法参数:
a、fun1:Promise对象的Resolved状态回调函数
b、fun2:Promise对象的Rejected状态回调函数
catch(fun) 【该方法为then(null,fun2)方法的别名】
方法参数:
fun:Promise对象的Rejected状态回调函数
注:
一般使用then来执行Resolved状态回调函数,使用catch来执行Rejected状态回调函数,而不直接使用then调用两种状态下的回调函数
finally(fun) 【不管Promise对象状态如何,都会执行该方法】(一般用于回收资源)
eg:
let promise = new Promise((resolve,reject)=>{
//参数函数内部一般执行异步操作
$.ajax({
url:'',
method:'',
data:[],
success(res){
resolve(res);
},
error(error){
reject(error);
}
});
});
//执行Promise构造函数中异步执行成功resolve()方法的回调函数
promise.then((res)=>{});
//执行Promise构造函数中异步执行失败reject()方法的回调函数
promise.catch((error)=>{});
//不管Promise对象状态如何,都会执行该方法
promise.finally(()=>{});
//上面方法也可以使用下面形式调用
//promise.then((res)=>{}).catch((error)=>{}).finally(()=>{});
三、Promise函数相关方法
1、Promise. resolve()
参数类型:
a、参数是一个Promise实例 【返回这个Promise实例】
eg:
//传递的是Promise对象,不做任何操作,原样返回这个Promise实例promise
let p = Promise.resolve(promise); p.then((res)=>{
console.log(res);
}).catch((error)=>{
console.log(error,'-------');
}).finally(()=>{
//无论异步操作成功或失败都会执行finally函数
console.log('finally');
});
b、参数是一个thenable对象【thenable对象指的是具有then方法的对象】
Promise.resolve方法会将这个thenable对象转为Promise对象,然后就立即执行这个thenable对象的then方法
eg:
let obj = {
name:'zhangsan',
then(){
console.log('obj中的then方法');
}
};
let p = Promise.resolve(obj); //直接执行obj对象中的then方法,不会执行实例对象p中的then方法
p.then(()=>{ //该方法不会执行
console.log('p3的then方法');
});
c、参数不是一个thenable的对象或根本就不是对象 【返回一个新的Promise对象,状态为Resolved,执行then中的回调函数】
eg:
//执行了resolve函数,即执行then中的回调函数【执行了resolve函数,Promise对象才由pending状态转化为resolve状态】
let p = Promise.resolve('hello'); //返回resolve状态的Promise对象【内部执行了resolve函数】 打印resolve字符串
p.then(()=>{
console.log('resolve');
}).catch(()=>{
console.log('reject');
});
d、不带有任何参数 【返回一个Resolved状态的Promise对象】
2、Promise.all() 【返回多个Promise实例包装成的一个新Promise实例】
方法参数:
参数为多个Promise实例对象组成的数组
方法说明:
a、将多个Promise实例,包装成一个新的Promise实例,并返回该新包装的Promise实例
b、若参数数组中的所有Promise实例状态为resolved时,新包装的实例状态才为resolve状态,
新包装的实例then方法中的resolve的回调函数参数数据信息为所有实例返回的成功请求数据
c、若参数数组中碰到有Promise实例状态为rejected时,新包装的实例状态即为rejected状态,无需再看后面的实例状态,
新包装的实例catch方法中的reject的回调函数参数数据信息为该rejected状态实例参数的失败请求数据
eg:
//p1,p2,p3为Promise的实例对象
var p = Promise.all([p1, p2, p3]); //新实例p的状态为数组参数中返回信息结果最快的实例状态【即参数数组获取信息最快的实例对象】
p.then((res)=>{
console.log(res); //p1,p2,p3中resolved状态返回的信息集合对象
}).catch((error)=>{
console.log(error) //参数最先配到的实例rejected状态的返回信息
});
3、Promise.race() 【返回多个Promise实例包装成的一个新Promise实例】
方法参数:
参数为多个Promise实例对象组成的数组
方法说明:
a、新包装的Promise实例状态为参数数组中返回信息结果最快的实例对象的状态
b、新包装的Promise实例相应方法中的数据信息即为参数数组中返回信息最快的实例相关数据信息
eg:
//p1,p2,p3为Promise的实例对象
var p = Promise.race([p1, p2, p3]); //新实例p的状态为数组参数中返回信息结果最快的实例状态【即参数数组获取信息最快的实例对象】
p.then((res)=>{
console.log(res); //参数数组中执行最快的实例返回的成功数据信息
}).catch((error)=>{
console.log(error) //参数数组中执行最快的实例返回的失败数据信息
});
ES6 Promise对象(七)的更多相关文章
- ES6 Promise对象then方法链式调用
then()方法的作用是Promise实例添加解决(fulfillment)和拒绝(rejection)状态的回调函数.then()方法会返回一个新的Promise实例,所以then()方法后面可以继 ...
- ES6 Promise 对象
Promise 的含义 Promise 是异步编程的一种解决方案,比传统的解决方案--回调函数和事件--更合理和更强大.它由社区最早提出和实现,ES6 将其写进了语言标准,统一了用法,原生提供了Pro ...
- JavaScript ES6 Promise对象
说明 Node.js中,以异步(Async)回调著称,使用了异步,提高了程序的执行效率,但是,代码可读性较差的. 假如有几个异步操作,后一个操作需要前一个操作的执行完毕之后返回的数据才能执行下去,如果 ...
- es6 promise对象
function next(){ return new Promise( function( resolve, reject ){ var num =7 // Math.floor( Math.ran ...
- IE不支持 ES6 Promise 对象的解决方案
* 引入bluebird.js即可完美解决. /*ie兼容 Promise*/ isIE(); function isIE() { //ie? if ( !! window.ActiveXObject ...
- ES6 Promise 全面总结
转载:点击查看原文 ES6 Promise对象 ES6中,新增了Promise对象,它主要用于处理异步回调代码,让代码不至于陷入回调嵌套的死路中. @-v-@ 1. Promise本质 Promise ...
- ES6 之 let和const命令 Symbol Promise对象
ECMAScript 6入门 ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准,已经在2015年6月正式发布了. (2016年6月,发布了小幅修订的<ECMASc ...
- ES6深入学习记录(二)promise对象相关
1.Promise的含义 Promise是异步编程的一种解决方案,比传统的解决方案--回调函数和事件更合理和强大.ES6将其写进了语言标准,统一了用法,原生提供了promise对象. 所谓Promis ...
- es6中的promise对象
Promise是异步里面的一种解决方案,解决了回调嵌套的问题,es6将其进行了语言标准,同意了用法,提供了`promise`对象, promise对象有三种状态:pending(进行中) .Resol ...
随机推荐
- 201871010136-赵艳强《面向对象程序设计(java)》第六,七周学习总结
201871010136-赵艳强<面向对象程序设计(java)>第六七周学习总结 项目 内容 这个作业属于哪个课程 <任课教师博客主页链接> https://w ...
- django学习-视图练习
写一个真正有用的视图 每个视图必须要做的只有两件事: 返回一个包含被请求页面内容的HttpResponse对象,或抛出一个异常,比如Http404. 至于你还想干些什么,随便你. 你的视图可以从数据库 ...
- Visual Studio 2017 软件包及教程
下载地址:https://files.cnblogs.com/files/yungle/VisualStudio2017.rar 安装教程:https://mp.weixin.qq.com/s?__b ...
- JVM-卡表(Card Table)
简介 现代JVM,堆空间通常被划分为新生代和老年代.由于新生代的垃圾收集通常很频繁,如果老年代对象引用了新生代的对象,那么,需要跟踪从老年代到新生代的所有引用,从而避免每次YGC时扫描整个老年代,减少 ...
- 【使用篇二】SpringBoot文件上传(5)
一.单个文件上传 1. 在static目录下创建upload.html <!DOCTYPE html> <html> <head> <meta charset ...
- SysML——CSE 599W: Systems for ML
CSE 599W: Systems for ML Assignments Materials Projects Schedule Schedule The schedule is tentative ...
- The Preliminary Contest for ICPC Asia Shanghai 2019 C. Triple
[传送门] FFT第三题! 其实就是要求有多少三元组满足两短边之和大于等于第三边. 考虑容斥,就是枚举最长边,另外两个数组里有多少对边之和比它小,然后就是 $n^3$ 减去这个答案. 当 $n \le ...
- 洛谷 P5021 [NOIP2018]赛道重建
洛谷 P5021 [NOIP2018]赛道重建 传送门 思路 思路就是常规的思路,所以就不说了--我就是来记录一下我的\(AC\)之路的,真的是太爽了 没错--我也是一个个打的部分分,最后终于AC的, ...
- Deepin (Linux Debian)使用日记
(现在Deepin使用了debian的stable源,如果求新,推荐使用排行榜前三的Linux发行版——> Manjaro) 修复开启混合显卡驱动后,屏幕泛白偏灰问题“: https://blo ...
- mysql 类型自动化转换问题
mysql 类型自动化转换问题 背景 有个业务需求,使用到find_in_set函数,简单贴下,如下: SELECT FIND_IN_SET('b','a,b,c,d'); //返回值为2,即第2个 ...