Promise在vue项目中快速灵活的应用

Promise在vue项目中快速灵活的应用

博主个人博客网站

简介

promise和ajax功能类似，都是用来做异步请求的。promise的优势在于可以链式编程，在response还没回应时，then操作中可以把正常流程代码实现，catch捕获异常（而且可以放在最后进行统一捕获），可以不断then 下去； 前后端分离大背景下，ajax是基于原生的xhr，已经不能很好的适应mvvm这种前端模型了。

如何申明

本章主要是用来描述vue项目开发前端页面的，为何先介绍promise呢？因为vue核心组件始终是围绕着Promise展开的；如vuex.store的 actions 中方法 都是用Promise来实现的；后端api交互用的axios，也是promise封装的。

先简单申明一个Promise对象；

new Promise(   function (resolve, reject) {
    

​    // 一段耗时的异步操作

​     resolve(data) // 数据处理完成 

​    // reject('失败') // 数据处理出错   

} ) 

网上有说构造Promise时 就一个参数，有的说两个参数，都没错； 如果说一个参数，这个参数就是一个函数，如果说两个参数，指的是这个函数有两个参数。

状态变化

promise状态说明，从初始化时pending——》到resolved或rejected（只能是二者中某一种状态），在未调用resolve或reject方法时，promise都是pending状态，一旦调用了resolve或reject方法 promise就结束了，promise状态为resolved或rejected；其构造函数中不能进行其他操作了，只能进行后续的then或catch操作了（then 、catch也是promise类型对象）。

所以Promise 生命流程 只有两种状态 ；

正常的： pending状态（未调用resolve方法前）---->resolved状态；

或者失败的 ： pending状态（未调用rejecte方法前）-------> rejected状态

链式处理

re