开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

社区首页 >专栏 >axios 进行同步请求(async+await)

axios 进行同步请求(async+await)

跟着阿笨一起玩NET

发布于 2020-10-09 11:30:06

16.3K0

发布于 2020-10-09 11:30:06

举报

文章被收录于专栏：跟着阿笨一起玩NET跟着阿笨一起玩NET

介绍

Axios 是一个基于 promise 的 HTTP 库，它支持 Promise API。

像这样：

axios.post('getsomething').then(
	res => {
		// 进行一些操作
	}
)

而 async/await 是一种建立在Promise之上的编写异步或非阻塞代码的新方法。async 是异步的意思，而 await 是 async wait的简写，即异步等待。

所以从语义上就很好理解 async 用于声明一个函数是异步的，而await 用于等待一个异步方法执行完成。

那么想要同步使用数据的话，就可以使用 async+await 。

代码示例

模拟一次异步请求

// 假设这是我们要请求的数据
function getSomething(n) {
    return new Promise(resolve => {
        // 模拟1s后返回数据
        setTimeout(() => resolve(222), 1000);
    });
}

function requestSomething() {
    console.log(111);
    getSomething().then(res => console.log(res));
    console.log(333);
}
requestSomething() //这个时候会输出 111，333，222

// 如果想要等数据返回后再执行后面的代码，那么就要使用 async/await
async function requestSomething() {
    console.log(111);
    // 这时something会等到异步请求的结果回来后才进行赋值，同时不会执行之后的代码
    const something = await getSomething();
	console.log(something)
    console.log(333);
}
requestSomething() //这个时候会输出 111，222，333

介绍

Axios 是一个基于 promise 的 HTTP 库，它支持 Promise API。

像这样：

axios.post('getsomething').then(
	res => {
		// 进行一些操作
	}
)

而 async/await 是一种建立在Promise之上的编写异步或非阻塞代码的新方法。async 是异步的意思，而 await 是 async wait的简写，即异步等待。

所以从语义上就很好理解 async 用于声明一个函数是异步的，而await 用于等待一个异步方法执行完成。

那么想要同步使用数据的话，就可以使用 async+await 。

代码示例

模拟一次异步请求

// 假设这是我们要请求的数据
function getSomething(n) {
    return new Promise(resolve => {
        // 模拟1s后返回数据
        setTimeout(() => resolve(222), 1000);
    });
}

function requestSomething() {
    console.log(111);
    getSomething().then(res => console.log(res));
    console.log(333);
}
requestSomething() //这个时候会输出 111，333，222

// 如果想要等数据返回后再执行后面的代码，那么就要使用 async/await
async function requestSomething() {
    console.log(111);
    // 这时something会等到异步请求的结果回来后才进行赋值，同时不会执行之后的代码
    const something = await getSomething();
	console.log(something)
    console.log(333);
}
requestSomething() //这个时候会输出 111，222，333

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2020-10-04 ，如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自作者个人站点/博客前往查看

如有侵权，请联系 cloudcommunity@tencent.com 删除。

本文参与腾讯云自媒体同步曝光计划，欢迎热爱写作的你一起参与！

评论

登录后参与评论

0 条评论

热度

最新

LV.

目录

代码示例
介绍
代码示例