Promise的基本使用方法
前言(可以跳转解决地狱回调的问题👇🔗)
一、Promise是什么?
首先 Promise 是es6 里面的一个新语法, 是一个构造函数,有all、reject、resolve、allsettled、race等Api.
最基本的用法我们先用到 reject(英文:拒绝) resolve(英文:决定,决心) 我们通常认为 reject是不通过 , resolve是通过
二、Promise的用法如下(resolve)
创建 new Promise()实例,如下代码所示:
<script>
//第一种用法 es5中的普通用法
new Promise(function(resolve, reject) {
//异步操作
});
//第二种用法 es6 中的箭头函数
new Promise((resolve, reject) => {
//异步操作
})
</script>
1.promise的操作演示如下
这里用的是resolve,其中用的最多的也是es6的箭头函数 正常写法: ()=>{} , 一个参数(res)的写法: res =>
{console.log(res)}
<script>
;
/* 下面的代码是描述,如何使用 new Promise() 进行封装操作
代码是正常执行向下的2次异步操作封装
同样 reject --对应的 catch 用法类似
*/
//定义 Promise (网络封装请求)
new Promise((resolve, reject) => {
//用setTimeout模拟进行一步操作
setTimeout(() => {
//传递参数从resolve=>then reject=>catch同理
resolve('我是setTimeOut -01')
}, 1000);
//调用resove后,执行一次then()
}).then((res) => {
//打印参数res
console.log(res)
//通过return 再次创建Promise (网络封装)
//可以直接使用 return Promise.resolve() 进行简化操作
return new Promise((resolve, reject) => {
//模拟异步操作
setTimeout(() => {
//调用resolve,并传递参数
resolve('我是setTimeOut -02')
}, 1000);
//then() 使用的是箭头函数 es6的语法 完整版 (res1)=>{console.log(res1)}
}).then(res1 => console.log(res1))
})
</script>
2.reject的用法如下
reject() 是失败调用的,用法与resolve的用法类似,类比一下就可以正常使用了!(没有写演示)
总结
后续这里会进行一个更新,补充上Promsie的其他Api,希望可以继续努力