问题:项目中有一个需求,一个tabBar下面如果没有内容就不让该tabBar显示,当然至于有没有内容,需要我们通过请求的来判断,但是由于请求是异步的,如何让请求按照tabBar的顺序进行?

方案:我们可以将promise变成下一个请求,可以利用递归来实现

实施:

//定义初始数据 requestlist就像tabBar列表

    let requestlist = [1, 2, 3, 4, 5, 6, 7,8,9];
//每个tabBar的返回数据使用reslist装起来
let reslist = [];
function startapi() {
//定义counts,用来收集请求的次数,(也可以用reslist的length进行判断)
let counts = 0; return function apirequest() {
let arg =arguments[0]
let a = new Promise((res, rej) => {
//setTimeout模拟请求到接收的时间需要5秒钟
setTimeout(function () {
res('成功返回数据'); },100)
}) //无论成功或者失败都要进行下一次,以免阻塞,成功请求的末尾有s标志,失败的末尾有f标志
a.then(() => {
counts++;
if (counts > requestlist.length) {
return;
}
console.log(counts)
//1,假设当前请求出错的时候我们认为这不合法,假设此时counts为3
if(counts==3){
throw new Error('第三个失败')
}
//2,假设当前请求下没有数据的时候我们认为不合法 ,假设此时counts为4
if(counts==4){ reslist.push(arg + 'f');
}
if(counts!=4){
reslist.push(arg + 's');
} apirequest(requestlist[counts])
console.log(reslist)
}).catch(err => { reslist.push(arg + 'f');
//递归调用
apirequest(requestlist[counts])
console.log(err)
})
} }
let newapiget = startapi();
newapiget(requestlist[0])

最终我们打印结果得到:

可以看到第三个和第四个结尾为f

js利用递归与promise 按顺序请求数据的更多相关文章

  1. js 关于setTimeout和Promise执行顺序问题

    js 关于setTimeout和Promise执行顺序问题 异步 -- Promise和setTimeout 执行顺序   Promise 和 setTimeout 到底谁先执行 定时器的介绍 Jav ...

  2. js利用递归生成随机数填充到数组

    用递归算法实现,数组长度为5且元素的随机数在2-32间不重复的值 var  array = new Array(5); function addNumToArray(array,num){     i ...

  3. Angular JS 学习笔记(自定义服务:factory,Promise 模式异步请求查询:$http,过滤器用法filter,指令:directive)

    刚学没多久,作了一个小项目APP,微信企业号开发与微信服务号的开发,使用的是AngularJS开发,目前项目1.0版本已经完结,但是项目纯粹为了赶工,并没有发挥AngularJS的最大作用,这几天项目 ...

  4. js 利用 ajax 加载 js ,显示加载进度 ,严格按照js的顺序先后加载到页面

    js 利用 ajax 加载 js ,显示加载进度 ,严格按照js的顺序先后加载到页面 , 做手机端开发时,发现一个问题,有些浏览器,在网速比较慢的情况下,js文件没有加载完,后续的调用已经开始调用了, ...

  5. 【Python】利用递归函数调用方式,将所输入的字符串,以相反的顺序显示出来

    源代码: """ 利用递归函数调用方式,将所输入的字符串,以相反的顺序显示出来 string_reverse_output():反向输出字符串的自定义函数 pending ...

  6. Node.js最新技术栈之Promise篇

    前言 大家好,我是桑世龙,github和cnodejs上的i5ting,目前在天津创业,公司目前使用技术主要是nodejs,算所谓的MEAN(mongodb + express + angular + ...

  7. 在微信小程序的JS脚本中使用Promise来优化函数处理

    在我们传统的Javascript开发函数编写中,我们习惯了回调函数的处理,不过随着回调函数的增多,以及异步处理的复杂性等原因,代码越来越难读,因此诞生了使用Promise来优化JS函数处理的需求,引入 ...

  8. 基于 Promise 的 HTTP 请求客户端 axios

    基于 Promise 的 HTTP 请求客户端,可同时在浏览器和 node.js 中使用 功能特性 在浏览器中发送 XMLHttpRequests 请求 在 node.js 中发送 http请求 支持 ...

  9. 初学seaJs模块化开发,利用grunt打包,减少http请求

    原文地址:初学seaJs模块化开发,利用grunt打包,减少http请求 未压缩合并的演示地址:demo2 学习seaJs的模块化开发,适合对seajs基础有所了解的同学看,目录结构 js — —di ...

随机推荐

  1. B2C自营商城的订单设计方案

    B2C自营商城的订单设计方案 2018年06月01日 17:19:00 lkx94 阅读数 1640   去年我们的美妆社区APP,上线了自有商城.之后经过多次版本迭代,商城系统的模块已经基本健全,值 ...

  2. python语句执行

    python文件中的语句,按顺序执行,执行import时,原文件会入栈,等import文件执行完成后,才会出栈执行. load/const.py --- import os DB_ADDRESS = ...

  3. 关于DNS

    一.什么是DNS DNS 是域名系统 (Domain Name System) 的缩写,它是由解析器和域名服务器组成的.域名服务器是指保存有该网络中所有主机的域名和对应IP地址,并具有将域名转换为IP ...

  4. CSS基础知识总结之css样式引用的三种方式

    在html中增加css样式有三种: 1.在标签中增加style属性: <!DOCTYPE html> <html lang="en" xmlns="ht ...

  5. Flink 在人工智能领域的应用实践

    人工智能是未来十年最重要的技术革命与驱动力,在各行各业产生着日益重要的作用,它与大数据的发展相辅相成,不仅推动人类社会迈入更智慧的世界,也为数据的应用带来无可估量的价值. 11 月 28 - 30 日 ...

  6. OC + RAC (十) 常用宏

    . RAC(TARGET, [KEYPATH, [NIL_VALUE]]) :用于给某个对象的某个属性绑定. // 只要文本框文字改变,就会修改label的文字 RAC(self.labelView, ...

  7. 2018 ACM-ICPC 中国大学生程序设计竞赛线上赛 D Merchandise (斜率优化)

    Description: The elderly aunts always like to look for bargains and preferential merchandise. Now th ...

  8. iOS设计模式之桥接模式

    一,什么是桥接模式 定义 抽象出层次结构.上层抽象接口的职能,实现上层抽象接口的职能,层级间的通信协议(可以抽象为接口).桥接模式的目的,就是把抽象层次结构从具体的实现中分离出来,使其能够独立变更.抽 ...

  9. 使用ant编译Android APK

    ANT —— Apache Ant is a Java library and command-line tool that help building software. 1. 部署ANT的使用环境 ...

  10. 计算一段日期内的周末天数的php代码(星期六,星期日总和)

    代码如下: /*| Author: Yang Yu <niceses@gmail.com>| @param char|int $start_date 一个有效的日期格式,例如:200910 ...