npm 包 promise-extended 使用教程

#npm 包 promise-extended 使用教程

在现代的前端开发中,异步操作如此普遍,而 JavaScript 的回调函数却常常使得代码难以理解和维护。为了解决这个问题,Promise 对象应运而生。Promise 通过使用链式调用和错误处理,使得异步代码变得简洁易懂。

然而,原生的 Promise 对象也有其不足之处。例如,当多个 Promise 实例需要串联时,不同的 Promise 形成的链会导致代码缩进层数过深,降低了可读性。此时,我们需要使用 promise-extended 这个 npm 包。

#什么是 promise-extended

promise-extended 封装了原生的 Promise 对象,同时提供了许多方便的方法。这些方法可以使得我们的异步操作更加强大和高效。promise-extended 支持链式调用,提高代码可读性和可维护性。

#安装 promise-extended

可以使用 npm 安装 promise-extended 。

    --- - ----------------

#promise-extended 的基本用法

使用 promise-extended 只需把封装了 Promise 的类实例化,然后调用方法即可。

    ----- --------------- - ----------------------------
    ----- ------- - --- ------------------

接下来,我们将介绍 promise-extended 一些常用方法,包括串联多个 Promise、设置并发数、设置超时等等。

#串联多个 Promise

如果不使用 promise-extended ,当我们需要串联多个 Promise 时,代码可能会变得非常庞大和难以维护。

    --- ---------------- --------- ------- -
        ------------------- -- -
            ---------------------
            ----------
        -- ------
    ---------------- -- -
        ------ --- ---------------- --------- ------- -
            ------------------- -- -
                ---------------------
                ----------
            -- ------
        ---
    ---------------- -- -
        ------ --- ---------------- --------- ------- -
            ------------------- -- -
                ---------------------
                ----------
            -- ------
        ---
    ---

使用 promise-extended 可以让我们的代码变得更加简洁。

    ----- --------------- - ----------------------------
    ----- ------- - --- ------------------
    
    -------
        -------- -- ---------------------
        -------- -- ---------------------
        -------- -- ----------------------

#设置并发数

默认的 Promise 相当于在使用 Promise.all ,当有一个 Promise 失败时,整个链都会失败。这有时候会导致一些问题。例如, 当我们需要调用数十个 API ,但是其中几个API由于某种原因失败了,但是我们依然希望其他API可以正常返回。

promise-extended 支持设置 Promise 的并发数,即同一时间允许执行多少个 Promise 。设置并发数可以避免上述问题,提高异步代码的可靠性。

    ----- --------------- - ----------------------------
    ----- ------- - --- ------------------
    
    ----- ---- - -
        -----------------------------------------------
        -----------------------------------------------
        -----------------------------------------------
        -------------------------------------------------
        -------------------------------------------------
        -------------------------------------------------
        -------------------------------------------------
        -------------------------------------------------
        ------------------------------------------------
    --
    ------------------- ----- -- ------------------- -- ------------
        ------------------
        ---------------------
        ----------- -- ---------------------

在上面的示例中,我们设置了并发数为 3 ,同一时间最多允许执行三个 Promise 。fetch(url).then(res => res.json()) 是我们需要执行的 Promise 参数。queue 方法会等待当前 Promise 任务执行完成后再执行下一个。

如果没有设置并发数,则当前 Promise 完成后,会立刻执行下一个 Promise。

#设置超时时间

promise-extended 支持设置 Promise 超时时间,当 Promise 超时时,可以指定 Promise 返回的值或者执行错误处理方法。

    ----- --------------- - ----------------------------
    ----- ------- - --- ------------------
    
    ----- ----------- - -- -- -
        ------ --- ----------------- ------- -- -
            ------------- -- -
                ------------------ ----------
                ----------- ------- -----
            -- ------
        ---
    --
    
    ------------------------------ ----- ------
        ------------------
        ----------------------

在上面的示例中,我们创建了一个慢速 Promise ,该 Promise 需要 3 秒钟才能完成。然后我们通过调用 timeout 方法来设置 Promise 超时时间为 1 秒钟。由于超时,Promise 返回的结果为 '超时了'。

#promise-extended 的更多方法

