Promise
- 一个新的异步代码封装方案
- 以前通过回调函数的形式去封装, 会导致出现回调地狱
- 现在换 promise 后, 就解决了这个问题
promise 它会有三个状态
-
1. 持续: pending -
2. 成功: fulfilled -
3. 失败: rejected -
promise 只会发生两个转换 -
持续 ==> 成功 -
持续 ==> 失败
Promise 调用时 使用 new 关键字调用 即 构造函数
-
Promise 的 实例 化对象上 有两个 方法
-
1: .then
-
在 Promise 触发 成功状态时会触发 -
且接受 resolve时传递的参数 -
2: .catch
-
在 Promise 触发 失败状态时会触发 -
且接受 reject 时传递的参数 -
promise 实例化对象 可以接受 链式调用
//使用过 Promise 封装异步函数
const p = new Promise (function(fulfilled, rejected){
/**
* fulfilled 会把我们这个 promise 状态转换为 成功
* rejected 会把我们这个 promise 状态转换为 失败
* 两个都是函数
*/
//异步程序
//设置随机数 (生成 0~1 向下取整 * 3000 0 ~ 2700 ) + 1500
const timer = Math.floor(Math.random()*3000)+ 1500
// 设置延时器
setTimeout(()=>{
if(timer> 3000){
// 判断 随机生成的延时器时间 timer> 3000 毫秒时 表示链接失败 调用函数 rejected 打印
rejected('网络申请失败, 请重新申请')
}else{
// 判断 随机生成的延时器时间 timer> 3000 毫秒时 表示链接成功 调用函数 fulfilled 打印
fulfilled('网络申请成功, 欢迎访问')
}
},timer)
})
//使用 Promise 实例化对象对像里的方法
p.then(function(res){
/**
* 在 Promise 触发 成功状态时会触发
* 且接受 fulfilled 时传递的参数 res这里 其实就是字符串('网络申请成功, 欢迎访问')
*/
console.log(res)
}).catch(function(res){
/**
* 在 Promise 触发 失败状态时会触发
* 且接受 rejected 时传递的参数 res这里 其实就是字符串('网络申请失败, 请重新申请')
*
*/
console.log(res)
})
