04Promise的理解(Ajax)

原创
小哥 2年前 (2023-05-17) 阅读数 164 #大杂烩

目录

一、Promise是什么?

二、Promise语法

1.Promise的catch方法(捕获promise失败的时候的操作)

2.Promise中all与race方法

三、Promise工作原理


一、Promise是什么?

Promise,英文是许诺的意思,在Ajax中可理解为一件没有完成的事情,但是一定有结果的。

Promise是用来解决回调地狱问题的。

详情看下面的例子(类似于这种层层嵌套的语法结构我们称作为回调地狱)

代码的层级开始层层递减这样的结构我们称之为回调地狱(层级多不方便修改与维护,看起来也难受)


为了解决这种回调地狱的问题,因此引入了Promise

结构如下:

控制台查看,这样与第一种结果是一样的,但是这样写代码更加美观与可控性

如何解决的?

本质上来说是将第一次调用的返回值作为下次的调用者来用

二、Promise语法





    
    
    
    Document
    
    
    
          
	      
	



    


控制台查看,上面对了走resolve(),输出的ok1,如果上面if判断错误则走reject()err输出not2


1.Promise的catch方法(捕获promise失败的时候的操作)

比如看这里,没有执行21行的代码,会直接直接下面错误的catch里面的函数

2.Promise中all与race方法





    
    
    
    Document
    
    
    
          
	      
	



    

    



控制台查看:

all方法是获取了全部的Promise并且一起装进了一个对象数组中,而race方法更像是比较网速,先获取到哪一个Promise就输出哪一个Promise。

三、Promise工作原理

Promise对象有三种状态:

①pending进行中:一创建Promise,默认状态就是pending状态,会立刻执行promise状态

②fufilled成功状态:当我传值进去,如果是resolve则,Promise的状态将会从pending转换成fufilled状态(成功状态)

③rejected失败状态:如果是resolve则,Promise的状态将会从pending转换成rejected状态(失败状态)

核心要点:

Promise是ES6新增的一个语法,是用来解决回调地狱的问题。

Promise的状态变化只有两种:

如果异步操作成功一般会执行resolve()方法,Promise的状态将会从pending转换成fufilled状态(成功状态)。

当异步操作失败的时候会执行reject()方法,Promise的状态将会从pending转换成rejected状态(失败状态)

版权声明

所有资源都来源于爬虫采集,如有侵权请联系我们,我们将立即删除