为什么用promise？

1、支持链式调用，可以解决回调地狱问题
2、指定回调函数的方式更加灵活

可封装一个异步操作，获取其成功和失败的值

异步编程

• fs文件操作
• 数据库操作
• AJAX
• 定时器

Promise 关键问题----如何中断 Promise 链

<script>let p = new Promise((resolve,reject)=>{setTimeout(()=>{resolve("ok");},1000)})p.then(value=>{console.log(111);}).then(value=>{console.log(2222);}).then(value=>{console.log(333333);}).catch(reason=>{console.warn(reason);})</script>

结果如图所示：

如果我们只想得到前两个的输出值，则有且仅有一种方法：添加一个等待状态（pending状态）的Promise
即：

  <script>let p = new Promise((resolve,reject)=>{setTimeout(()=>{resolve("ok");},1000)})p.then(value=>{console.log(111);}).then(value=>{console.log(2222);return new Promise(()=>{})   //添加一个等待状态的Promise}).then(value=>{console.log(333333);}).catch(reason=>{console.warn(reason);})</script>

结果如图：

Promise 的自定义封装

<script src="./promise.js"></script><script>let p = new Promise((resolve,reject)=>{//    resolve("ok");reject('ggg')// throw "error"});console.log(p);p.then(value=>{console.log(value);},reason=>{console.log(reason);})</script>

分别声明构造函数以及then方法

// 声明构造函数
function Promise(executor) {// 添加属性this.PromiseState = 'pending';this.PromiseResult = null;// 保存实例对象的 this 值const self = this;// resolve函数function resolve(data) {// 判断状态if(self.PromiseState !== 'pending') return;// 改变对象状态  promisestateself.PromiseState = 'fulfilled';// 设置对象结果值  promiseresultself.PromiseResult = data;}// reject函数function reject(data) {if(self.PromiseState !== 'pending') return;// 改变对象状态  promisestateself.PromiseState = 'rejected';// 设置对象结果值  promiseresultself.PromiseResult = data;}
// throw功能实现try {// 同步调用[执行器函数]executor(resolve, reject);} catch (e) {// 修改 promise 状态为失败reject(e)}
}// 添加then方法
Promise.prototype.then = function (onResolved, onRejected) {// 调用回调函数if(this.PromiseState === "fulfilled"){onResolved(this.PromiseResult);}if(this.PromiseState === "rejected"){onRejected(this.PromiseResult);}
}