面试题:业务需要分10次请求10个接口,每个接口请求后等待2s再进行下一次请求,在不借助任何JavaScript框架或者库的前提下实现。(阿里前端面试题)

业务需要分10次请求10个接口,每个接口请求后等待2s再进行下一次请求,在不借助任何JavaScript框架或者库的前提下实现。
阿里前端面试原题

const apis = ["/api/1","/api/2","/api/3","/api/4","/api/5","/api/6","/api/7","/api/8","/api/9","/api/10"];
function request(url){
    
    
}
function sleep(time){
    
    
}
function run(){
    
    
}
run();
// 要求:每隔2s打印一个接口数据

答案1:

const apis = ["/api/1","/api/2","/api/3","/api/4","/api/5","/api/6","/api/7","/api/8","/api/9","/api/10"];
let i= 0;
function request(url){
    
    
  // 模拟请求接口并打印数据
  console.log(`请求接口:${
      
      url}`);
}
function sleep(time){
    
    
  const start = new Date().getTime();
  while (new Date().getTime() - start < time) {
    
    
    // 空循环等待
  }
}
function run(){
    
    
  if(i < apis.length){
    
    
    request(apis[i]);
    i++;
    sleep(2000);
    run();
  }
}
run();

特点:因为使用了循环语句阻塞程序,比较浪费性能,体验不好


答案2:

const apis = ["/api/1","/api/2","/api/3","/api/4","/api/5","/api/6","/api/7","/api/8","/api/9","/api/10"];
let i = 0;
function request(url){
    
    
  // 模拟请求接口并打印数据
  console.log("请求了:" + url)
}

function sleep(time){
    
    
  // 开启promise,2s后返回修改成功状态
  return new Promise(resolve=>{
    
    
    setTimeout(()=>{
    
    
      resolve()
    },time)
  })
}

async function run(){
    
    
  if(i < apis.length){
    
    
    request(apis[i])
    i++;
    // 等待promise的成功
    await sleep(2000);
    run();
  }
}
run();

特点:利用async和await阻塞程序,等待2s

猜你喜欢

转载自blog.csdn.net/weixin_41636483/article/details/131453423