美文网首页
异步处理之promise

异步处理之promise

作者: 飞呀飞哥 | 来源:发表于2016-08-19 15:54 被阅读0次

promise并不是一个新技术了,在Q库、angular的$q、jquery的deferred等我们都已经见识过并运用过,它带来的好处不言而喻,减少callback、减少代码嵌套(程序员应该都反感这些)。

如今ES6原生提供了promise,promise也成为了标准的异步处理方式。

以往javascript中处理异步,大多数会用到回调函数,如下:

回调写多了之后,就会有嵌套过深,或者代码可读性差,等等问题(我就不详述了),有追求的程序员肯定都想寻找其他方法,因此我们讲讲promise。

Promise是把类似的异步处理对象和处理规则进行规范化,并采用统一的接口来编写,采取规范之外的写法都会出错。如下写法:

这到底和回调函数有哪些不同呢?在使用promise进一步处理时,我们必须按照规定的方法编写处理代码,也就是说,除了promise对象规定的方法(这里的then、catch)之外的方法都是不可用使用的,而不会像回调函数那样可以自己自由的定义回调函数的参数,而必须严格遵守固定、统一的编程方式来编写代码。这样,基于Promise的统一接口的做法, 就可以形成基于接口的各种各样的异步处理模式,并且将复杂的异步处理方式简单化,所以我们为什么不去用它呢?

如何使用promise

创建一个promise的流程,现在技术超前的浏览器都已经内置promise了,因此我们可以正常使用

1.new promise(fn) 返回一个promise对象

2.在fn中指定异步等处理  

    1. 结果处理正常的, 调用resolve方法并返回结果值

    2.结果处理异常时,调用reject方法并返回异常信息。

3.使用promise对象处理后续操作,

    1.写法一  

    promise.then(function(result){

         上述异步处理正常时,运行此方法,并返回结果值

    }, function(err){

         上述异步处理异常时,运行此方法,并返回err

    })

   2.写法二

    promise.then(function(result){

          上述异步处理正常时,运行此方法,并返回结果值

    }).catch(function(err) {

          上述异步处理异常时,运行此方法,并返回err

    })

promise创建流程很简单,下面上实例代码:

上述getUrl()方法只有返回状态码等于200时,才会调用resolve,也就是结果正常处理,其他情况则调用reject。这样处理结果是不是把之前必须使用回调函数嵌套的方式,改成了更为直观同步代码处理方式,更符合我们思维的方向(it男有些想法难以表达。。)。

其实promise并不是什么黑盒子,相反及其简单,功能却很强大,另外还有更多的使用方式,更多详细还是需要自己去探究啊

相关文章

  • 《JS原理、方法与实践》- ES6新增对象(下篇)

    异步处理(Promise) ES2015中新增的Promise对象专门用于处理异步。Promise对象使用then...

  • ES6-Promise

    构建Promise,异步实例 处理多个Promise实例 — Promise.all() 处理多个Promise实...

  • 异步处理之promise

    promise并不是一个新技术了,在Q库、angular的$q、jquery的deferred等我们都已经见识过并...

  • ES6 Primise异步编程

    异步操作流程化的手段 #Promise处理异步操作 Promise,使异步操作变得流程化的手段之一,例如“异步A ...

  • react 中的 promise详解

    一、promise是什么?为什么会有promise? 首先,promise是js的抽象异步处理对象实现异步编程的方...

  • [iOS][OC] 看 BRYSerialAnimationQu

    背景 上文 《自定义 Promise 处理串行的异步操作》 分析了串行的异步操作的自定义 Promise 处理。P...

  • Promise基础用法

    > 简述: ## 什么是Promise? -Promise是用来处理异步的; -Promise就是承诺,对未来的承...

  • 异步中forEach/map与async/await使用踩坑

    在使用promise处理异步问题时,遇到坑 前端有些异步效果可以使用promise解决 forEach/map与a...

  • Vue-promise使用(十)

    promise是处理异步的利器,让异步代码变得干净和直观,让异步代码变得井然有序1、创建promise实例1)pr...

  • promise学习

    1. 什么是promise promise抽象异步处理对象以及对其进行各种操作的组件.js中处理异步一般都是通过回...

网友评论

      本文标题:异步处理之promise

      本文链接:https://www.haomeiwen.com/subject/anubsttx.html