es6pomise用法例子(es6中的pomise)

导语：ES6——Promise使用经验

ES6中，promise是经常使用的对象。

通过promise实例，可以实现对异步代码的封装，保证当异步代码执行完成后再执行后续处理代码。

Promise的基本使用

resolve函数的结果可以通过then()方法接收，reject函数的结果可以被catch()方法接收

valid(){ return new Promise((resolve,reject)=>{ if(this.flag){ return resolve(true) } this.$refs.form.validate((valid) => { if(valid){ resolve(valid) } else{ reject(valid); } }) }) }

因为element-ui中的表单自带validate操作是异步操作，所以我将校验方法封装在Promise实例中，当校验过程结束后调用then方法就可以执行后续的操作。

当promise对象实例化的时候，就会执行promise内部的代码。

注意，promise实例只能保证其内部的异步操作执行完成后，再被then或者catch方法捕捉。

如下所示。

let valid = this.valid();console.log("第一步")valid.then((value)=>{ console.log("第三步") console.log("校验完成,校验结果无误") }).catch((error)=>{ console.log("校验校验完成,校验结果有误") })console.log("第二步")

Promise.all()和Promise.race()

all和race方法，都是接收一个promise实例数组。

all方法是按照数组中的顺序进行执行promise操作，race方法并不能确定。

区别在于，all方法是当所有的promise执行完成后才会进入then或者有一个rejcet后进入catch；而race方法是由第一个promise完成的状态来决定。

race方法，个人用的比较少，不做多的分享。

all方法，虽然是按照数组中的promise实例的顺序来执行，但是并不能保证哪个promise先执行完成，所有在必须有先后完成顺序时，建议不要使用all方法

Promise.resolve()和Promise.reject()

这两个相当于是实例化promise的一种简约写法

export const fetch = (url) => { return Vue.axios({ method: 'get', url: url, }).then(function(response) { return Promise.resolve(response.data); }).catch((error) => { if(error.response.status===302){ router.push('/login') return Promise.reject("登录失效，请重新登录"); }else{ return Promise.reject(error.statusText); } });}

他可以将数据或者方法进行Promsie转换，使他成为promise的一个实例，能被对应的.then和.catch捕获

免责声明:本站部份内容由优秀作者和原创用户编辑投稿，本站仅提供存储服务，不拥有所有权,不承担法律责任。若涉嫌侵权/违法的，请反馈，一经查实立刻删除内容。本文内容由快快网络小涵创作整理编辑！