×

你不知道的秘密:JS之promise应用汇总

作者:admin2019.04.25来源:Web前端之家浏览:1763评论:2
关键词:jspromise
微信公众号

微信公众号

500.jpg

众所周知,promise在项目开发中经常会用到,因为它可以帮助我们优化代码的结构,使得代码更加简洁,并且便于后期维护,虽然有一些弊处,不过总的来说,利大于弊。

今天这里分享几点关于promise的一些基本知识和应用,一起来了解下吧。

promise 有几种状态, Promise 有什么优缺点 ?

promise有三种状态: fulfilled, rejected, pending。

Promise 的优点:

一旦状态改变,就不会再变,任何时候都可以得到这个结果

可以将异步操作以同步操作的流程表达出来,避免了层层嵌套的回调函数

Promise 的缺点:

无法取消 Promise

当处于pending状态时,无法得知目前进展到哪一个阶段

Promise构造函数是同步还是异步执行,then中的方法呢 ?promise如何实现then处理 ?

Promise的构造函数是同步执行的。then 中的方法是异步执行的。

promise的then实现。

Promise和setTimeout的区别 ?

Promise 是微任务,setTimeout 是宏任务,同一个事件循环中,promise.then总是先于 setTimeout 执行。

如何实现 Promise.all ?

要实现 Promise.all,首先我们需要知道 Promise.all 的功能:

如果传入的参数是一个空的可迭代对象,那么此promise对象回调完成(resolve),只有此情况,是同步执行的,其它都是异步返回的。

如果传入的参数不包含任何 promise,则返回一个异步完成.

promises 中所有的promise都“完成”时或参数中不包含 promise 时回调完成。

如果参数中有一个promise失败,那么Promise.all返回的promise对象失败

在任何情况下,Promise.all 返回的 promise 的完成状态的结果都是一个数组

Promise.all = function (promises) {
    return new Promise((resolve, reject) => {
        let index = 0;
        let result = [];
        if (promises.length === 0) {
            resolve(result);
        } else {
            function processValue(i, data) {
                result[i] = data;
                if (++index === promises.length) {
                    resolve(result);
                }
            }
            for (let i = 0; i < promises.length; i++) {
                //promises[i] 可能是普通值
                Promise.resolve(promises[i]).then((data) => {
                    processValue(i, data);
                }, (err) => {
                    reject(err);
                    return;
                });
            }
        }
    });
}

如何实现 Promise.finally ?

不管成功还是失败,都会走到finally中,并且finally之后,还可以继续then。并且会将值原封不动的传递给后面的then。

Promise.prototype.finally = function (callback) {
    return this.then((value) => {
        return Promise.resolve(callback()).then(() => {
            return value;
        });
    }, (err) => {
        return Promise.resolve(callback()).then(() => {
            throw err;
        });
    });
}

总结

promise还有很多其他应用,以上内容仅供参考,希望能帮助到大家。如果有问题,可以加群讨论。

温馨提示:本文作者系admin ,经Web前端之家编辑修改或补充,转载请注明出处和本文链接:
https://www.jiangweishan.com/article/promise20190425.html

网友评论文明上网理性发言 已有2人参与

发表评论:

评论列表

  • js666  发布于 2019-04-25 14:35:26   回复该评论
  • promise很强大,可以干好多事情。。。

最新留言

  • 老部落运维

    都是拼音的错呵呵...

  • admin

    已加上,麻烦把我的文字改下:Web前端之家...

  • 老部落运维

    已添加贵站链接我站:https://www.laobuluo.com/(老部落运维)...

  • admin

    这个问题需要看不同的终端预览,可以加群具体聊,谢谢!...

  • 竹叶轻拂水

    在写PC端页面的时候,字体超过16px有的字体会显示的上下不一,凸出来一点,很难看,有没有什么好的方...

  • 素材火

    前三意料之中,中国只有百度上榜...

  • 开创者素材

    网站资源下载站,交换个友链如何?www.kaicz.com...

  • CSS66

    关于CSS组合选择符总结得全面,学习了!...

首页|JavaScript|HTML|HTML4|HTML5|CSS3|开发工具|性能优化|移动开发|前端教程|性能优化|开发工具|酷站欣赏|UI设计|前端教程

Copyright © 2019 Web前端之家(www.jiangweishan.com) 版权所有 All Rights Reserved.
粤ICP备12067512号-1

Copyright Your WebSite.Some Rights Reserved.

Powered By Z-BlogPHP 1.5.2 Zero