一.Promise解决的是将“异步过程“变成“同步过程”

1.Promise 是一个构造函数
⚫ 我们可以创建 Promise 的实例 const p = new Promise()
⚫ new 出来的 Promise 实例对象,代表一个异步操作
2. Promise.prototype 上包含一个 .then() 方法
注:prototype表示该函数的原型,也表示一个类的成员的集合。 在通过new创建一个类的实例对象的时候,prototype对象的成员都成为实例化对象的成员。 2、在new实例化后,其成员被实例化,实例对象方可调用。
⚫ 每一次 new Promise() 构造函数得到的实例对象,
⚫ 都可以通过原型链的方式访问到 .then() 方法,例如 p.then()
(1) .then() 方法用来预先指定成功和失败的回调函数
⚫ p.then(成功的回调函数,失败的回调函数)
⚫ p.then(result => { }, error => { })
⚫ 调用 .then() 方法时,成功的回调函数是必选的、失败的回调函数是可选的
(2).then() 方法的特性
如果上一个 .then() 方法中返回了一个新的 Promise 实例对象,则可以通过下一个 .then() 继续进行处理。通
过 .then() 方法的链式调用,就解决了回调地狱的问题
3.通过 .catch 捕获错误
如果不希望前面的错误导致后续的 .then 无法正常执行,则可以将 .catch 的调用提前,示例代码如下:
在这里插入图片描述
4.Promise.all() 方法
Promise.all() 方法会发起并行的 Promise 异步操作,等所有的异步操作全部结束后才会执行下一步的 .then
操作(等待机制)。示例代码如下:
在这里插入图片描述
4.Promise.race() 方法
Promise.race() 方法会发起并行的 Promise 异步操作,只要任何一个异步操作完成,就立即执行下一步的
.then 操作(赛跑机制)。示例代码如下
在这里插入图片描述

二.async代表该方法下面会调用promise请求

三.await就是“等“的意思,在实际需要调用promise的方法前添加,如果调用某个方法的返回值是promise实例,则前面可以添加await,await只能用在被async修饰的方法中

四.调用axios方法得到的返回值是promise对象

例子:
axios({
// 请求方式
method: ‘GET/POST’,
url: ‘请求的地址’,
// URL 中的查询参数
params: {
id: 1
}
}).then(function (result) {
console.log(result)
})

五.解构赋值的时候,使用:进行重命名

(1)调用axios之后,使用async+await进行简化
(2)使用解构赋值,从axios封装的大对象中,把data属性解构出来
(3)把解构出来的data属性,使用冒号进行重命名,一般都重命名为{data:res}
axios在请求到数据之后,会在真正的数据之外,套了一层壳。会得到6个属性,其中data才是真正的数据
在这里插入图片描述
解构例子:
async fangFaMing() {
const { data: res } = await axios.get(‘请求地址’)
console.log(res)
},

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