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)的更多相关文章

  1. 理解koa2 之 async + await + promise

    koa是下一代的Node.js web框架. 我们首先使用koa来实现一个简单的hello world吧!假如目前的项目结构如下: ### 目录结构如下: koa-demo1 # 工程名 | |--- ...

  2. axios 等待同步请求用法及多请求并发

    axios等待同步请求 直接上代码 首先在函数中返回一个Promise对象,在调用函数使用同步函数,调用目标函数使用await等待即可 参考http://www.cnblogs.com/cckui/p ...

  3. async await promise 执行时序

    先用一个例子来说明async await promise的执行顺序 console.log('start'); async function test(){ console.log('111'); a ...

  4. 在react+redux+axios项目中使用async/await

    Async/Await Async/Await是尚未正式公布的ES7标准新特性.简而言之,就是让你以同步方法的思维编写异步代码.对于前端,异步任务代码的编写经历了 callback 到现在流行的 Pr ...

  5. axios 模拟同步请求

    axios本身没有同步请求,但是我们很多情况下必须得需要同步请求.那么应该怎么做? 上网查了一些资料有人说用es6的 async +  assert 我不知道有没有效果,因为我的功能中是没啥效果的. ...

  6. async await promise

    async 异步函数,以后可能会用得很广. 1.箭头函数: 没有{ }时不写return 也有返回值 2.Promise : 异步神器,很多异步api都是基于Promise 3.new Promise ...

  7. Async/await promise实现

    An async function can contain an await expression that pauses the execution of the async function an ...

  8. 8张图让你一步步看清 async/await 和 promise 的执行顺序

    摘要: 面试必问 原文:8张图帮你一步步看清 async/await 和 promise 的执行顺序 作者:ziwei3749 Fundebug经授权转载,版权归原作者所有. 为什么写这篇文章? 说实 ...

  9. 8 张图帮你一步步看清 async/await 和 promise 的执行顺序(转)

    https://mp.weixin.qq.com/s?__biz=MzAxODE2MjM1MA==&mid=2651555491&idx=1&sn=73779f84c289d9 ...

  10. ES6入门十一:Generator生成器、async+await、Promisify

    生成器的基本使用 生成器 + Promise async+await Promise化之Promisify工具方法 一.生成器的基本使用 在介绍生成器的使用之前,可以简单理解生成器实质上生成的就是一个 ...

随机推荐

  1. Anaconda下载安装

    下载地址: 链接:https://pan.baidu.com/s/1fmJkMSL6amJF4KP5JwklOQ 提取码:dsyc 安装完成之后,记得配置系统环境变量:

  2. Java开发学习(四十九)----MyBatisPlus更新语句之乐观锁

    1.概念 在讲解乐观锁之前,我们还是先来分析下问题: 业务并发现象带来的问题:秒杀 假如有100个商品或者票在出售,为了能保证每个商品或者票只能被一个人购买,如何保证不会出现超买或者重复卖 对于这一类 ...

  3. kafka详解(02) - kafka_2.11-2.4.1安装部署

    kafka详解(02) - kafka_2.11-2.4.1安装部署 环境准备 下载安装包 官网下载地址:https://kafka.apache.org/downloads.html 2.4.1版本 ...

  4. [LeetCode]226.翻转二叉树——递归遍历交换孩子

    题目   翻转一棵二叉树. 4 / \ 2 7 / \ / \ 1 3 6 9 //转换为: 4 / \ 7 2 / \ / \ 9 6 3 1 代码 TreeNode* invertTree(Tre ...

  5. day09-AOP-02

    AOP-02 4.问题提出 在上一篇的MyProxyProvider类中,我们的输出语句功能比较弱,在实际开发中,我们希望是以一个方法的形式,嵌入到真正执行的目标方法前,怎么办? 1.使用土方法解决 ...

  6. Flutter2.X学习之路--调试页面布局好用的办法

    Flutter里有个很好用的东西,可以方便我们来进行页面组件的布局调试,话不多说,上代码 1.找到main.dart引入rendering.dart import 'package:flutter/r ...

  7. 12月5日内容总结——JS基础知识及变量常量、基本数据类型、运算符、流程控制、函数、内置对象

    目录 一.JS简介 简介 ECMAScript的历史 二.JS基础 1.注释语法 2.引入js的多种方式 3.结束符号 三.变量与常量 编写和运行js代码的两种方式 变量声明 四.基本数据类型 1.数 ...

  8. 11月18日内容总结——同步、异步与阻塞、非阻塞的概念、创建进程的多种方式及multiprocessing模块、进程间的数据隔离和IPC机制(队列)、生产者消费者模型、守护进程、僵尸进程、孤儿进程和多进程错乱问题

    目录 一.同步与异步 同步 异步 二.阻塞与非阻塞 阻塞 非阻塞 三.综合使用 1.同步阻塞: 2.同步非阻塞: 3.异步阻塞: 4.异步非阻塞: 四.创建进程的多种方式 进程的创建 multipro ...

  9. 五、pycharm的安装与基本使用

    目录 一.pycharm的安装 1.软件介绍 2.正版安装 1.下载软件 2.安装软件 3.其他方法安装(需要先下载相关资源) ①无限试用法 ②傻瓜式激活法 ③淘宝购买 二.pycharm软件的使用 ...

  10. MySQL 如何实现表的创建、复制、修改与删除

    MySQL中如何利用代码完成表的创建.复制.修改和删除?下面总结了在创建表的时候各字段的含义以及注意哪些问题,复制和修改及删除常用的代码. 一.创建表 --创建新表,如果存在则覆盖 drop tabl ...