使用async, await处理异步请求。用Promise， setTimeout函数模拟后台接口

<!DOCTYPE html>

<html>

<script type="text/javascript">

var arr=[];

var batchSize = 10;

for(i=0;i<30;i++){ arr.push(i);}

function b(startIdx, endIdx){

	return new Promise((resolve, reject)=> {

		setTimeout(()=>{

			let arrexc = arr.slice(startIdx, endIdx);

			for(j = 0; j< arrexc.length; j++){

				console.log("exec", arrexc[j]);

			}

			console.log("called a service:" + new Date().getTime());

			resolve("ok");

		}, 1000);

	});

	//return "called a service no promise";

}

async function a(){

	let startIdx = 0;

	let endIdx = startIdx + batchSize;

	while(arr.length > endIdx) {

		let res = await b(startIdx, endIdx);

		//let res = b();

		console.log(res);

		startIdx = endIdx;

		endIdx = endIdx + batchSize;

	}

}

</script>

<button onclick="a()">click</button>

</html>

运行结果

相关知识：

Rxjs forkJoin方法：

forkJoin([

      this.aService.getData(),

      this.bService.getData()

    ]).subscribe(resArr => {

      // 此时的返回结果将被按顺序放在一个数组中

      aData = resArr[0];

      bData = resArr[1];

  }

Promise.all()方法

const promise1 = Promise.resolve(3);

const promise2 = 42;

const promise3 = new Promise((resolve, reject) => {

  setTimeout(resolve, 100, 'foo');

});

Promise.all([promise1, promise2, promise3]).then((values) => {

  console.log(values);

});

// Expected output: Array [3, 42, "foo"]

JS模拟循环批量请求后台接口的更多相关文章

  1. Node.js模拟发起http请求从异步转同步的5种方法

    使用Node.js模拟发起http请求很常用的,但是由于Node模块(原生和第三方库)提供里面的方法都是异步,对于很多场景下应用很麻烦,不如同步来的方便.下面总结了几个常见的库API从异步转同步的几种 ...

  2. mock.js模拟ajax数据请求

    在我们开发过程中存在着前端页面ui完成了,但是没有接口进行联调数据的情况,现在介绍一下用mock.js来完成数据的请求.这样在后期我们的后台接口完成后只需要更改请求的接口名字即可!前提是你的模拟字段名 ...

  3. 利用在线HTTP接口测试工具ApiPost，模拟移动端请求API接口

    我们做开发一般都是在PC端,然而我们很多时候需要模拟移动端进行接口请求. 比如,当一个API需要根据用户不同的终端来返回不同的数据时,就需要一个工具来模拟不同的终端了. 利用接口测试工具ApiPost ...

  4. jQuery请求后台接口

    function test() { console.log("请求准备发送"); $.ajax({ type : "POST", url : "/ap ...

  5. 【11】ajax请求后台接口数据与返回值处理js写法

    $.ajax({ url: "/test.php",//后台提供的接口 type: "post",   //请求方式是post data:{"type ...

  6. dva框架使用mock.js模拟数据 + fetch请求数据

    what DVA? Dva是基于Redux做了一层封装,对于React的state管理,有很多方案,我选择了轻量.简单的Dva. dva 可以很方便就使用mock.js进行数据的模拟. 只需要三步,即 ...

  7. vue-resource post请求后台接口报400（跨域问题解决方法）

    1.打开config/index.js,在proxyTable中添写如下代码 proxyTable: { '/api': { //使用"/api"来代替"http://f ...

  8. vue_axios请求后台接口cookie无法传值

    2018年3月7日: 当我们使用http向后台发送请求的时候,需要通过cookie把一些密匙传递给后台做判断授权登陆,当然前提是后台会先把cookie保持到本地. 使用vue开发的时候,会出现这个问题 ...

  9. ES6+Vue+webpack项目，在ie11中请求后台接口后数据更新，但是页面没有刷新？

    因为ie11下,如果GET请求请求相同的URL,默认会使用之前请求来的缓存数据,而不会去请求接口获取最新数据,我用的解决方法是在每个请求发送前,拦截请求并给请求接口的URL后加一个时间戳(new Da ...

  10. java前端跨域请求后台接口

    response.setHeader("Access-Control-Allow-Origin", "*"); /* 星号表示所有的域都可以接受, */ res ...

随机推荐

  1. [FAQ] PHPStorm None project files detection

    当你发现在 phpstorm 中编辑项目文件,却提示 None project files detection.. 并且左侧 Project 下面只有文件,没有项目目录了. 此时可以删除项目目录下的 ...

  2. [Contract] web3.eth.getAccounts, web3.eth.getCoinbase 使用场景区别

    web3.eth.getAccounts() 返回节点控制的账号列表(Promise returns Array) web3.eth.getCoinbase() 返回挖矿奖励所归集的地址(Promis ...

  3. 如何参与 .NET 的开发和设计

    现在 dotnet 属于 dotnet 基金会,所有开发者都可以向 dotnet 贡献代码和参与 .NET 的设计,参与路线决策.本文来告诉大家一些基本玩法,带着小伙伴们入坑 注意哦,参与 dotne ...

  4. 2019-9-2-C#-设计模式-责任链

    title author date CreateTime categories C# 设计模式 责任链 lindexi 2019-09-02 12:57:37 +0800 2018-2-13 17:2 ...

  5. 通过Ingress-nginx实现灰度发布---灰度发布(22)

    1.通过Ingress-nginx实现灰度发布 场景一: 将新版本灰度给部分用户 假设线上运行了一套对外提供 7 层服务的 Service A 服务,后来开发了个新版本 Service A' 想 要上 ...

  6. Docker部署Scrapy-redis分布式爬虫框架（整合Selenium+Headless Chrome网页渲染）

    前言 我的京东价格监控网站需要不间断爬取京东商品页面,爬虫模块我采用了Scrapy+selenium+Headless Chrome的方式进行商品信息的采集. 由于最近爬虫用的服务器到期,需要换到新服 ...

  7. .Net 8.0 下的新RPC，IceRPC之使用Dev Containers进行 .NET QUIC 精简开发

    作者引言 很高兴啊,我们来到了IceRPC之使用Dev Containers进行 .NET QUIC 精简开发,主要是一篇指引,如何使用开发容器做为开发环境,进行开发IceRPC,可适用于任务应用的开 ...

  8. XOps笔记

    当前是 Ops盛行的时代,在互联网圈内的你一定经常都会听到这些名词,DevOps.DevSecOps.GitOps.NetOps.ItOps.Aiops.DataOps.MLOps.NoOps:无论是 ...

  9. Linux中的touch命令

    Linux中一个文件有3种时间属性,分别是mtime,ctime,atime: modification time (mtime) 当该文件的『内容数据』变更时,就会升级这个时间!内容数据指的是文件的 ...

  10. JavaScript算法---基础排序类

    <html> <script> //正序排序,把大的放到最后,arr[j]>arr[j+1] let fz=(arr)=>{ for(let len=arr.len ...