除了以上的方法,promise-extended 还提供了一些很有用的方法。

allSettled 方法

该方法等价于 Promise.allSettled ,但是该方法只有在 Promise 集合中所有 Promise 完成后才会返回 。allSettled 方法返回一个 Promise ,该 Promise 会在所有 Promise 完成后执行。

    ----- --------------- - ----------------------------
    ----- ------- - --- ------------------
    
    ----- -------- - -
        -------------------
        -------------------
        ------------------------
        ------------------
    --
    
    ----------------------------
        ------------------
        ----------------------

filter 方法

该方法可以过滤 Promise 成功的结果。

    ----- --------------- - ----------------------------
    ----- ------- - --- ------------------
    
    ----- -------- - -
        -------------------
        -------------------
        -------------------
        ------------------------
        ------------------
    --
    
    ------------------------ ------ -- ---- - --
        ------------------
        ----------------------

some 方法

该方法等价于 Promise.some ,返回一个 Promise ,该 Promise 的值等于集合中处理成功的 Promise 的值。

    ----- --------------- - ----------------------------
    ----- ------- - --- ------------------
    
    ----- -------- - -
        ------------------------
        -------------------
        -------------------
        -------------------
        ------------------
    --
    
    ---------------------- --
        ------------------
        ----------------------

我们指定了至少要处理三个成功的 Promise 才会成功。在上面的示例中,1、2、3、4四个 Promise 处理成功,所以该 Promise 被解析。如果我们指定的解析数量大于成功的 Promise 数量,则该 Promise 会被拒绝,否则将得到一个被解析的 Promise 。

race 方法

该方法等价于 Promise.race ,返回一个 Promise ,该 Promise 会在第一个完成的 Promise 处理成功或失败后执行。

    ----- --------------- - ----------------------------
    ----- ------- - --- ------------------
    
    ----- -------- - -
        --- ----------------- ------- -- -
            ------------------ ----- ----------------
        ---
        --- ----------------- ------- -- -
            ------------------ ----- ----------------
        --
    --
    
    ----------------------
        ------------------
        ----------------------

在上面的示例中,我们创建了两个 Promise ,每个 Promise 都会在指定的时间后失败。由于第一个 Promise 时间比第二个 Promise 时间长,所以返回的结果是第二个 Promise 处理失败时的结果。

#结论

在异步操作频繁的前端开发中,promise-extended 是必备的工具之一。promise-extended 提供了各种有用的方法,使我们的异步操作更加简单、直观和可维护。同时,它还支持链式调用,使得我们的异步代码更加漂亮和易于阅读和理解。

来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/68366


