axios 进行同步请求(async+await+promise)
axios 进行同步请求(async+await+promise)
遇到的问题介绍
将axios的异步请求改为同步请求
想到了async 和await、Promise
axios介绍
Axios 是一个基于 promise 的 HTTP 库,它支持 Promise API。
普通常见的请求
axios.post('getsomething').then(
res => {
// 进行一些操作
}
)
async 和 await
而 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 进行同步请求(async+await+promise)的更多相关文章
- 理解koa2 之 async + await + promise
koa是下一代的Node.js web框架. 我们首先使用koa来实现一个简单的hello world吧!假如目前的项目结构如下: ### 目录结构如下: koa-demo1 # 工程名 | |--- ...
- axios 等待同步请求用法及多请求并发
axios等待同步请求 直接上代码 首先在函数中返回一个Promise对象,在调用函数使用同步函数,调用目标函数使用await等待即可 参考http://www.cnblogs.com/cckui/p ...
- async await promise 执行时序
先用一个例子来说明async await promise的执行顺序 console.log('start'); async function test(){ console.log('111'); a ...
- 在react+redux+axios项目中使用async/await
Async/Await Async/Await是尚未正式公布的ES7标准新特性.简而言之,就是让你以同步方法的思维编写异步代码.对于前端,异步任务代码的编写经历了 callback 到现在流行的 Pr ...
- axios 模拟同步请求
axios本身没有同步请求,但是我们很多情况下必须得需要同步请求.那么应该怎么做? 上网查了一些资料有人说用es6的 async + assert 我不知道有没有效果,因为我的功能中是没啥效果的. ...
- async await promise
async 异步函数,以后可能会用得很广. 1.箭头函数: 没有{ }时不写return 也有返回值 2.Promise : 异步神器,很多异步api都是基于Promise 3.new Promise ...
- Async/await promise实现
An async function can contain an await expression that pauses the execution of the async function an ...
- 8张图让你一步步看清 async/await 和 promise 的执行顺序
摘要: 面试必问 原文:8张图帮你一步步看清 async/await 和 promise 的执行顺序 作者:ziwei3749 Fundebug经授权转载,版权归原作者所有. 为什么写这篇文章? 说实 ...
- 8 张图帮你一步步看清 async/await 和 promise 的执行顺序(转)
https://mp.weixin.qq.com/s?__biz=MzAxODE2MjM1MA==&mid=2651555491&idx=1&sn=73779f84c289d9 ...
- ES6入门十一:Generator生成器、async+await、Promisify
生成器的基本使用 生成器 + Promise async+await Promise化之Promisify工具方法 一.生成器的基本使用 在介绍生成器的使用之前,可以简单理解生成器实质上生成的就是一个 ...
随机推荐
- 痞子衡嵌入式:探讨i.MXRT下FlexSPI driver实现Flash编程时对于中断支持问题
大家好,我是痞子衡,是正经搞技术的痞子.今天痞子衡给大家介绍的是i.MXRT下FlexSPI driver实现Flash编程时对于中断支持问题. 前段时间有客户在官方社区反映 i.MXRT1170 下 ...
- Spark详解(05-1) - SparkCore实战案例
Spark详解(05-1) - SparkCore实战案例 数据准备 1)数据格式 本项目的数据是采集电商网站的用户行为数据,主要包含用户的4种行为:搜索.点击.下单和支付. (1)数据采用_分割字段 ...
- 实现简单的csv文件上传和bootstrap表格的下载
一.写一个简单的页面并发送文件 引入bootstrap.js,jQuery.js等,具体的网页就不细写了,很简单. 加入input框,button控件,进度条.如下: <li class=&qu ...
- P1005 [NOIP2007 提高组] 矩阵取数游戏
题目传送门 前言 今天依旧是不写高精的一天呢!(是的,这位作者又只拿了开 \(LL\) 的 \(\color{yellow}{60}\) 分) 思路描述 看到数据 \(n,m \le 80(30)\) ...
- Hexo博客搭建记录
Hexo博客搭建记录 参考视频:手把手教你从0开始搭建自己的个人博客 |无坑版视频教程 以下命令操作建议使用管理员权限完成 1. nodejs & hexo 安装 1.首先下载node.js, ...
- pycharm下载安装与基本配置
pycharm下载安装与基本配置 1.简介 PyCharm是一种Python IDE(Integrated Development Environment,集成开发环境),带有一整套可以帮助用户在使用 ...
- 洛谷 P1208混合牛奶 题解
一道贪心算法不是很明显的题目,其实一般的递推也可以做. 大体思路:肯定优先购买单价最低的奶农的牛奶,那么就需要先根据牛奶单价进行排序,这里用结构体会更好一点.之后在从前往后一个一个枚举,直至购买的牛奶 ...
- Angular基础之ngFor遍历对象数组获取key和value渲染页面的几种方法
Angular的ngFor遍历对象数组的几种方法 方法一 ts文件: export class MyDemo { objectKeys = Object.keys; myObj = { a: ...
- Quartz.Net 官方教程 Tutorial 3/3
Schedule 相关属性设置 扩展属性方式 var host = Host.CreateDefaultBuilder() .ConfigureServices(services => { se ...
- 支付对接常用的加密方式介绍以及java代码实现
京东科技 姚永健 一.术语表: 1.对称算法 加密解密密钥是相同的.这些算法也叫秘密密钥算法或单密钥算法,它要求发送者和接收者在安全通信之前,商定一个密钥.对称算法的安全性依赖于密钥,泄漏密钥就意味着 ...