文章目录
- 一. Promise
- 二. try/catch/finally
- 三. async/await
一. Promise
promise
是一个 ES6 的语法承诺的意思,是一个专门用来解决异步 回调地狱 的问题
语法:
new Promise(function (resolve, reject) {// resolve 表示成功的回调// reject 表示失败的回调 }).then(function (res) {// 成功的函数 }).catch(function (err) {// 失败的函数 })
promise 就是一个语法
- Promise 代表一个异步操作,有三种状态:pending进行中、fulfilled(resolve)成功、rejected失败。
- 对象的状态不受外界影响,一旦状态设定,就不会再变。
- Promise对象的状态改变有两种可能:从pending变为fulfilled和从pending变为rejected。
promise原型下面三个常用的方法:
Promise.prototype.then
- Promise.prototype.catch
- Promise.prototype.finally
promise对象下面的静态方法:
Promise.all
用于将多个 Promise 实例,包装成一个新的 Promise 实例,接受一个数组作为参数,只有数组里面的每个状态都变成resolve,则新的 Promise 实例状态才会变成resolve.
Promise.race
方法同样是将多个 Promise 实例,包装成一个新的 Promise 实例,接受一个数组作为参数,只要其中有一个实例率先改变状态,则整个的状态就跟着改变。
Promise.resolve
有时需要将现有对象转为 Promise 对象,该方法就起到这个作用。
- Promise.reject
方法也会返回一个新的 Promise 实例,该实例的状态为rejected。 promise 来解决多个 ajax 发送的问题 new Promise(function (resolve, reject) { ajax({url: '第一个请求',success (res) {resolve(res) } }) }).then(function (res) { // 准备发送第二个请求 return new Promise(function (resolve, reject) { ajax({url: '第二个请求',data: { a: res.a, b: res.b },success (res) {resolve(res)}}) }) }).then(function (res) { ajax({url: '第三个请求',data: { a: res.a, b: res.b },success (res) {console.log(res)} }) })
二. try/catch/finally
- try/catch/finally 语句用于处理代码中可能出现的错误信息。
- 如果try里面的代码有错误,那么就执行catch里面的代码,同时catch的参数会返回try里面的错误信息。
- finally 语句在 try 和 catch 之后无论有无异常都会执行。
- 注意:
- catch 和 finally 语句都是可选的,但你在使用 try 语句时必须至少使用一个。
- try、catch、finally三段代码中都含有return时,则以finally中的retrun为准,其它return均无效;但是其它return之前的代码有效。
- try和catch中含有return,但是finally中不含return;则代码会在执行try/catch中return之前去执行finally中的代码块,然后再执行try中的return操作
三. async/await
async/await
是一个 es7 的语法async 其实就是promise的语法糖。函数前面必须加一个async,异步操作的方法前加一个await 关键字。顾名思义,就是让你等一下,执行完了再继续往下走。注意:await 只能在async函数中执行,否则会报错。
async:异步的意思,作用是申明一个异步函数,函数的返回值是promise 对象
await:等待
await是 async+wait 的结合 即异步等待,async和await 二者必须是结合着使用
await就是promise里面then的语法糖。
await直接拿到promise的返回值。
async和await在一个函数中存在。
匿名函数也可以使用async和await.
这个语法是 回调地狱的终极解决方案
语法:
async function fn() {const res = await promise对象 }
这个是一个特殊的函数方式
可以 await 一个 promise 对象
可以把异步代码写的看起来像同步代码
只要是一个 promiser 对象,那么我们就可以使用
async/await
来书写async function fn() {const res = new Promise(function (resolve, reject) {ajax({url: '第一个地址',success (res) {resolve(res)}})})// res 就可以得到请求的结果const res2 = new Promise(function (resolve, reject) {ajax({url: '第二个地址',data: { a: res.a, b: res.b },success (res) {resolve(res)}})})const res3 = new Promise(function (resolve, reject) {ajax({url: '第三个地址',data: { a: res2.a, b: res2.b },success (res) {resolve(res)}})})// res3 就是我们要的结果console.log(res3) }
- 这样的异步代码写的就看起来像一个同步代码了