大家好。我又来了,还记得上次我们意识到了什么吗?在上一张图中,我们实现了一个简单的Promise。我们在Promise内部实现了简单的process和then方法,实现了Promise的异步调用。但我们也留下了一些问题。..由于今天的代码是基于我们上次实现的,所以不太了解的朋友可以看看我上一篇文章。.文章地址:一步步实现一个符合PromiseA+规范的Promise库(一)问题一:then方法的链式调用我们都知道一个Promise可以再次返回一个Promise(当然也可以返回一个正常值)。而且,对于返回的Promise或者返回的普通值,我们需要获取它的值,传回给我们的nextthen方法。例如:当然我们也可以在then方法中返回一个Promise;所以问题来了。问题2:如果then方法中返回的是Promise或者普通值,我们需要怎么办。所以,让我们开始吧。我们先处理第一个问题,让我们的then方法支持链式调用,可以接受普通值。我们先修改一下then方法中成功状态(onfulfilled)的判断,因为下面和他一样。这里我们先看定义的Promise2。为什么要定义这样一个变量?我们需要知道,如果要在Promise中实现then方法的链式调用。当第一个then完成运行并给我们返回值时,我们也返回这个值。我们不禁要问?一个值怎么会有then方法呢?所以我们需要将这个值包装成一个Promise对象并返回。所以,我们需要让每个状态返回一个Promise。.有很多话要说。让我们测试一下。然后我们改变以下两种状态。让我们来看看。通过了测试。我们看到代码运行了2.496秒,我们的测试结果是正确的;到这里我们就解决了then方法链式调用,在then方法中返回了一个正常的值给下一个then方法的成功状态。感觉还好吗?接下来我们来解决第二个问题。我们需要允许在then方法中返回Promise。.所以,我们也必须处理这个案例。让我们尝试做它来展示我深厚的英语功底。其实很简单。我们需要一个统一的处理函数来在then中返回Promise。.我们首先创建一个新的方法,称为规范中所说的resolvePromise(Promisedecision)。什么意思,就是如果Promise2和x指向同一个对象,我们需要把需要返回的Promise2设置为reject,返回类型错误。看看下面的代码,仅此而已,然后我们描述细节。.emmmmmmmmm……这个有点细节。.好了,别开玩笑了,我们已经在代码中分析清楚了。让我们来看看。在then方法中,可以返回一个Promise,对吗?然后我们得到then方法的执行结果,可能是一个Promise,也可能是一个普通的值(即x)。然后我们判断这个x,首先要判断这个x是不是一个Promise,对吧?如果没有,我们可以直接返回x。如果是这样,我们应该知道Promise会有一个then方法。接下来我们需要判断then方法是否是一个函数。如果不是,那我们就直接返回this的值,emmm...他应该给一个普通的值。如果then方法是一个函数,我们可以直接执行。我们在两个回调中操作。如果执行onfulfilled,那么我们进行了关键的一步,就是递归调用我们的resolvePromise方法,看看我们的onfulfilled传入的参数是否还是Promise。直到x或者x.then是一个普通的值,那么我们就可以返回这个值,也就是解析出我们最终的值。当然,我们这里添加了try{}catch(){}是为了避免程序运行时出错。那么我们就可以把我们之前状态判断中的resolve换成我们的resolvePromise方法,比如:当然下面的pending状态也是一样的。至此我们的Promise几乎已经实现。但是还有一个问题。让我们考虑以下代码;上面的代码使用了ES6的原生Promisewhat?我们可以看到第一个then方法里面什么都没有,但是我们在第二个then中得到了promies中resolve的值。我们都知道then方法中有onfulfilled和onreject两个回调函数,所以我们要处理这两个回调函数。注意onrejected中默认函数的返回使用的是throw。因为我们要返回下一个reject,所以可以在then方法中处理这两个回调。判断他们的类型。如果type是function,说明这两个callback是有东西的。否则,我们将返回一个默认的匿名函数。这个函数的参数是上一个Promise返回的值,也就是我们再次执行onfulfilled或者onrejected的时候,可以直接拿到这个值。这就是我们想要的效果。现在,我们已经基本实现了一个比较完整的Promise。我们实现了Promise异步调用,在then方法中返回了Promise或者value,实现了then方法中没有回调函数,可以将执行结果传递给下一个then方法。当然,我们已经基本了解了Promise的基本原理,以后可以说我们可以使用和实现一个Promise了。当然,还有一些小问题,就是Promise中有很多方法我们没有实现。例如:Promise.resolve()。Promise.reject()..和.catch()方法Promise.all()方法等,在下一篇文章中,我们将一一实现这些方法,并介绍这些年前端开发的异步开发过程初始回调->Promise->generator函数->我们现在常用的asyncawait,先说到这里吧。看到这里不容易,谢谢大家。
