ES6 Promise 用法

最新推荐文章于 2022-12-30 16:24:01 发布
最新推荐文章于 2022-12-30 16:24:01 发布
阅读量112 收藏
点赞数
分类专栏： ES6
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/liubangbo/article/details/95042821
版权

ES6中的Promise 用法有点难理解，做个demo： 

<!DOCTYPE html>
<html>
<head>

<title>test</title>


<style>
    
</style>

</head>

<body>

<script>
    
    function asyn1(para) {
        return new Promise(function (resolve, reject) {
            setTimeout(function () {
                para >=0 ? resolve(para) : reject(para);
            }, 2000);
        });
    }

    function asyn2(para) {
        return new Promise(function (resolve, reject) {
            setTimeout(function () {
                para >=0 ? resolve(para) : reject(para);
            }, 5000);
        });
    }

    asyn1(-1).then(function (retVal) {
        console.log("asyn1 resolve : " + retVal);
        return asyn2(1);
    }).catch(function (retVal) {
        console.log("asyn1 reject : " + retVal);
        return asyn2(1);
    }).then(function (retVal) {
        console.log("asyn2 resolve : " + retVal);
    }).catch(function (retVal) {
        console.log("asyn2 reject : " + retVal);
        return asyn2(1);
    })

    // Promise.all([asyn1(-1), asyn2(2)]).then(function (retVal) {
    //     console.log("promise all resolve: " + retVal);
    // }).catch(function (retVal) {
    //     console.log("promise all reject: " + retVal);
    // });

    // Promise.race([asyn2(1), asyn1(2)]).then(function (retVal) {
    //     console.log("promise all resolve: " + retVal);
    // }).catch(function (retVal) {
    //     console.log("promise all reject: " + retVal);
    // })

</script>

</body>
</html>

 

从用法中我们可以看到Promise 其实是一个构造函数， 这个构造函数要传一个函数类型的参数。在new Promise的时候 这个函数类型的参数就会执行。 

 

其实需要实现这个Promise  这样就理解的比较到位了。 