猜你喜欢

  • NPM包 it 使用教程

    NPM(Node Package Manager)是一个基于 Node.js 平台的包管理器,它可以下载、安装和管理 Node.js 应用程序或开发包。在前端开发中,很多常用的工具和库都可以通过NPM...

    5 年前
  • npm 包 Mustacher 使用教程

    在前端开发中,我们经常需要操作字符串模板。Mustacher 是一个 Node.js 的字符串模板引擎,可以通过 npm 包管理器下载。在本文中,我们将介绍如何使用 Mustacher 和一些实例代码...

    5 年前
  • npm 包 n-app-conf 使用教程

    介绍 n-app-conf 是一款用于前端应用配置管理的 npm 包,它可以帮助我们在前端应用中更方便地管理环境变量和配置参数,从而让我们在开发、测试和部署中更加便捷。

    5 年前
  • npm 包 hmacsha1 使用教程

    前言 随着现代 web 应用的快速发展,前端技术也变得越来越重要,近年来前端开发者已经成为了程序员社区中的一股不可忽视的力量。而 npm(Node Package Manager)则是一个非常重要的工...

    5 年前
  • npm 包 upyun 使用教程

    前言 随着互联网技术的不断更新与发展,网站以及移动应用的需求越来越多样化,要求后端与前端的交互也越来越复杂。其中,文件上传和图片处理是常用功能之一,upyun npm 包能够帮助我们快速的实现图片处理...

    5 年前
  • npm 包 doxmate 使用教程

    什么是 doxmate doxmate 是一个基于 Node.js 的 API 文档生成工具。它可以从项目中读取注释文档,并生成一套美观的 API 文档。它采用 Markdown 的语法来编写文档,方...

    5 年前
  • npm 包 cdn2 使用教程

    什么是 npm 与 cdn2 npm(Node Package Manager),是一个 Node.js 的包管理器。通过 npm 可以方便的安装和使用包,便于我们管理项目依赖。

    5 年前
  • npm 包 grimoirejs-cauldron 使用教程

    什么是 grimoirejs-cauldron? grimoirejs-cauldron 是一个基于 grimoire.js 的插件,它提供了许多方便易用的功能,使开发者能够更轻松地创建基础设施。

    5 年前
  • npm 包 zblog 使用教程

    在前端开发中,搭建一个博客是一个很常见的需求。但是,为了从零开始搭建一个博客,需要耗费大量的时间和精力。为了解决这个问题,有很多优秀的博客框架和模板可以使用。而今天我们要介绍的是一种轻量级、易用的博客...

    5 年前
  • npm 包 fis-deploy-uglify-js 使用教程

    介绍 fis-deploy-uglify-js 是一个使用 UglifyJS 为 fis3 的默认 JS 压缩插件的部署工具。本篇文章将详细介绍 fis-deploy-uglify-js 的安装、使用...

    5 年前
  • npm 包 amorphic-bindster 使用教程

    在前端开发中,我们经常需要对数据进行操作和管理。npm 包 amorphic-bindster 可以帮助我们更加方便地实现数据的双向绑定和管理。本文将提供使用该包的详细说明和示例代码。

    5 年前
  • npm 包 semotus 使用教程

    在前端开发中,我们经常需要处理复杂的表单验证逻辑。而 semotus 是一个简单、轻量的表单验证库,它可以帮助我们更加方便地管理表单验证,减少代码冗余,提高开发效率。

    5 年前
  • NPM 包 Persistor 使用教程

    在前端开发中,数据的存储与管理一直是一个关键的问题。为了更好的解决数据存储和管理的问题,我们可以使用一些优秀的 npm 包来帮助我们更好的实现数据的持久化和操作。 其中,Persistor 就是一个非...

    5 年前
  • npm 包 node-mandrill 使用教程

    node-mandrill 是一个 Node.js 的邮件发送库,可用于使用 Mandrill API 发送电子邮件。它旨在提供一个简单而直观的接口,以便您可以轻松地使用 Mandrill 发送电子邮...

    5 年前
  • npm 包 mongodb-bluebird 使用教程

    介绍 mongodb-bluebird 是一个基于 MongoDB 的 Node.js 驱动程序,它使用了 Bluebird 库来提供更好的异步回调支持。mongodb-bluebird 可以轻松的集...

    5 年前
  • npm 包 death 使用教程

    简介 death 是一个 Node.js 模块,用于在进程退出时执行一些代码。 它可以用于关闭数据库连接、清理临时文件、发送统计信息等等,它十分方便实用,能够提高代码的健壮性和可维护性。

    5 年前
  • npm 包 supertype 使用教程

    supertype 是一个前端 JavaScript 库,它主要用于数据模型类的创建和管理。如果你需要在你的项目中定义和使用复杂的数据模型,那么 supertype 将是一个很好的选择。

    5 年前
  • npm 包 mitos 使用教程

    前言 在前端开发中,我们经常会使用各种第三方库和插件来实现功能。而 npm 是一个广泛使用的包管理器,可以帮助我们方便地管理这些第三方库和插件。在本文中,我们将介绍一个名为 mitos 的 npm 包...

    5 年前
  • npm 包 postcss-css-variables 使用教程

    在前端开发中,CSS 是我们必须学习的一门技术。而 CSS 变量则是 CSS 中非常有趣且实用的一项技术。然而,CSS 变量在旧版本浏览器中兼容性不佳。因此,使用 postcss-css-variab...

    5 年前
  • npm 包 try-thread-sleep 使用教程

    简介 在开发前端应用的过程中,有时候需要延迟一段时间执行某些操作。JavaScript 本身并没有提供线程睡眠的方法,因此我们需要使用一些工具来解决这个问题。其中,npm 包 try-thread-s...

    5 年前

相关推荐

    暂无文章