Promise对象的使用方法

最新推荐文章于 2023-09-08 08:41:37 发布
最新推荐文章于 2023-09-08 08:41:37 发布
阅读量189 收藏
点赞数
文章标签： javascript ViewUI
原文链接：http://www.cnblogs.com/XieYFwin/p/10850037.html
版权 
  1 <!DOCTYPE html>
  2 <html lang="en">
  3 <head>
  4     <meta charset="UTF-8">
  5     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6     <meta http-equiv="X-UA-Compatible" content="ie=edge">
  7     <title>Document</title>
  8 </head>
  9 <body>
 10     
 11 </body>
 12 </html>
 13 <script>
 14     //异步执行的代码
 15     setTimeout(function(){
 16         console.log(1);
 17     },1000);
 18     setTimeout(function(){
 19         console.log(2);
 20     },1000);
 21     setTimeout(function(){
 22         console.log(3);
 23     },1000);                //经过一秒1,2,3,同时打印出来了
 24 //以下方法可以实现异步代码的同步执行:
 25 /*
 26     1、promise有1个参数，是一个回调函数fn
 27     2、回调函数有2个参数：resolve,reject;
 28     4: new Promise 的返回值是一个promise
 29     5: promise 有  then  catch  all  race   方法{链式方法：promise.then().catch()};
 30 */
 31 //生成一个Promise对象，将俩个异步代码同步执行(主要使用then方法)
 32     new Promise(function(resolve,reject){  
 33         setTimeout(function(){
 34             console.log(1);
 35             resolve();    //执行resolve方法，配合then执行
 36         },1000);
 37     }).then(function(){
 38         setTimeout(function(){
 39             console.log(2);   
 40         },1000);
 41     })                    //至此 ， 1和2 是每过一秒分别打印出来的;
 42 //生成一个Promise对象，将多个异步代码同步执行
 43     new Promise(function(resolve,reject){  
 44             setTimeout(function(){
 45                 console.log(1);
 46                 resolve();    //执行resolve方法，配合then执行
 47             },1000);
 48         }).then(function(){
 49             return new Promise(function(resolve,reject){
 50                 setTimeout(function(){
 51                     console.log(2);  
 52                     resolve();
 53                 },1000);
 54             }) 
 55         }).then(function(){
 56                 setTimeout(function(){
 57                     console.log(3);   
 58                 },1000);
 59         })            //如此多次使用Promise方法,即可实现多个异步代码同步执行
 60 // 注:resolve方法是可以传参的     then内的回调函数可以接收resolve传来的参数 
 61     new Promise(function(resolve,reject){  
 62             setTimeout(function(){
 63                 var a = 1;
 64                 resolve(a);    
 65             },1000);
 66         }).then(function(b){
 67             setTimeout(function(){
 68                 console.log(b);             //2秒后打印出来 1;
 69             },1000);
 70         });
 71 catch方法的使用方法
 72     new Promise(function(resolve,reject){  
 73                 setTimeout(function(){
 74                     reject();    
 75                 },1000);
 76             }).catch(function(){
 77                 setTimeout(function(){
 78                     console.log(1);          //2秒后打印出来 1;
 79                 },1000);
 80             });    
 81     //说明：若resolve()执行，则执行then();若reject()执行，则执行catch();     
 82 //all方法的使用：所有的方法都进行完毕才执行；
 83     var p1 = new Promise(function(resolve,reject){
 84         setTimeout(function(){
 85             resolve(1);
 86         },1000)
 87     });  
 88     var p2 = new Promise(function(resolve,reject){
 89         setTimeout(function(){  
 90             resolve(2);
 91         },2000)
 92     });  
 93     Promise.all([p1,p2]).then(function(data){
 94         console.log(data);               //2 秒过后才打印出所有的数据:[1,2];
 95     })      
 96     //注：all方法接收的参数必须是数组，结合then和catch使用； 
 97 //race方法的使用，返回最先执行完毕的方法的返回值；
 98     var p1 = new Promise(function(resolve,reject){
 99             setTimeout(function(){
100                 resolve(1);
101             },1000)
102         });  
103         var p2 = new Promise(function(resolve,reject){
104             setTimeout(function(){  
105                 resolve(2);
106             },2000)
107         });  
108         Promise.race([p1,p2]).then(function(data){
109             console.log(data);               //1秒过后才打印出先执行完毕的数据:1;
110         })  
111 </script>
注：JavaScript异步执行的有计时器（setInterval,setTimeout）,各种事件，ajax；可以使用Promise使异步代码同步执行；

 

转载于:https://www.cnblogs.com/XieYFwin/p/10850037.html