夜跑者
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
ES6 Promise用法小结
涂涂
07-25 38万+
目录 1.什么是Promise reject的用法 catch的用法 all的用法 race的用法 1.什么是Promise Promise 是异步编程的一种解决方案，其实是一个构造函数，自己身上有all、reject、resolve这几个方法，原型上有then、catch等方法。 Promise对象有以下两个特点。 （1）对象的状态不受外界影响。Promise对象代表一个异步操...
浅谈ES6的 promise API
iongzhidun1的博客
05-20 2481
原文地址： http://www.2ality.com/2014/10/es6-promises-api.html     原文作者：Dr. Axel Rauschmayer     博文下半部分为纯干活内容，包括介绍的 ES6 中 Promise API，以及其简单的实现方式与思想，以及一些拓展内容。 9. 速查表：ES6的 promise API
前端js进阶之ES6 Promise(承诺)用法小结笔记、详细解释（resolve，catch，catch）历史最通俗易懂的承诺
南北极之间
03-23 3590
前端js进阶之ES6 Promise(承诺)用法小结笔记、详细解释（resolve，catch，catch）历史最通俗易懂的承诺！！！
ES6的promise对象研究
weixin_34290000的博客
08-30 507
ES6的promise对象研究 什么叫promise？      Promise对象可以理解为一次执行的异步操作，使用promise对象之后可以使用一种链式调用的方式来组织代码；让代码更加的直观。 那我们为什么要使用promise？ 比如我们在工作中经常会碰到这么一个需求，比如我使用ajax发一个A请求后，成功后拿到数据，我们需要把数据传给B请求；那么我们需要如下编写代码： $....
es6之promise被坑记
热门推荐
u013628992的专栏
02-18 2万+
怒了，新浪微博也太坑了，代码片段太麻烦了。promise的介绍就不多说了。 几个网址： http://es6.ruanyifeng.com/#docs/promise http://www.html5rocks.com/zh/tutorials/es6/promises/ https://developer.mozilla.org/en-US/docs/Web/JavaScript/Refe
ES6 Promise用法async,await大总结
m0_62496369的博客
10-29 425
一旦发现代码或者系统有错误，就会直接报出错误的原因import thenFs from 'then-fs' // 通过return返回一个新的Promise实例对象，因为Promise中有.then就会执行下句代码 // .then() 方法的链式调用 thenFs . readFile('./1.txt' , 'utf8') . then((r1) => {
深入理解ES6 Promise 扩展always方法
08-29
本篇文章主要介绍了ES6 Promise 扩展always方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
ES6中Promise的使用方法实例总结
10-15
主要介绍了ES6中Promise的使用方法,结合实例形式总结分析了Promise对象中的各种常用方法及基本使用技巧,需要的朋友可以参考下
promise:ES6 Promise Polyfill
05-23
安装$ npm install [--save] promise-es6用法 // Load for use in this one place ...var Promise = require ( 'promise-es6' ) . Promise ;// ... or make a global polyfill (not really recomended good practice...
ES6 Promise对象概念与用法分析
12-10
本文实例讲述了ES6 Promise对象概念与用法。分享给大家供大家参考，具体如下： 1.Promise概念 Promise 对象有三种状态： ① Fulfilled 可以理解为成功的状态 ② Rejected 可以理解为失败的状态 ③ Pending 既不是 ...
大白话讲解Promise（一）
aigenglong0649的博客
03-11 1万+
去年6月份， ES2015正式发布（也就是ES6，ES6是它的乳名），其中Promise被列为正式规范。作为ES6中最重要的特性之一，我们有必要掌握并理解透彻。本文将由浅到深，讲解Promise的基本概念与使用方法。 ES6 Promise 先拉出来遛遛 复杂的概念先不讲，我们先简单粗暴地把Promise用一下，有个直观感受。那么第一个问题来了，Promise是什么玩意呢？...
es6中Promise的理解以及使用
qq_35430000的博客
01-24 2171
转载：https://www.zcfy.cc/article/javascript-promises-for-dummies-scotch-1961.html 理解 Promise Promise 简介: "假设你是一个宝宝. 你的妈妈承诺（Promise）你，下个礼拜她会给你一台新手机。" 你不知道，下个礼拜你是否会拿到手机。你的妈妈可以真的给你买一个全新的手机，或者放你鸽子，也有可能如...
ES6之Promise实战，让你的多次请求更清晰
lovoo的博客
06-12 576
前言 在实际开发中，我们经常会在发送一个请求后，得到反馈，再进行一下次请求，再得到反馈，又再进行下一次请求，每次的代码都在ajax内部的success实现，这样看起来繁琐，容易造成数据通信堵塞。如何解决这个问题呢？这时我们就可以利用Promise来解决！ 在开始深入学习Promise前，熟悉JS Event Loop的机制是非常有必要的，如果你对Event Loop还不熟悉，非常推荐你先阅读JavaScript之多线程和Event Loop这篇文章，会对你更好理解Promise执行顺序帮助很大！ 什么是Pr
ES6 数组 some, every用法
liubangbo的专栏
10-22 5665
ES6 数组提供了some和every方法 some表示只有一个满足条件就返回true，every则表示只有全部满足条件才会返回true。简单例子如下： ​ <html> <head> <style type="text/css"> </style> </head> <body> <script> let arr = [ { name: 'xiaoliu', age: 18
ES6 数组map用法
liubangbo的专栏
11-13 2550
有一个这样的需求：有一个数组，数组里面是一些对象，现在要把对象中的一部分字段拷贝出来，并组成一个新数组。 用ES6 提供的新特性map很容易实现。 例子如下： var teachers = [{ id : 1, name: "zhang", sex: "man" }, { id : 2, name: "liu", sex: "man" }]; ...
Object.keys(obj)
liubangbo的专栏
12-24 1779
Object.keys(obj) Object.keys返回一个所有元素为字符串的数组，其元素来自于从给定的object上面可直接枚举的属性。这些属性的顺序与手动遍历该对象属性时的一致。 var arr1 = ["zhang", "wang", "li", "zhao", "liu"]; var keys = Object.keys(arr1); console.log("ar...
Promise 中的异步错误 怎么捕获
liubangbo的专栏
12-30 1561
在obj.abc.status这里会出现引用错误，因为是同步错误，可以被catch捕获。我们在看下，在Promise中异步产生的错误能否被catch捕获？怎么让catch能捕获到呢？用对异步代码加try catch ，然后把错误reject出去，这样就可以捕获到异步代码里面的错误了。大家可以执行一下，catch并没有捕获到引用错误。原因就是错误是异步的，catch捕获不到。
ES6 数组 filter， find， findIndex 用法
liubangbo的专栏
11-22 521
filter 用来过滤满足条件的值， 这些值新组成一个新数组并返回，原数组并不改变。filter参数是个回调函数，在回调函数里面写满足的条件。 find 用来在数组中查找一个是否满足条件的值，如果找到立即返回这个值，不再继续查找。find的参数也是一个回调函数，在函数里面写满足的条件。 findIndex 和 find 类似，只是返回的是满足条件值的下标。 我们通过例子看看怎么使用的： ...
ES6 reduce方法来对对象数组去重
liubangbo的专栏
12-14 489
示例代码如下： <html> <head> <style type="text/css"> </style> </head> <body> <script> var arr = [{ "name" : "xiao liu", "age" : 20, "sex" : "ma...
es6promise的用法
最新发布
04-28
下面是 Promise 的用法： // 创建 Promise 对象 let promise = new Promise(function(resolve, reject) { // 异步操作 // 通过 resolve 或 reject 来将 Promise 对象的状态变成已完成或已失败 }); // Promise ...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值