Promise
Promise是JS中的一个内置类
基础写法
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Promise基础语法</title>
</head>
<body>
<script>
let ran = Math.random()
let promiseExamp = new Promise((resolve, reject) => {
setTimeout(() => {
ran < 0.5 ? reject(ran) : resolve(ran)
}, 1000)
})
promiseExamp.then((result) => {
console.log('成功：' + result)
}, (error) => {
console.log('失败：' + error)
})
</script>
</body>
</html>
Promise的executor函数和状态
Promise的状态
pending 初始状态（NEwPROMISE后的状态）
fulfilled 操作成功完成（在executor函数中把resolve执行，就是告知promise当前异步操作的结果是成功的）
rejected 操作失败（在executor函数中把reject执行，就是告知promise当前异步操作的结果是失败的）
executor函数
- let pro = new Promise([executor])
- new Promise 的时候就会把
执行函数[executor]执行，[executor]是Promise类的一个回调函数，Promise内部会把它执行。 - Promise不仅将它执行，还给他传递两个参数（两个参数也是函数类型）
- resolve函数：如果它执行，就代表Promise处理的异步事情是成功的，将Promise的状态由
padding --改为--> fulfilled - reject函数：如果它执行，就代表Promise处理的异步事情是失败的，将Promise的状态由
padding --改为--> rejected - [executor]函数中所放的就是当前要处理的异步操作事情（同步也是可以的，但一般存放的是异步任务），任务成功，执行resolve,任务失败执行reject
- resolve函数：如果它执行，就代表Promise处理的异步事情是成功的，将Promise的状态由
- new Promise 的时候就会把
Promise中的then和catch和finally方法
重点不是要知道异步任务是成功还是失败，而是要确定失败之后做什么，成功之后做什么
Promise.prototype 上
then 设置
成功或者失败后执行的方法（成功或者失败都可以设置，也可以只设置一个）
当执行到异步操作时，主线程不会等待异步执行完成，而是先基于then方法将我们要在成功或者失败的时要执行的东西扔到事件池中，暂时是不执行的，而是等待状态更改后的通知安排。
- promiseExamp.then([success],[error])
- promiseExamp.then([success])
- promiseExamp.then(null,[error])
- catch: 设置失败后执行的方法
- finally: 设置不论成功还是失败都会执行的方法（一般很少用）
then 链
执行then/catch/finally返回的结果是一个全新的Promise实例，所以可以链式写下去，下一个then中哪个方式会被执行，由上一个then中某个方法的执行结果来决定
<script>
let pro1 = new Promise((resolve, reject) => {
setTimeout(() => {
let ran = Math.random()
ran < 0.5 ? reject(ran) : resolve(ran)
}, 1000)
})
let pro2 = pro1.then(result => {
console.log('pro1:success');
}, error => {
console.log('pro1:error');
})
let pro3 = pro2.then(result => {
console.log('pro2:success');
}, error => {
console.log('pro2:error');
})
</script>
---控制台的打印情况---
第一种：ran小于0.5时
pro1:error
pro2:success
第二种：ran大于0.5时
pro1:success
pro2:success
一个then中某个方法的的返回值会返回给下一个then的某个方法中
<script>
new Promise((resolve, reject) => {
resolve(100) //=> 将第一个Promise实例的Value值改为100
}).then(result => {
console.log(result);
return result * 10 //=> then中return的结果相当于把当前这个新的promise实例中的value值改为返回值
}, error => {
console.log(error);
}).then(A => {
console.log(A);
}, B => {
console.log(B);
}).then(C => {
console.log(C)
},D => {
console.log(D)
})
</script>
---控制台---
100
1000
undefined
以上便是PROMISE里的分量机制，每一次then后，都会是一个新的PROMISE实例，该实例只受上一个PROMISE实例影响（上一个实例的状态和value值来决定）
我们再来看PROMISE的玩法
如果如果当前PROMISE实例状态确定后，都会找到对应的THEN中找方法，如果THEN中没有对应的这个方法，则会向下顺延
new Promise(resolve,reject) => {
reject(-100)
}.then(A => {
console.log(A)
return A * 10
}).catch(B => {
console.log(B)
return B * 10
})
---控制台---
-100
new Promise(resolve,reject) => {
resolve(100)
}.then(A => {
console.log(HELLO)
return A * 10
}).catch(B => {
console.log(B)
}).then(C => {
console.log('日闽好帅')
})
---控制台---
ReferenceError: HELLO is not defined
日闽好帅
通过这个PROMISE实例身上的.catch方法，它能够带来什么好处呢？
我们通过上面的两个示例，可以看到.catch所能够监视到的范围变大了，如果第一个PROMISE实例它的状态修改为失败，而第二个PROMISE实例中并没有设置第二个接受失败的回调，因此顺延到第三个.catch创建的PROMISE实例对象来执行；如果第一个PROMISE实例它的状态修改为成功，但是第二个PROMISE实例的成功回调中处理失败，将状态改为了rejected，那么就以该报错原因作为VALUE值，.catch即是可以接受其报错原因，也是可以进行失败后的一些操作的，如果这样写，就可以监听到两个了，是不是很不错的选择。
我们来看一道题目，它的打印结果是什么？
new Promise((resolve,reject) => {
resolve();
}).then().catch(x => {
console.log(1)
}).then(x => {
console.log(2) // => ok
}).then(x => {
console.log(3) // => ok
}).catch(x => {
console.log(4)
}).then(x => {
console.log('AAA') // => ok
console.log(AAA) // => 报错
}).catch().then(null, x => {
console.log(5) // => ok
})
---控制台---
2
3
AAA
5
谢谢款待
小记整理于 2023 / 8 / 30