L_18351008194
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
详解ES6 Promise对象then方法链式调用
12-10
then()方法会返回一个新的Promise实例，所以then()方法后面可以继续跟另一个then()方法进行链式调用。 let p = new Promise((resolve, reject) => { setTimeout(resolve, 1000, 'success'); }); p.the
13.Promise 对象
awkticu3808的博客
01-16 428
Promise 对象Promise 对象Promise 的含义Promise 是异步编程的一种解决方案，比传统的解决方案——回调函数和事件——更合理和更强大。它由社区最早提出和实现，ES6 将其写进了语言标准，统一了用法，原生提供了Promise对象。所谓Promise，简单说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果。从语法上说，Promise 是一个对...
Promise对象的含义和基本用法
lizeju的博客
05-22 327
1.Promise的含义Promise是异步编程的一种解决方案，比传统的解决方案（回调函数和事件）更合理更强大。所谓Promise，简单说就是一个容器，里面保存着某个未来才会结束的事件 (通常是一个异步操作)的结果。从语法上说，Promise是一个对象，从它可以获取异步操作的消息。Promise对象有以下2个特点： 1.对象的状态不受外界影响。Promise对象代表一个异步操作，有三种状态：Pen
Promise对象的使用
热门推荐
诗水人间
07-15 10万+
Promise对象也称链式调用，如果有一组数据需要先查询到另一组数据，然后通过这组数据再获取最终想要的数据。 例如封装axios 创建一个ajaxUtil.js文件 import axios from 'axios' /* html页面,则在引入ajaxUtil.js前通过<script>引入axios <script src="https://unpkg.com/axios/dist/axios.min.js"></script> */ function ajax
Promise对象及其作用
weixin_42680298的博客
04-24 1912
在Javascript中，所有的代码都是单线程的。因此，导致Javascript中所有的网络操作（网络请求），浏览器事件都是通过异步执行。 > 浏览器只分配给js一个主线程，用来执行任务（函数），但一次只能执行一个任务，这些任务形成一个任务队列排队等候执行，但前端的某些任务是非常耗时的，比如网络请求，定时器和事件监听，如果让他们和别的任务一样，都老老实实的排队等待执行的话，执行效率会非常的低...
Promise对象解析及其用法
SummerJX的博客
08-30 1万+
Promise Promise的含义 Promise是异步编程的一种解决方案，比传统的解决方案----回调函数和事件----更合理且更强大。所谓的Promise，简单来说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个一步操作）的结果。从语法上来说，promise是一个对象，从他可以获取异步操作的消息。Promise提供统一的API，各种异步操作都可以用同种的方法进行处理。有了Pro...
node.js Promise对象的使用方法实例分析
12-23
本文实例讲述了node.js Promise对象的使用方法。分享给大家供大家参考，具体如下： Promise对象是干嘛用的？ 将异步操作以同步操作的流程表达出来 一、Promise对象的定义 let flag = true; const hello = new ...
javascript使用Promise对象实现异步编程
10-22
主要介绍了javascript使用Promise对象实现异步编程的相关资料,需要的朋友可以参考下
JavaScript promise对象
08-31
JavaScript promise对象
[ES6] 细化ES6之 -- Promise对象
DeathDomain的博客
10-28 209
Promise对象是什么 Promise对象是什么 ES6新增了Prormnise对象，该对象允许对延迟和异步操作流程进行控制。一个Promise对象就是一个代表了异步操作最终完成或者失败的对象。 开发人员可以使用由其他函数创建并返回的Promise 对象。Promise对象本质上就是一个绑定了回调的对象，而不是将回调传进函数内部。 一个Promise有以下几种状态: pending:初始状态，既不是成功，也不是失败状态。 fulfilled:意味着操作成功完成。 rejected:意味着操作失败。 &
promise对象使用介绍
weixin_65100963的博客
04-30 2603
Promise 它是一个ES6提出一个新语法，用来优化异步代码的写法。 promise：承诺 ● 生活中，它是用来表述 对将来要发生的事情的肯定。 例如 ： 高中生说，老师，我会考上一所好大学的；销售员说，老板，我一定会签下大单的；程序员说，老妈，我过年一定会带个女朋友回来的。 ● 在ES6中，它是新增的构造器（Array, Object, Promise），用来优化实现异步操作。在没有它之前，javascript中的异步处理，大多是利用回调函数来实现的。典型的几种如下:（1）setTimeout （2）a
Promise对象探究
VitaLemon__的专栏
08-15 670
一、简介 Promises对象是CommonJS工作组提出的一种规范，目的是为异步编程提供统一接口。 以上定义引自阮一峰《Javascript异步编程的4种方法》。我的简单理解是，Promise是JavaScript异步回调的解决方案之一，最大的优点是以链式调用的方式来消除Callback Hell的问题。二、用法1、运用一个Promise对象可以总结成两个步骤： 异步。决定回调的时机（when
如何使用Promise对象
Y_one的博客
12-11 327
一、为什么要Promise对象的？ 大量的异步操作，如果要按顺序执行，通过回调函数执行的方式，就会造成回调地狱。 二、 解决方法 通过Promise解决回调地狱，然后形成链式调用 ，一组链式调用只需要一个catch,但多个也可以 function test(){ //返回Promise return new Promise((resolve,reject)=>{ //异步处理 成功执行resolve 失败执行reject }
JS中Promise对象及其使用方式
官方推荐
09-08 1万+
JS中Promise对象及其使用方式
如何使用ES6中的Promise对象
m0_75198698的博客
04-24 162
可以使用 Promise.race 方法，该方法接收一个 Promise 对象数组作为参数，返回一个新的 Promise 对象，当其中一个 Promise 对象执行完成时，该 Promise 对象会执行 resolve 或 reject 回调函数。可以使用 Promise.all 方法，该方法接收一个 Promise 对象数组作为参数，返回一个新的 Promise 对象，当所有 Promise 对象都执行完成时，该 Promise 对象会执行 resolve 回调函数。
Promise 对象的处理
yizhizhazhahui的博客
03-31 1202
Promise 对象的处理
promise对象的简单用法
badmoonc的博客
09-22 482
promise对象是es6中提出的解决异步回调的一种方案，作为一个新手，最近刚刚把这个玩意给弄明白些。来写这篇文章，希望能得到一些高人的指点，同时我也觉得对于新手不了解promise的朋友们会有一些帮助。 废话不多说，关于介绍promise的话不多说了，有同学不明白的可以自行百度，本文只写一个promise的简单实例，相信稍微看过一些promise的朋友，但是对他又比较畏惧的(因为之前我不懂这个
Promise 对象使用
最新发布
09-27
Promise对象的使用方法如下： 1. 创建一个Promise对象：使用new关键字和Promise构造函数来创建一个Promise对象。构造函数接受一个函数作为参数，该函数包含两个参数resolve和reject，分别是成功和失败时的回调函数。...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值