【ES6】Promise

一、概述

Promise是ES6引入的异步编程的新解决方案。语法上Promise是一个构造函数，用来封装异步操作并可以获取其成功或失败的结果。

解读：

（1）当在setTimeout中使用resolve（）方法的时候，会调用p.then方法中的第一个回调函数；

（2）当在setTimeout中使用reject（）方法的时候，会调用p.then方法中的第二个回调函数；

二、应用实例

1、使用Promise封装读取.md后缀的文件

2、使用Promise封装Ajax请求

3、Promise.prototype.then（）方法

（1）返回值为一个Promise对象

以上代码的输出结果为：

4、 Promise实现多个文件的读取

// 引入 Node.js 的 fs 模块
const fs = require("fs");// 利用Promise实现多个文件的读取
const p = new Promise((resolve, reject) => {fs.readFile("./sources/鹅鹅鹅.md", (err, data) => {resolve(data);});
});// 指定回调
p.then((value) => {return new Promise((resolve, reject) => {fs.readFile("./sources/悯农.md", (err, data) => {resolve([value, data]);});});
}).then((value) => {return new Promise((resolve, reject) => {fs.readFile("./sources/小池.md", (err, data) => {value.push(data);resolve(value);});});}).then((value) => {console.log(value.join("\r\n"));});

好处：可以避免回调地狱，与以下普通实现进行对比：

// 引入 Node.js 的 fs 模块
const fs = require("fs");// 普通实现 -- 回调地狱
fs.readFile("./sources/鹅鹅鹅.md", (err, data1) => {fs.readFile("./sources/悯农.md", (err, data2) => {fs.readFile("./sources/小池.md", (err, data3) => {let result = data1 + "\r\n" + data2 + "\r\n" + data3;console.log(result);});});
});

结果：

5、Promise.prototype.catch（）方法

用来指定Promise对象失败的回调

      const p = new Promise((resolve, reject) => {setTimeout(() => {// 设置 p 对象的状态为失败，并设置失败的值reject("出错啦！");}, 1000);});p.catch(function (reason) {console.warn(reason);});

结果：

其实catch方法就是一个语法糖，是then方法省略了对Promise对象成功的回调。以下为用then方法实现对失败的回调，代码如下：

      const p = new Promise((resolve, reject) => {setTimeout(() => {// 设置 p 对象的状态为失败，并设置失败的值reject("出错啦！");}, 1000);});p.then(function(value){},function(reason){console.error(reason);})

结果：

【ES6】Promise相关推荐

【ES6】Promise对象详解
[ES6]Promise对象详解一.Promise对象的含义二.Promise对象的用法三.Promise对象的几个应用[重点] 1.时间延迟函数 2.图片异步加载查看更多ES6教学文章: 参 ...
【ES6】Promise用法
promise理解及使用 Promise解决的问题--异步 Promise的基本用法异步操作拒绝及中断调用链 ES6对Promise/A+的扩展 Promise.all的扩展 Promise.rac ...
【ES6】ES6编程规范编程风格
[ES6]ES6编程规范编程风格一.定义变量的规范二.字符串三.对象四.数组五.函数查看更多ES6教学文章: 参考文献引言:这是ES6系列教学的最后一篇.我们讲解一下ES6编程的规范. ...
【ES6】Module模块详解
[ES6]Module模块详解一.Module的由来二.严格模式三.export命令四.import命令查看更多ES6教学文章: 参考文献引言:由于两个JS文件之间相互使用必须通过一个ht ...
【ES6】JS类的用法class
[ES6]JS类的用法class 一.概述二.构造函数constructor 三.静态方法与静态变量查看更多ES6教学文章: 参考文献引言:由于JS之前一直没有特有的class来定义类的语法,E ...
【ES6】异步操作和async函数
[ES6]异步操作和async函数一.基本概念二.回调函数三.Promise 四.async函数查看更多ES6教学文章: 参考文献引言:ES6新增的Generato.Promise.asyn ...
【ES6】Generator函数详解
[ES6]Generator函数详解一.Generator函数简介基本概念函数写法 yield关键字介绍二.next方法的参数三.for...of循环四.关于普通throw()与Gener ...
【ES6】JS的Set和Map数据结构
[ES6]JS的Set和Map数据结构一.Set 1.基本用法 2.4种操作方法 3.4种遍历方法 4.Set的应用 1)Set转化为数组 2)去除数组的重复元素 3)实现并集(Union).交集( ...
【ES6】Proxy对象
[ES6]Proxy对象一.Proxy的基本用法二.Proxy示例的方法 1)get() 2)set() 3)apply() 查看更多ES6教学文章: 参考文献引言:ES6规范里面新增了Prox ...

【ES6】Promise

【ES6】Promise相关推荐

最新文章

热门文章