ES6 Promise对象then方法链式调用

说明请看注释

 /*** then()方法会返回一个新Promise对象， * 所以then后面可以继续跟一个then方法进行链式调用， * 如果then方法的回调函数有返回数据，* 那么这个数据会作为下一个then的回调函数的参数，* 如果不需要返回数据，则return可不写*/{let p = new Promise((resolve, reject) => { setTimeout(resolve, 1000, 'success'); }); p.then(res => {console.log(res); return `${res} again`; }).then(res => console.log(res));}/*** 结果为：* success* success again*//*** 但是then的回调函数也可能会返回一个Promise对象，* 这个时候就会覆盖then自己返回的Promise对象（懂原理的人其实发现了，这个理解是错的，但是比较具象，而且这样理解对最终结果没有影响），* 而且return是必须的*/{let p = new Promise((resolve, reject) => { setTimeout(resolve, 1000, 'success'); }); p.then(res => {console.log(res); return new Promise((resolve, reject) => { setTimeout(resolve, 1000, 'success'); });}).then(res => console.log(res));}/** * 结果为： * success * success*/

以下是一个更复杂的写法，我们按照做饭——吃饭——洗碗的步骤，看看怎么使用链式调用

   //做饭 function cook(){ console.log('开始做饭。'); var p = new Promise(function(resolve, reject){ //做一些异步操作setTimeout(function(){ console.log('做饭完毕！'); resolve('鸡蛋炒饭'); }, 1000); }); return p;} //吃饭 function eat(data){console.log('开始吃饭：' + data); var p = new Promise(function(resolve, reject){ //做一些异步操作 setTimeout(function(){console.log('吃饭完毕!'); resolve('一只碗和一双筷子'); }, 1000); });return p;} // 洗碗function wash(data){ console.log('开始洗碗：' + data);var p = new Promise(function(resolve, reject){ //做一些异步操作 setTimeout(function(){ console.log('洗碗完毕!');resolve('干净的碗筷'); }, 1000); }); return p; }// 链式调用cook().then(function(data){ return eat(data); // 返回一个Promise实例}).then(function(data){ return wash(data); // 返回一个Promise实例}).then(function(data){console.log(data); });// 链式调用简化写法cook().then(eat).then(wash).then(function(data){ console.log(data); });

注意：then可以有两个回调函数作为参数，第一个是当promise状态为解决时的回调，第二个是promise的状态为失败时的回调。
如果发生异常，则会进入catch中，避免js卡死
如果promise发生异常，则会进到then第二个参数的回调函数，如果这个参数不存在，则进到catch中

 let p = new Promise((resolve, reject) => { throw new Error('some errors')// resolve()// reject()}); p.then(res => { console.log('1111') },res => {console.log('2222')}).catch(e => {console.log('3333')})/*** 结果为：* 2222*/

超级简单！

ES6 Promise对象then方法链式调用相关推荐

ES6——Promise 对象
所谓Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果.从语法上说,Promise 是一个对象,从它可以获取异步操作的消息.Promise 提供统一的 A ...
es6 --- promise.prototype.then的链式引用
很多时候,我们需要使用ajax请求获取数据A.并使用A中的数据A.a来进行下一步的Ajax操作- 下面使用promise.prototype.then的链式引用来实现 // 首先封装一个getJSON ...
ES6 Promise对象和then()的用法
Promise 对象概述是异步编程的一种解决方案. 从语法上说,Promise 是一个对象,从它可以获取异步操作的消息. 状态 Promise 异步操作有三种状态:pending(进行中).ful ...
ES6 Promise 对象
前言开篇首先设想一个日常开发常常会遇到的需求:在多个接口异步请求数据,然后利用这些数据来进行一系列的操作.一般会这样去写: $.ajax({url: '......',success: functi ...
javascript之异步操作理解---回调函数，async，await以及promise对象
javascript之异步操作理解---回调函数,async,await以及promise对象概述概述写在前面:虽然平时做项目,但是发现自己写的代码还是很烂.最近接触了一个对性能要求比较高的项目 ...
jQuery deffered和promise对象方法
一.前言为了让前端们从回调的地狱中回到天堂,jQuery也引入了Promise的概念.Promise是一种令代码异步行为更加优雅的抽象,有了它,我们就可以像写同步代码一样去写异步代码.jQuery从 ...
彻底掌握 Promise-原生Promise的实现(二) Promise的链式调用
在彻底掌握 Promise- 原生 Promise 的实现(一) 已经初步实现了 promise 的简易版本,这距离实现完整版本的 Promise 还有一段距离,下面我们将在简易版本的基础上增加 P ...
javascript --- 对象的方式体验链式调用
将功能相近的方法写入同一个对象中,是一个很好的编程习惯,便于后期的维护和前期的开发. foo1 var fooObj = {foo1: function() {console.log('foo1'); ...
ES6 Promise - 让我们解开的面纱（遵循Promise/A+规范)
Promise 对象代表了未来将要发生的事件,用来传递异步操作的消息.ECMAscript 6 原生提供了 Promise 对象.而且ES7中的async/await也是Promise基础实现的.Pr ...

ES6 Promise对象then方法链式调用

ES6 Promise对象then方法链式调用相关推荐

最新文章

热门文章