js promise的用法

 在理解promise的使用之前,首先要理解js语言的运行环境是单线程的,也就是说一次只能完成一个任务,也就是一条流水线,如果有多个任务就必须排队,前面一个任务完成,再执行后面一个任务,以此类推。这与java的多线程环境截然不同,所以要加以区分。

1、对于js同步和异步,在这里需要加以备注一下:

我们可以简单的理解为:可以改变程序执行顺序的操作就可以看成为异步操作。其实异步和同步的差别很简单,就在于这条流水线上各个流程的执行顺序不同。最基础的异步是setTimeout和setInterval函数如图示例所示:


而执行顺序为


也就是说,“王一”和“刘五”所在的流水线为同步,即在主线程上执行的任务,,而setTimeout函数为异步任务,不进入主线程,而进入“任务队列”。程序先执行同步里的内容,执行完毕,“任务队列”开始通知主线程,请求执行任务,该任务才会进入主线程来执行。

而“任务队列”是一个事件的队列,IO设备完成一项任务,就在“任务队列”中添加一个事件,表示相关的异步任务可以进入主线程了,主线程读取‘任务队列’,就是读取里面就哪些事件。‘任务队列’中的事件除了IO设备的事件以外,还包括用户产生的一些事件(比如鼠标点击、页面滚动等)。

异步任务必须指定回调函数,当主线程开始执行异步任务,就是执行相应的回调函数。例如ajax的success,complete,error也都指定了各自的回调函数,这些函数就会加入任务队列中,等待执行。

2、promise

利用promise可以将异步操作以同步操作的流程表达出来,避免了层层嵌套的回调函数。此外,promise对象提供统一的接口,使得控制异步操作更加容易。

但注意promise无法取消,一旦建立就会立即执行,无法中途取消。而且,如果不设置回调函数,promise内部抛出的错误不会反映到外部。当处于Pending状态时,无法得知进展到哪一个阶段。

1)promise有三个状态:

Pending-promise的初始状态,等到任务完成或是被拒绝;Resolved-执行完成并且成功的状态;Rejected-执行完成并且失败的状态。此三个状态不能相互逆转。

2)promise对象必须实现then方法,可以说then是promise的核心,而且then方法必须返回一个promise对象,同一个promise对象可以注册多个then方法,并且回调的执行顺序和他们注册的顺序一致。

3)then方法接收两个回调函数,他们分别是成功时的回调和失败时的回调。

value值表示的是异步执行成功之后在promise函数中获取的值,不确切的说就是可以获取该函数的私有变量,将promise的值获取过来之后在then中可以实现值的相应应用。

以下示例表示promise的不可逆性和链式调用:




  • 35
    点赞
  • 124
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
JavaScript中的Promise是一种用于处理异步操作的对象。它提供了一种更优雅和可读性更高的方式来编写和处理异步代码。 下面是Promise的基本用法: 1. 创建一个Promise对象: ```javascript const promise = new Promise((resolve, reject) => { // 异步操作的代码 }); ``` 2. 异步操作完成时调用resolve: ```javascript resolve(value); ``` 3. 异步操作失败时调用reject: ```javascript reject(error); ``` 4. 使用Promise的then方法处理成功的结果: ```javascript promise.then((result) => { // 处理成功的结果 }); ``` 5. 使用Promise的catch方法处理错误: ```javascript promise.catch((error) => { // 处理错误 }); ``` 6. 可以使用Promise的finally方法在Promise结束后执行一些操作: ```javascript promise.finally(() => { // 执行一些清理操作 }); ``` 下面是一个示例,演示如何使用Promise执行异步操作: ```javascript function fetchData() { return new Promise((resolve, reject) => { setTimeout(() => { const data = 'Some data'; // 模拟异步操作成功,调用resolve并传递数据 resolve(data); // 模拟异步操作失败,调用reject并传递错误信息 // reject('Error occurred'); }, 2000); }); } const promise = fetchData(); promise .then((data) => { console.log('Success:', data); }) .catch((error) => { console.log('Error:', error); }) .finally(() => { console.log('Cleanup'); }); ``` 在上面的示例中,我们创建了一个fetchData函数,它返回一个Promise对象。在Promise的构造函数中,我们模拟了一个异步操作(在这里使用了setTimeout),并根据操作的结果调用resolve或reject。 然后,我们通过调用then方法来处理成功的结果,并通过catch方法来处理错误。最后,我们使用finally方法来执行一些清理操作(无论Promise是成功还是失败)。 这就是Promise的基本用法。使用Promise可以更好地处理异步操作,避免了回调地狱,并提供了更清晰和可读性更高的代码结构。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值