ES6深入学习记录(二)promise对象相关
1.Promise的含义
Promise是异步编程的一种解决方案,比传统的解决方案--回调函数和事件更合理和强大。ES6将其写进了语言标准,统一了用法,原生提供了promise对象。
所谓Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步的操作)的结果。从语法上说,Pormise是一个对象,从它可以获取异步操作的消息。Promise提供统一的API。各种异步操作都可以用同样的方法进行处理。
Promise对象的两个特点:
1.对象的状态不受外界影响。Promise对象代表一个异步操作,有三种状态:
1.Pending (进行中)
2.Resolved (已完成)
3.Rejected (已失败)
只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态。这也是Promise这个名字的由来,它的英语意思就是“承诺”,表示其他手段无法改变。
2.一旦状态改变,就不会再变,任何时候都可以得到这个结果。Promise对象的状态改变,只有两种可能:从 Pending 变为 Resolved 和从 Pending 变为 Rejected。只要这两种情况发生,状态就不会再改变,会一直保持这个结果。就算改变已经发生,你再对Promise对象添加回调函数,也会立即得到这个结果。这与事件(Event)完全不同,事件的特点是,如果你错过了它,再去监听,是得不到结果的。
有了Promise对象,就可以将异步操作以同步操作的流程表达出来,避免了层层嵌套的回调函数。此外,Promise对象提供统一的接口,使得控制异步操作更加容易。
Promise的一些缺点:
1.无法取消Promise,一旦新建它就会立即执行,无法中途取消。
2.如果不设置回调函数,Promise内部抛出的错误,不会反应到外部。
3.当处于Pending(进行中)状态时,无法得知目前进展到哪一个阶段(刚开始还是即将完成)。
2. 基本用法
ES6规定,Promise对象是一个构造函数,用来生成Promise实例。
我们来下面的代码:
Promise构造函数接受一个函数作为参数,该函数的两个参数分别是resolve 和 reject。他们是两个由JavaScript引擎提供的函数。
resolve函数的用是,将Promise对象的状态从“未完成”变为“成功”,在异步操作成功时调用,并将异步操作的结果,作为参数传递出去;
reject函数的作用是,将Promise对象的状态从“未完成”变为“失败”,在异步操作失败的时调用,并将异步操作报出的错误,作为参数传递出去。
then方法制定状态的回调函数
Promise实例生成以后,可以用then方法分别制定Resolved状态和Reject状态的回调函数。
then方法可以接受两个回调函数作为参数。第一个回调函数是Promise对象的状态变为Resolved时调用(触发函数执行),第二个回调函数是Promise对象的状态变为Reject时调用。第二个函数是可选的,不一定要提供。这两个函数都接受Promise对象传出的值作为参数。
上面代码中,timeout方法返回一个Promise实例,表示一段时间后才会发生结果。过了指定的时间(ms参数)以后,Promise实例的状态变为Resolved,就会触发then方法绑定的回调函数。
Promise新建后就会立即执行!
上面代码中,Promise新建后立即执行,所以首先输出的是: "Promise"。然后,then方法指定的回调函数,将在当前脚本所有任务执行完后才会执行,所以"Resolved..."最后输出。
下面是异步加载图片的例子:
上面代码中,使用Promise包装了一个图片加载的异步操作。如果加载成功,就调用resolve方法,否则就调用reject方法。
下面是一个用Promise对象实现的Ajax操作的例子:
上面代码中,getJSON
是对XMLHttpRequest对象的封装,用于发出一个针对JSON数据的HTTP请求,并且返回一个Promise对象。需要注意的是,在getJSON
内部,resolve
函数和reject
函数调用时,都带有参数。
总结:Promise 是ES6的一个提供异步操作的新方法,其好处在于比回调函数更强大与合理,引入了Resolve和Reject两个概念及resolve和reject两个函数,Promise的亮点在于可以通过resolve和reject得知函数执行结果,还可以通过then方法设置执行完成与执行失败的回调函数,这样可以做到两个方面的好处: 1. 得知函数执行结果; 2. 可以根据执行结果执行相应的回调函数,减少了原有的编写成本。
ES6深入学习记录(二)promise对象相关的更多相关文章
- ES6深入学习记录(一)class方法相关
今天学习class相关的一些使用方法,着重在于class extends class之间可以通过extends关键字实现继承,这比ES5的通过修改原型链实现继承,要清晰和方便很多. 上面的代码定义了一 ...
- Material Calendar View 学习记录(二)
Material Calendar View 学习记录(二) github link: material-calendarview; 在学习记录一中简单翻译了该开源项目的README.md文档.接下来 ...
- Spring Boot学习记录(二)--thymeleaf模板 - CSDN博客
==他的博客应该不错,没有细看 Spring Boot学习记录(二)--thymeleaf模板 - CSDN博客 http://blog.csdn.net/u012706811/article/det ...
- JavaScript学习记录二
title: JavaScript学习记录二 toc: true date: 2018-09-13 10:14:53 --<JavaScript高级程序设计(第2版)>学习笔记 要多查阅M ...
- JavaScript:学习笔记(9)——Promise对象
JavaScript:学习笔记(9)——Promise对象 引入Promise Primose是异步编程的一种解决方案,比传统的解决方案回调函数和事件更加合理和强大.如下面为基于回调函数的Ajax操作 ...
- 2.VUE前端框架学习记录二
VUE前端框架学习记录二:Vue核心基础2(完结)文字信息没办法描述清楚,主要看编码实战里面,有附带有一个完整可用的Html页面,有需要的同学到脑图里面自取.脑图地址http://naotu.baid ...
- Activiti学习记录(二)
1.初始化数据库 使用工作流引擎创建23张表 public class TestActiviti { /** * 使用代码创建工作流需要的23张表 */ @Test public void creat ...
- ES6深入学习记录(三)编程风格
今天学习阮一峰ES6编程风格,其中探讨了如何将ES6的新语法,运用到编码实践之中,与传统的JavaScript语法结合在一起,写出合理的.易于阅读和维护的代码. 1.块级作用域 (1)let 取代 v ...
- Redis学习之二 数据类型和相关命令
原文:https://www.cnblogs.com/lonelyxmas/p/9073928.html 如果还不懂安装的,请看 Windows环境下安装Redis Redis一共支持五种数据类型 1 ...
随机推荐
- ASP.NET MVC——CodeFirst开发模式
Entity Framework框架提供了几种开发模式,比如Database First,Model First,Code First.Database First是最老也是应用得最广泛的一种设计方式 ...
- C#开发微信门户及应用(30)--消息的群发处理和预览功能
在很多场合下,我们可能需要利用微信公众号的优势,定期给指定用户群发送一些推广消息或者新闻内容,以便给关注客户一种经常更新公众号内容的感觉,同时也方便我们经常和用户进行互动.微信公众号的高级群发接口就是 ...
- Python ZIP 文件创建与读取
Automate the Boring Stuff 学习笔记 02 Python 内置的 zipfile 模块可以对文件(夹)进行ZIP格式的压缩和读取操作.要进行相关操作,首先需要实例化一个 Zip ...
- php实现设计模式之 模板方法模式
<?php /** * 模板模式 * * 定义一个操作中的算法骨架,而将一些步骤延迟到子类中,使得子类可以不改变一个算法的结构可以定义该算法的某些特定步骤 * */ abstract class ...
- 微信小程序
最近在看微信小程序边看边写demo,整体目录结构是一:app.js,app.json,app.wxss这三个文件必须是放在根目录下,二.一个小程序有多个页面组成,其中每个页面的结构是:page.js, ...
- 深入理解javascript选择器API系列第一篇——4种元素选择器
× 目录 [1]id属性 [2]标签名 [3]name属性[4]all 前面的话 说到最常见的DOM应用,恐怕就要数取得特定的某个或某组元素的引用了.DOM定义了许多方式来选取元素,包括getElem ...
- CentOS7安装NodeJS6.9
1.下载 wget https://nodejs.org/dist/v6.9.2/node-v6.9.2-linux-x64.tar.xz 2.解压 tar -xJf node-v6.9.2-linu ...
- 原创炫酷代码公开——连接董铂然github
公开了github部分项目(均为原创)更多代码请看https://github.com/dsxNiubility SXWaveAnimate Wonderful SXPhotoShow SXNews ...
- 记一次git amend事故处理方案
一.问题回顾 问题是git commit --amend 引起的. 一条commit已经push到远端develop了,但是后来又在这条commit上进行了amend操作,导致这条commit的哈希码 ...
- Java和PHP哪个方向更有前途?
Java和PHP到底哪个方向更有前途呢?我从网络上收集了很多资料,并在这篇文章中做了总结. 1.TIOBE语言排行榜 Apr 2014 Apr 2013 Change Programming ...