Promise对象解读
首先强调的是“Promise”是对象,也就是说与其他JavaScript对象的用法,没有什么两样;其次,它起到代理作用(proxy),充当异步操作与回调函数之间的中介。它使得异步操作具备同步操作的接口,使得程序具备正常的同步运行的流程,回调函数不必再一层层嵌套。
Promise 对象是 CommonJS 工作组提出的一种规范,目的是为异步操作提供统一接口,简单说,它的思想是,每一个异步任务立刻返回一个Promise对象,由于是立刻返回,所以可以采用同步操作的流程。这个Promises对象有一个then方法,允许指定回调函数,在异步任务完成后调用。
前文说了Promise对象提供异步操作接口,简而言之就是:执行异步任务时返回一个Promise对象,并且Promise对象只有三种状态:
{
1.异步操作“未完成”(pending)
2.异步操作“已完成”(resolved,又称fulfilled)
3.异步操作“失败”(rejected)
}
三种状态的转换只有两种途径: 异步操作从“未完成”到“已完成” => 异步操作从“未完成”到“失败”。所以这种变化只能发生一次,一旦当前状态变为“已完成”或“失败”,就意味着不会再有新的状态变化了。因此,Promise对象的最终结果只有两种:{
- 异步操作成功,Promise对象传回一个值,状态变为
resolved。 - 异步操作失败,Promise对象抛出一个错误,状态变为
rejected。
}
Promise对象使用then方法添加回调函数。then方法可以接受两个回调函数,第一个是异步操作成功时(变为resolved状态)时的回调函数,第二个是异步操作失败(变为rejected)时的回调函数(可以省略)。一旦状态改变,就调用相应的回调函数。
那么promise对象是怎么生成的呢?
其实ES6提供了原生的Promise构造函数,用来生成Promise实例。下面代码创造了一个Promise实例。(跟声明对象new一样的方式)
var promise = new Promise(function(resolve, reject) {
// 异步操作的代码
if (/* 异步操作成功 */){
resolve(value);
} else {
reject(error);
}
});
resolve函数的作用是,将Promise对象的状态从“未完成”变为“成功”(即从Pending变为Resolved),在异步操作成功时调用,并将异步操作的结果,作为参数传递出去;reject函数的作用是,将Promise对象的状态从“未完成”变为“失败”(即从Pending变为Rejected),在异步操作失败时调用,并将异步操作报出的错误,作为参数传递出去。
Promise实例生成以后,可以用then方法分别指定Resolved状态和Reject状态的回调函数。
po.then(function(value) {
// success
}, function(value) {
// failure
});
Promise 封装的代码肯定是同步的, 那么这个 then 的执行是异步的吗? 可以通过以下这个有意思的小例子可以知道Promise对象的执行顺序
setTimeout(function() {
console.log(1)
}, 0);
new Promise(function executor(resolve) {
console.log(2);
for( var i=0 ; i<10000 ; i++ ) {
i == 9999 && resolve();
}
console.log(3);
}).then(function() {
console.log(4);
});
console.log(5);
==》》2 3 5 4 1
以上是我看一篇博文里的一段代码(出自),可以参考一下奥
Promise对象解读的更多相关文章
- 深入解读Promise对象
promise对象初印象: promise对象是异步编程的一种解决方案,传统的方法有回调函数和事件,promise对象是一个容器,保存着未来才会结束的事件的结果 promise对象有两个特点: 1.p ...
- angular学习笔记(二十八-附2)-$http,$resource中的promise对象
下面这种promise的用法,我从第一篇$http笔记到$resource笔记中,一直都有用到: HttpREST.factory('cardResource',function($resource) ...
- ES6深入学习记录(二)promise对象相关
1.Promise的含义 Promise是异步编程的一种解决方案,比传统的解决方案--回调函数和事件更合理和强大.ES6将其写进了语言标准,统一了用法,原生提供了promise对象. 所谓Promis ...
- es6中的promise对象
Promise是异步里面的一种解决方案,解决了回调嵌套的问题,es6将其进行了语言标准,同意了用法,提供了`promise`对象, promise对象有三种状态:pending(进行中) .Resol ...
- ES6的promise对象应该这样用
ES6修补了一位Js修真者诸多的遗憾. 曾几何时,我这个小白从js非阻塞特性的坑中爬出来,当我经历了一些回调丑陋的写法和优化的尝试之后,我深深觉得js对于多线程阻塞式的开发语言而言,可能有着其太明显的 ...
- Angularjs promise对象解析
1.先来看一段Demo,看完这个demo你可以思考下如果使用$.ajax如何处理同样的逻辑,使用ng的promise有何优势? var ngApp=angular.module('ngApp',[]) ...
- JavaScript异步编程(1)- ECMAScript 6的Promise对象
JavaScript的Callback机制深入人心.而ECMAScript的世界同样充斥的各种异步操作(异步IO.setTimeout等).异步和Callback的搭载很容易就衍生"回调金字 ...
- Promise对象
1.Promise思想:每一个异步任务立刻返回一个Promise对象,由于是立刻返回,所以可以采用同步操作的流程.这个Promises对象有一个then方法,允许指定回调函数,在异步任务完成后调用. ...
- angularJS中的Promise对象($q)的深入理解
原文链接:a better way to learn AngularJS - promises AngularJS通过内置的$q服务提供Promise编程模式.通过将异步函数注册到promise对象, ...
随机推荐
- 201521123015 《Java程序设计》第9周学习总结
1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结异常相关内容. 2. 书面作业 本次PTA作业题集异常 1.常用异常 题目5-1 1.1 截图你的提交结果(出现学号) 1.2 自己 ...
- Eclipse rap 富客户端开发总结(14) :rap 图片、数据缓存处理
一.概述 在进行了 rap 的基本学习之后,您对 rap 的理解是否进入了更高的一个层次呢,个人觉得,对学习 rap 的人来说,进行 rap 的学习是一个探索的过程,在编程中不断的对其进行理解和分析, ...
- 巧用 BootStrap --- 栅格系统(布局)轻松搞定网页响应式布局!
摘要:Bootstrap 为我们提供了一套响应式.移动设备优先的流式栅格系统,合理的使用栅格系统将会使得网站页面布局变得更加简单,在设置了媒体查询之后,响应式网站也无需再单独写了.接下来我以Boots ...
- Hibernate由model类自动同步数据库表结构
在开发中遇到了个问题,每次测试数据库增加表结构的时候,本地pull下最新代码导致启动报错,上网搜了快速解决办法---->hibernate 配置属性中,hibernate.hbm2ddl.aut ...
- 【二】刚学Python的几道简单练习题
python交友娱乐会所:613176398 1.使用while循环输入 1 2 3 4 5 6 8 9 10 2.求1-100的所有数的和 3.输出 1-100 内的所有奇数 4.输出 1- ...
- Azure ARM (16) 基于角色的访问控制 (Role Based Access Control, RBAC) - 使用默认的Role
<Windows Azure Platform 系列文章目录> 今天上午刚刚和客户沟通过,趁热打铁写一篇Blog. 熟悉Microsoft Azure平台的读者都知道,在老的Classic ...
- SQL Server 2016 Alwayson新增功能
标签:SQL SERVER/MSSQL SERVER/数据库/DBA/ 概述 SQLServer2016发布版本到现在已有一年多的时间了,目前最新的稳定版本是SP1版本.接下来就开看看2016在Alw ...
- 我的Spring学习记录(三)
学习了AOP之后就可以应用一下了,所以这次我们了解一下Spring的声明式事务. 事务在我们的很多方面都可以体现,就拿我们平时的买卖活动,或者是银行的转账来说,这些活动要么是成功,要么是失败,比如:张 ...
- C语言 printf 格式化输出函数
用 法: int printf(const char *format,[argument]); format 参数输出的格式,定义格式为: %[flags][width][.perc] [F|N|h| ...
- 关于select的一个错误---属性选择器
错误: jquery 获取下拉框 text='1'的 option 的value 属性值 我写的var t= $("#selectID option[text='1']).val() ; ...