Promise
##### 概述
Promise 是 JS 中进行异步编程的一种解决方案。
简介
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script>
/*
Promise
Promise 是一门新的技术(ES6 规范)
Promise 是 JS 中进行异步编程的新解决方案
Promise 的状态改变
pending 变为 resolved
pending 变为 rejected
只 2 种, 且一个 Promise 对象只能改变一次,无论变为成功还是失败,
都会有一个结果数据, 成功的结果数据一般称为 Value,
失败的结果数据一般称为 reason
特点：
指定回调函数的方式更加灵活
旧的: 必须在启动异步任务前指定
Promise: 启动异步任务 => 返回Promise对象 => 给Promise对象绑定回调函数
(甚至可以任务结束后指定多个回调)
支持链式调用, 可以解决回调地狱问题
什么是回调地狱：
回调函数嵌套调用, 外部回调函数异步执行的结果是嵌套的回调执行的条件
回调地狱的缺点：
不便于阅读
不便于异常处理
解终极解决方案：
Promise链式调用
*/
const but = document.getElementById("btn")
but.addEventListener("click", function () {
let randomNumber = Math.ceil(Math.random() * 100)
//这里new Promise
const p = new Promise(function (resolve, reject) {
setTimeout(() => {
if (randomNumber < 30) {
//成功的状态
resolve("中奖了！")
} else {
//失败的的状态
reject("抱歉，很遗憾！")
}
}, 1000)
})
p.then(value => {
//这里是p的pending属性为resolve/fulfilled
alert(value)
}, reason => {
//这里是p的pending属性为rejected
alert(reason)
})
})
</script>
</head>
<body>
<button id="btn">点我</button>
</body>
</html>方法
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script>
/*
Promise.prototype.then方法：(onResolved（成功）, onRejected（失败）) => {}
resolve:
1.如果传入的参数为 非Promise类型的对象, 则返回的结果为成功Promise对象
2.如果传入的参数为 Promise 对象, 则Promise对象的状态决定了 p2执行onResolve还是OnRejected
reject:
1.如果传入的参数为 非Promise类型的对象, 则new Promise返回的结果永远为失败Promise对象
2.如果传入的参数为 Promise 对象, 则Promise对象的状态决定了 p执行onResolve还是OnRejected
all：
Promise.all（这里是一个数组，数组里面有一个一个的Promise），
他返回一个新的 Promise, 只有所有的 Promise都成功才成功,
只要有一个失败了就直接失败。
race：
返回一个新的 Promise, 第一个完成的 Promise的结果状态就是最终的结果状态
catch：
处理错误的方法
*/
// resolve
// let p1 = Promise.resolve(521);
// let p2 = Promise.resolve(
// new Promise((resolve, reject) => {
// // resolve('OK');
// reject("Error");
// })
// );
// // 如果不对出错进行处理（指定错误回调），控制台就会报错
// p2.then((value) => {
// console.log(value);
// }, (reason) => {
// console.log(reason);
// });
// console.log(p1)
// console.log(p2)
// reject
// let p1 = Promise.reject(521);
// let p2 = Promise.reject('haha');
// let p3 = Promise.reject(
// new Promise((resolve, reject) => {
// resolve("OK");
// })
// );
// p3.then((value) => {
// console.log(value);
// }, (reason) => {
// console.log(reason);
// });
// console.log(p1)
// console.log(p2)
// console.log(p3);
// all
// let p1 = new Promise((resolve, reject) => {
// resolve("OK");
// });
// let p2 = Promise.resolve('Success');
// // let p2 = Promise.reject("Error");
// let p3 = Promise.resolve("Oh Yeah");
// const result = Promise.all([p1, p2, p3]);
// console.log(result);
// race
// let p1 = new Promise((resolve, reject) => {
// setTimeout(() => {
// reject("OK");
// }, 1000);
// });
// let p2 = Promise.resolve("Error");
// let p3 = Promise.resolve("Oh Yeah");
// //调用
// const result = Promise.race([p1, p2, p3]);
// console.log(result);
// catch
// let p = new Promise((resolve, reject) => {
// reject('error');
// });
// p.catch(reason => {
// console.log(reason);
// });
</script>
</head>
<body>
</body>
</html>
