资讯专栏INFORMATION COLUMN

Promise使用

NervosNetwork / 1528人阅读

摘要:一旦请求事件多了,就避免不了回调地狱,回调很可能容易一层接着一层。的意思是承诺,作用和回调函数相似,在未来的某个时刻执行某件事情。但是的写法更加简约易用,更加符合我们平常的思维。

发布自Kindem的博客,欢迎大家转载,但是要注意注明出处。另外,该文章收纳在Kindem的个人的 IT 知识整理仓库,欢迎 Star、Fork、投稿
Promise

由于JavaScript是单线程的,所以回调是JavaScript中避免不了的,所有的网络请求、浏览器事件都需要使用回调的方式异步处理。

一旦请求、事件多了,就避免不了回调地狱,回调很可能容易一层接着一层。

Promise的意思是承诺,作用和回调函数相似,在未来的某个时刻执行某件事情。但是Promise的写法更加简约易用,更加符合我们平常的思维。

Usage

Promise是一个对象,在ES6已经被规范成了原生JavaScript的一部分,但是在ES6之前,则需要使用第三方库来实现

Promise分为三个状态:

pending: 执行中

resolved: 已完成

rejected: 已失败

Promise对象被实例化的那一刻,传入构造函数的方法将会被执行,并且进入pending状态,而一旦完成或者失败,则会进入相应的状态,这一过程是不可逆的

他的用法(ES6)如下:

let promise = new Promise((resolve, reject) => {
    if (...) {
        // 如果成功了
        resolve(...);
    } else {
        // 如果失败了
        reject(...);
    }
});

这里的resolvereject两个方法可以使用下面的方法来给与:

promise
    .then(onSuccess)
    .catch(onFailed);

传递给then的方法将在承诺执行成功时被调用,传递给catch的方法将在承诺执行失败时被调用

更加方便的一点是,Promise往往可以嵌套使用,这样可以是多个任务有条不紊地进行,假设p1是一个Promise对象而p2p3都是能够产生Promise对象的方法(如果直接new那么Promise将会被直接执行),那么你可以这样写,使得他们按照顺序执行,并且可以一次性处理他们产生的错误

p1
    .then(p2)
    .then(p3)
    .then(onSuccess)
    .catch(onFailed);

比如:

let p1 = new Promise((resolve, reject) => {
    console.log("p1");
    setTimeout(() => {
        resolve("p2");
    }, 1000)
});

let p2 = (result) => new Promise((resolve, reject) => {
    console.log(result);
    setTimeout(() => {
        resolve("p3");
    }, 2000);
});

let p3 = (result) => new Promise((resolve, reject) => {
    console.log(result);
    setTimeout(() => {
        resolve("over");
    }, 3000);
});

p1
    .then(p2)
    .then(p3)
    .then((result) => {
        console.log(result);
    })
    .catch((error) => {
        console.log(error);
    });

运行可以看见:

p1
p2
p3
over

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/96958.html

相关文章

  • 实现Promise

    摘要:使用是极好的,它是如此有用以至于我觉得应该好好研究一下,甚至是实现一个简易的版本。构造函数检查参数例如是不是函数啊初始化,创建对象执行因此构造函数里面传入的是立即被执行的。 使用Promise是极好的,它是如此有用以至于我觉得应该好好研究一下Promise,甚至是实现一个简易的版本。实现之前,我们先来看看Promise的用途: 使用Promise callback hell Promi...

    xcc3641 评论0 收藏0
  • Promise 中的三兄弟 .all(), .race(), .allSettled()

    摘要:对于的来说基元函数包括组合函数的类型签名返回情况完成如果传入的可迭代对象为空,会同步地返回一个已完成状态的。相反,如果是在指定的时间之后完成,刚返回结果就是一个拒绝状态的从而触发方法指定的回调函数。在行中,对每个小任务得到的结果进行汇总。 为了保证的可读性,本文采用意译而非直译。 想阅读更多优质文章请猛戳GitHub博客,一年百来篇优质文章等着你! 从ES6 开始,我们大都使用的是 P...

    vspiders 评论0 收藏0
  • JavaScript 异步

    摘要:从最开始的到封装后的都在试图解决异步编程过程中的问题。为了让编程更美好,我们就需要引入来降低异步编程的复杂性。写一个符合规范并可配合使用的写一个符合规范并可配合使用的理解的工作原理采用回调函数来处理异步编程。 JavaScript怎么使用循环代替(异步)递归 问题描述 在开发过程中,遇到一个需求:在系统初始化时通过http获取一个第三方服务器端的列表,第三方服务器提供了一个接口,可通过...

    tuniutech 评论0 收藏0
  • 【笔记】你不知道的JS读书笔记——Promise

    摘要:写在前面这一章的顺序对于未接触过使用过的童鞋而言略抽象了,前边几章主要为了说明和之前的异步方式相比有什么优势和它能解决什么问题,后边才详解的设计和各种场景下如何使用。建议先了解和简单使用过后再阅读,效果更佳。 写在前面:Promise这一章的顺序对于未接触过使用过Promise的童鞋而言略抽象了,前边几章主要为了说明Promise和之前的异步方式相比有什么优势和它能解决什么问题,后边才...

    mumumu 评论0 收藏0
  • Promise使用须知

    摘要:已完成意味着操作成功完成。处理实例实例生成以后,可以用方法分别指定状态和状态的回调函数。第二个回调函数在的状态变成时被调用。方法是的别名,用于指定发生错误时的回调函数。具体的使用示例如下情形一全部成功的情况结果为。 一.关于Promise promise 是异步编程的一种解决方案,比传统的解决方案(回调函数和事件)更合理和更强大。它由社区最早提出和实现,ES6将其写进了语言标准,统一了...

    Tikitoo 评论0 收藏0
  • 学习 Promise,掌握未来世界 JS 异步编程基础

    摘要:构造函数规定,对象是一个构造函数,用来生成实例。如果中的回调函数抛出一个错误,那么返回的将会成为拒绝状态,并且将抛出的错误作为拒绝状态的回调函数的参数值。 其实想写 Promise 的使用已经很长时间了。一个是在实际编码的过程中经常用到,一个是确实有时候小伙伴们在使用时也会遇到一些问题。Promise 也确实是 ES6 中 对于写 JS 的方式,有着真正最大影响的 API 特性之一。本...

    Vicky 评论0 收藏0

发表评论

0条评论

NervosNetwork

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<